Hello, dear friend, you can consult us at any time if you have any questions, add WeChat: THEend8_
CSI3131 – Lab5 Page Replacement Algorithms
Designing and implementing a complete web app using MERN stack
Exercise 1
Create an Express Rest API which exposes CRUD functionalities for a student/course system. Create a student model which describes student information (student number, password, first name, last name, address, city, phone number, email, program) and also a course model which describes course information (course code, course name, section, semester). The information should be stored in a MongoDB database. Use ref to allow a student document to make a reference to corresponding course document. Provide authentication/authorization capabilities using JWT or Passport.
Create a React front end that allows students to login, add a course, update a course (for example change the section), drop a course, list all the courses taken by a student, list all students, list all courses, and list all students that are taking a given course.
Apply MVC principles for the Express API. Use functional components, composition, and React Hooks for the React front-end. Design nice and friendly UI.
(10 marks)
Evaluation:
Functionality(including code explanation): | |
React front-end (Correct components, forms, event handling, login) | 35% |
MongoDB database (config files, models) | 10% |
Express Rest API (Correct models, controllers, routes code, Correct implementation of MVC architecture, authentication/authorization, Correct server.js, express.js, mongoose.js and config.js files) | 35% |
Friendliness (using CSS to align the React elements, React-Bootstrap, etc.) | 10% |
Innovative features (extensive use of ES6+ syntax, UI design, etc.) | 10% |
Total | 100% |
VS Code Project Naming rules:
You must name your VS Code project/folder according to the following rule:
YourFullName_COMP308LabNumber_ ExNumber.
Example: JohnSmith_COMP308Lab2_ Ex1
Submission rules:
Remove the node_modules folder before zipping the project. Submit your project as a zip file that is named according to the following rule:
YourFullName _COMP308LabNumber_ExNumber.zip
Example: JohnSmith_COMP308Lab2_Ex1.zip
DO NOT use RAR or other types of archives.
Demonstration Video – Recording Instructions
Please record a short video (max 3-4 minutes) to demonstrate your assignment solution. You may use the Windows 10 Game bar to do the recording:
(If it disappears on you, press Win + G again to bring the Game Bar back.).
You’ll find your recorded video (MP4 file), under the Videos folder in a subfolder called Captures.
Submit the video together with your solution.