Models: It connect with database and we use in controllers. (Intermediary between database and controllers)
Controllers: It does our logic for each endpoint. (Intermediary between Models and Routes)
Routes: It has a call route method (example: GET /api/users) and the controller to execute when it is call (Intermediary between controllers and Frontend)
Frontend:
Simply call to your api endpoint with fetch, axios or your library selected)
Example flow with fetch and express in backend:
//FrontendconstgetUsers=async()=>{constresponse=awaitfetch('https://yourapi.com/api/users');constdata=awaitresponse.json();returndata;//Our users}//Backend//./routes///If we recieve a call to /api/users we call to usersControllerapp.get('/api/users',usersController)// ./controllersconstusersControllers=()=>{constusers=modelUser.get();//Ey model give me users from database//Do logic with our users and return it}// ./modelsconstmodelUser={get:()=>databaseCall('SELECT * FROM users');//Ey database give me users}
In this way:
Do you change de database? Only modify the model
Do you change your logic? Only modify the controller
Do you change your routing? Only modify the route
Backend:
Frontend:
Example flow with fetch and express in backend:
In this way:
Do you change de database? Only modify the model
Do you change your logic? Only modify the controller
Do you change your routing? Only modify the route
This was a really good explanation! Thank you.