CSC/ECE 517 Fall 2023 - E2381. Reimplement frontend for Assignments
Description of Project
This project focuses on creating User Interfaces for the Assignment SubSection of the Manage Section of the website using React JS. Previously, Ruby template parser was used for building the application. However, in the new implementation, the backend and frontend applications have been separated and they are run independently. This allows us to have more flexibility with the technology stack. It is for this reason, the frontend application is being developed using React JS. The components that we are responsible for are the pages for Assignment and all the CRUD functionality associated with it . In the new implementation, we reimplement these pages by making use of React JS with Typescript. Following are the changes that will be done in the new implementation:
1. Render the data on the respective pages in a tabular format shown in the previous designs.
2. Provide the buttons for creating, editing and deleting entities depending on the pages in the tables.
3. Displaying appropriate alerts after any changes are made (create/edit/delete).
4. Integrate the frontend functionalities mentioned with the backend.
Technologies Used
1. ReactJs
2. React-Bootstrap for styling the pages of the components mentioned.
Changes
- Enhance assignment management UI for improved clarity and intuitiveness, inspired by the existing theme.
- Implement React and Typescript for modern frontend development, ensuring maintainability and scalability.
- Adhere to coding standards, emphasizing component reuse, single responsibility, meaningful naming, and Typescript usage.
- Utilize a tabular format for assignment listing, with buttons for editing, deleting, and creating assignments.
- Maintain UI theming consistency with Expertiza, drawing inspiration from the Users page.
- Introduce responsive alert notifications for immediate user feedback on assignment-related actions.
Files Added
# | Change | Rationale |
---|---|---|
1 | Updated check_reset_url method name to check_token_validity
|
The method validates that the password reset token is valid and present. The updated method name provides a more functionally descriptive name. |
2 | Updated check_reset_url method name to check_token_validity
|
The method validates that the password reset token is valid and present. The updated method name provides a more functionally descriptive name. |
3 | Updated check_reset_url method name to check_token_validity
|
The method validates that the password reset token is valid and present. The updated method name provides a more functionally descriptive name. |
4 | Updated check_reset_url method name to check_token_validity
|
The method validates that the password reset token is valid and present. The updated method name provides a more functionally descriptive name. |
Designs
List
Assignment view for students in old Expertiza.
Create
Assignment submission for students in old Expertiza.
Update
Editing assignment for instructors in old Expertiza.
Delete
Assignment view in current Expertiza.
Useful Links
- Github Repository: https://github.com/R3Rex31/reimplementation-front-end
Contributors
Group members:
Siddhi Mule
Rishab Muzhangathu
Aditi Gulabchand Varma
Mentor:
Renji Joseph Sabu