CSC/ECE 517 Fall 2023 - E2381. Reimplement frontend for Assignments: Difference between revisions

From Expertiza_Wiki
Jump to navigation Jump to search
Line 1: Line 1:
== Description of Project ==
== Description of Project ==


The project focuses on the reimplementation of the frontend for assignments in Expertiza, utilizing React and Typescript. In the new implementation, the backend and frontend applications have been decoupled, allowing for more flexibility in the technology stack. The specific components under consideration are the pages for listing, creating, editing, and deleting assignments. Previously relying on a Ruby template parser, the new approach leverages React JS for enhanced modularity and efficiency.
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:


By reimagining the assignment management frontend, this project aims to bring a modern, responsive, and efficient interface to Expertiza, aligning with contemporary web development standards. The use of React and Typescript ensures a robust foundation, fostering maintainability and scalability in the long run.
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 ==
== Technologies Used ==

Revision as of 02:30, 6 December 2023

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

Contributors

Group members:

Siddhi Mule

Rishab Muzhangathu

Aditi Gulabchand Varma

Mentor:

Renji Joseph Sabu

Retrieved from "https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Fall_2023_-_E2381._Reimplement_frontend_for_Assignments&oldid=152780"