Kanban App 🚀

A Kanban board application built with Next.js 13, TypeScript, and React-Query. This app allows users to register, log in, create boards, sections within those boards, and tasks within those sections. Users can also drag and drop tasks to manage their workflow effectively.

Live Demo 🚀

Check out the live demo here.

Tech Stack 💻

• Framework: Next.js 13
• Language: TypeScript
• State Management: React-Query
• UI Components: React Beautiful DnD, Tailwind CSS
• HTTP Client: Axios
• Other Libraries:
  • Draft.js
  • React Hot Toast
  • React Icons

Preview 📺

Features 🛠️

1. Register: Users can create an account.
2. Login: Users can log into their account.
3. Create Board: Users can create a new board.
4. Create Section: Users can create sections within a board.
5. Create Task: Users can add tasks to a section.
6. Drag & Drop: Users can drag and drop tasks between sections.

Getting Started

Prerequisites

• Node.js and npm (or yarn) installed on your machine.

Usage 🛠️

1. Clone the repository:

   git clone https://github.com/truongduy28/kanban-zone-app-nextjs.git
   

2. Navigate to the project directory:

   cd kanban-zone-app
   

3. Replace the value of the variable in your .env.local file with your actual variable.

4. Install dependencies:

   yarn install
   

5. Start the application:

   yarn start

Feel free to contribute, report issues, or suggest improvements. Happy coding! 🚀

Contributing ✊

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

License 📖

Distributed under the MIT License. See LICENSE for more information.