This project is a Jira clone that aims to develop a task management web app using React and TypeScript. The primary objective is to gain a deeper understanding of React’s context and hooks aspects. I used an online tutorial as a guide to complete this project.
Background.
To gain better understanding of web develoment and React framework.
Functionalities.
User can create project, assign department, and assign people responsible for the project.
User can search and sort project by name and responsible people’s name.
User can add detailed tasks or bug assignments under each project, to track the development progress.
Techniques.
- React was used as the framework for this project.
- Hooks were used to update searching parameters and information.
- TypeScript was used to formalize the type definitions.
- Ant Design (antd) was used for the React UI design.
- React Query was used for context management and optimistic updates.
Visual.
- Utilized the Ant Design UI library to complete the overall layout.
- Streamlined the development process and ensure a cohesive look and feel throughout the project.
- Gained experience in utilizing UI component libraries.
Results.
Takeaways.
What I’ve Learned…
Through this project, I gained a deeper understanding of React state management and how to use interfaces in TypeScript to create safer type management compared to using pure JavaScript. I learned how to use UI Library to improve the visual consistency. Additionally, I learned how to use Webpack to set up a robust React app from the early stages.
- Connect the website to a real dataset, allowing new users to register and store their data. Currently, the data system only works as a demo and stores data locally.
- Spend more time exploring Ant Design and learning more about this UI library.