Kanbas is a rudimentary version of the widely acclaimed Learning Management System (LMS), Canvas. This full-stack application contains a comprehensive suite of features such as quizzes, courses and assignments. The application is structured around different user roles, such as students and faculty, which dictate the available features, ensuring that users have access to the specific tools they need for their roles. This is the repository for the frontend. This application also needs the backend server to be running in order for it to work. Here's the link to the backend repository.
- Entirely Written in TypeScript.
- React Router for routing and navigation.
- Redux for global state management.
- Axios for making HTTP requests.
- Bootstrap for responsive design and styling.
- React Icons for icons.
- Role-Based Access Control 🔒
- Each user is granted features tailored to their specific role. For instance, faculty members can add course quizzes, create and edit assignments, while students are limited to joining courses, completing assignments, and taking quizzes. This ensures a streamlined experience for each user group.
- Visually Appealing User Interface ✨
- The application boasts a visually appealing user-friendly interface, leveraging the Bootstrap framework to closely resemble the look and feel of the official Canvas application.
- Secure Navigation 🚪
- The application implements protected routes, allowing access only to authenticated users. Unauthenticated users attempting to navigate these routes are automatically redirected to the login or signup page, ensuring secure and restricted access to sensitive sections of the app.
- Create a
.local.envfile in the root of the project and add the following environment variable.REACT_APP_REMOTE_SERVER=the_url_of_the_server. // Eg: REACT_APP_REMOTE_SERVER=http://localhost:4000 - Execute
npm installto install dependencies. - Execute
npm startto start the application.