Layered
- React Native course
- Expert
- Lesson 14/47
- 5 min
Learn layered architecture.
Layered architecture
Layered architecture splits code into horizontal layers: presentation, business and data. Each layer only accesses one layer below; the reverse is not allowed.
The presentation layer draws components, the business layer runs logic, the data layer talks to the API or database. This separation improves testability; the UI can be tested with mock data.
One-way dependency
The core rule of layered architecture is one-way dependency. The presentation layer calls the business layer, which calls the data layer. The data layer cannot call the presentation directly.
This way, if the data layer changes, only the business layer is affected; the presentation stays independent. Reverse dependencies create cycles and make testing harder.
Practice Write a DataService
Write a DataService class or object. It should have a fetchUser(id) method that calls fetch. Export it with export.
Starter code
// Define the data service here
export default DataService;Sample solution
// Define the data service here
const DataService = {
fetchUser: (id) => fetch(`/api/users/${id}`)
};
export default DataService;Questions and answers
Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.
1 Write the top layer name
Layered mimaride en üst katman ____ katmanıdır; bileşenleri çizer.
Layered mimaride en üst katman presentation katmanıdır; bileşenleri çizer.
Explanation: The presentation layer is on top.
2 What can the data layer call in a layered architecture?
- Only external services/APIs
- The presentation layer Correct answer
- Components
- Hooks
Explanation: The data layer only calls external sources.
3 Match the layers
| Term | Meaning |
|---|---|
Presentation |
Draws components |
Business |
Runs logic |
Data |
Talks to API |
Mock |
Test data |