This application allows registered users to easily manage their programming projects. In a dashboard, it displays cards that represent the tasks to be done. Furthermore, it encourages teamwork by allowing the project owner to invite new members to collaborate in the team, either by adding new tasks or commenting existing ones.
I was motivated to build this learning project to further expand my knowledge of the MERN stack. Moreover, I wanted to understand how to structure large-scale React projects. I also explored important React aspects, such as managing state with the context API and separating into reusable components.
Visit the deployed app at:
https://project-manager-314.herokuapp.com/
- ReactJs
- JavaScript
- CSS
- Mongodb (Mongoose)
- ExpressJS
- NodeJs
- MERN Stack
I was motivated to build this project in order to acquire or strenghten the following developer skills:
- Learn to organize files in large-scale React projects
- Understand how the Context API handles state accross components
- Show proficiency in building an authenticacion API using MongoDb
- Strengthen my understanding of the technologies in the MERN Stack
First, the user must create an account. Then a dashboard will show the user's current active projects, as well as the invitations to collaborate on a team. Create a new project by clicking in the corresponding button in the dashboard and provide basic details to begin.
The project view has two parts: overview and tasks. The overview section shows the project information and the members of the team. It also shows the project settings only to the owner, which provide basic update and delete operations.
In the project tasks section, all the pending work will be shown, grouped in different categories based on completion status. The color code indicates the type of task to be done, such as bugs or features. Click on each task to display a modal showing more information and comments. Below there are some screenshots showing how the project looks like:
