MERN Full Stack List Guide

Backend Code Files

Frontend Code Files

Videos (Coming Soon)

Backend
Database
  • What is the database?
  • Create required default code for database setup
  • Create the database
CRUD
  • Introduce CRUD
Backend controllers
  • Create required default code for controllers
  • Create controller for adding a new document
  • Create controller for reading all documents
  • Create controller to read one document
  • Create controller to update one document
  • Create controller to delete one document
Routes
  • Create required default code for routes
  • Create route for adding a new document
  • Create route for reading all documents
  • Create route to read one document
  • Create route to update one document
  • Create route to delete one document
Testing
Postman
  • Create two records using post
  • Read all records using post
Robo3T
  • View the records in the database
Mongo Studio
  • View the records in the database
Frontend
FetchAPI
  • Create default code for fetch setup
  • Create fetch for adding a new document
  • Create fetch for reading all documents
  • Create fetch to read one document
  • Create fetch to update one document
  • Create fetch to update one document
  • Create fetch to delete one document
Frontend Controllers
  • Create required default code for frontend controllers
  • Create function for adding a new document
  • Create function for reading all documents
  • Create function do read one document
  • Create function to update one document
  • Create function to delete one document
DocumentList  Component
  • Create default code required for DocumentList component
  • Create the state that will be used in the component
  • Create the functions that will be sue din the component
  • Create code required to display jsx in the browser
  • Create basic jsx
Document - New Item Form
  • Create jsx for the new item form
DocmentList - Display list items
  • Create jsx to display list
DocumentList - Display list items
  • Create jsx to display list
DocmentList - Delete list items
  • Create jsx for the delete item form
EditDocument Component
  • Create default code required for EditDocument component
  • Create the state that will be used in the component
  • Create the function that will be used in the component
  • Create code required to display jsx in the browser
  • Create basic jsx
Edit Document - Edit Form
  • Create jsx to edit the form