Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/alexandrbig1/task-pro

TaskPro is the culmination of our journey through a 10-month Fullstack Development Bootcamp. This fullstack application showcases the depth of knowledge and skills we've acquired in building robust and feature-rich web applications.
https://github.com/alexandrbig1/task-pro

backend bootcamp css3 figma frontend fullstack html5 javascript js node-js nodejs react reactjs styled-components ux-ui-design webdesign webdevelopment

Last synced: about 1 month ago
JSON representation

Host: GitHub
URL: https://github.com/alexandrbig1/task-pro
Owner: Alexandrbig1
License: mit
Created: 2024-01-31T19:48:13.000Z (11 months ago)
Default Branch: main
Last Pushed: 2024-02-20T05:25:01.000Z (10 months ago)
Last Synced: 2024-02-21T05:39:20.452Z (10 months ago)
Topics: backend, bootcamp, css3, figma, frontend, fullstack, html5, javascript, js, node-js, nodejs, react, reactjs, styled-components, ux-ui-design, webdesign, webdevelopment
Language: JavaScript
Homepage: https://alexandrbig1.github.io/task-pro/
Size: 20.5 MB
Stars: 4
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

        # Task Pro App

Welcome to the Task Pro App, the final project from the Fullstack Development Bootcamp. This web application allows users to manage tasks efficiently, similar to popular task management tools like Trello.



[![GitHub last commit](https://img.shields.io/github/last-commit/Alexandrbig1/task-pro)](https://github.com/Alexandrbig1/task-pro/commits/main)

[![GitHub license](https://img.shields.io/github/license/Alexandrbig1/task-pro)](https://github.com/Alexandrbig1/task-pro/blob/main/LICENSE)

[![Vite](https://img.shields.io/badge/Vite-5.0.8-6868F2)](https://vitejs.dev/)

[![React](https://img.shields.io/badge/React-18.2.0-51CAEF.svg)](https://reactjs.org/)

[![Node.js Version](https://img.shields.io/badge/Node.js-v18.18.0-2B8B27)](https://nodejs.org/)

[![Express.js Version](https://img.shields.io/badge/Express.js-v4.18.2-000000)](https://expressjs.com/)

[![MongoDB](https://img.shields.io/badge/MongoDB-v6.3.0-3B9539)](https://www.mongodb.com/)

[![Mongoose Version](https://img.shields.io/badge/Mongoose-v8.0.3-6B0002)](https://mongoosejs.com/)

[![JWT](https://img.shields.io/badge/JSON%20Web%20Token-v9.0.2-000000)](https://jwt.io/)

[![Nodemailer](https://img.shields.io/badge/Nodemailer-v6.9.8-0076C8)](https://nodemailer.com/)

[![Styled Components](https://img.shields.io/badge/Styled_Components-6.1.6-D664C0.svg)](https://styled-components.com/)

[![Axios](https://img.shields.io/badge/Axios-1.6.4-5300D8.svg)](https://github.com/axios/axios)

[![JavaScript](https://img.shields.io/badge/JavaScript-Latest-EAD319.svg)](https://developer.mozilla.org/en-US/docs/Web/JavaScript)

[![React Icons](https://img.shields.io/badge/React_Icons-4.12.0-E10051.svg)](https://react-icons.github.io/react-icons/)

## Table of Contents

- [Project Contributors](#project-contributors)

- [Figma Design File](#figma-design-file)

- [Screenshots](#screenshots)

- [Features](#features)

- [Technologies Used](#technologies-used)

- [Getting Started](#getting-started)

- [Contributing](#contributing)

- [Issues](#issues)

- [License](#license)

- [Acknowledgments](#acknowledgments)

- [Connect with me](#connect-with-me)

## Project Contributors

- [Alex Smagin](https://github.com/Alexandrbig1) - Team Lead (Front End)

- [Denys Shchypt](https://github.com/DenysShchypt) - Team Lead (Back End)

- [Batalova Kira](https://github.com/batalova-kira) - Scrum Master

- [Olena Nechyporenko](https://github.com/Olena-Nechyporenko) - Fullstack developer

- [Yuriy Krasnobokiy](https://github.com/YuriyKrasnobokiy) - Fullstack developer

- [Natalia Spivak](https://github.com/Nataly-Naf) - Fullstack developer

- [Oleg Baranov](https://github.com/Olegmkv) - Fullstack developer

- [Vialov Vlad](https://github.com/igrok1803444) - Fullstack developer

- [Dmytro Mukolyuk](https://github.com/KRB-U) - Fullstack developer

- [Vladyslav Parkhomovych](https://github.com/Parkhomovych) - Fullstack developer

- [Svitlana Yurikova](https://github.com/SvitUriko) - Fullstack developer

- [Yulia Tsarenko](https://github.com/Yullia90) - Fullstack developer

## Figma Design File

[Figma Design](https://www.figma.com/file/fJF13s2UlxPIwTMcPVrSiz/TaskPro?type=design&t=8OR5JW2MuSskYTdw-0)

## Backend APIs with Swagger Documentation

[Swagger](https://task-backend-project.onrender.com/api-docs/#/)

### Screenshots:

![Task Pro App](/public/images/screenshots/taskpro.jpg) _Caption for Screenshot 1

(Welcome Page)_

![Task Pro App](/public/images/screenshots/taskpro2.jpg) _Caption for Screenshot 2

(Sign Up Page)_

![Task Pro App](/public/images/screenshots/taskpro3.jpg) _Caption for Screenshot 3

(Sign In Page)_

![Task Pro App](/public/images/screenshots/taskpro4.jpg) _Caption for Screenshot 4

(Home Page Violet Theme)_

![Task Pro App](/public/images/screenshots/taskpro5.jpg) _Caption for Screenshot 5

(Board Page Dark Theme)_

![Task Pro App](/public/images/screenshots/team.jpg) _Caption for Screenshot 6

(Creamy Sharks Team)_

## Features

- **User Authentication:** Users can register and log in to access the main application.

- **Task Management:** Create, edit, and prioritize tasks. Move tasks between different columns (process, done).

- **Theme Switcher:** Users can toggle between light and dark themes for a personalized experience.

- **Support Email:** In-app feature to send support emails if any issues arise.

- **Task Customization:** Set task priority with different colors, add icons, and set deadlines.

- **Profile Editing:** Users can edit their profiles, including changing avatars.

## Technologies Used

- **Frontend:**

  - React

  - Vite

  - Styled Components

  - Redux

  - React Icons

  - MUI Joy (Material-UI experimental component library)

  - Formik (Form library)

  - Axios (HTTP client)

  - Modern Normalize (Modern version of Normalize.css)

  - Prop Types (Runtime type checking for React props)

  - React Beautiful DND (Drag and drop library for React)

  - React Datepicker

  - React Helmet Async (Async version of React Helmet)

  - React Loader Spinner

  - React Read More Read Less

  - React Toastify (Notification library)

- **Backend:**

  - Node.js

  - Express

  - MongoDB

## Getting Started

1. **Clone the Repository:**

   ```bash

   git clone https://github.com/Alexandrbig1/task-pro.git

   cd task-pro

   ```

2. **Install Dependencies:**

   ```bash

   npm install

   ```

3. **Start the Development Server:**

   ```bash

   npm run dev

   ```

4. **Open in Browser:**

   Open your browser and visit `http://localhost:3000`.

## Contributing

Contributions are welcome! Please check out our Contribution Guidelines for details on how to contribute to this project.

## Issues

If you encounter any issues or have suggestions, please [open an issue](https://github.com/Alexandrbig1/task-pro/issues).

## License

This project is licensed under the [MIT License](LICENSE).

## Feedback

I welcome feedback and suggestions from users to improve the application's functionality and user experience.

## Acknowledgments

We extend our sincere gratitude to the entire team at [GoIT](https://goit.global/us/) for their unwavering guidance and support during our enriching journey through the Fullstack Bootcamp. This comprehensive 10-month program has equipped us with valuable skills across various modules, and we are particularly grateful for the in-depth learning experience in Node.js, which serves as the final module in this transformative bootcamp.

Our heartfelt appreciation goes to the instructors and mentors who have played a pivotal role in shaping our understanding of Fullstack Development. Their expertise and dedication have been instrumental in our successful completion of the bootcamp, culminating in the development of TaskPro.

TaskPro, our final project, stands as a testament to the comprehensive knowledge acquired during the bootcamp. The project's success wouldn't have been possible without the foundation laid by GoIT, particularly in the Node.js module, which has been a crucial component of this endeavor.

Thank you, GoIT, for fostering an environment of learning and growth, and for providing the tools and knowledge that empower us to embark on meaningful journeys in the world of Fullstack Development.

With gratitude,

Creamy Sharks

## Languages and Tools

  

 







 









 





## Connect with me: