TaskRaft is a compact mini-SaaS designed for collaborative task management using the efficient Kanban system. Built using the MERN Stack, along with Vite, TypeScript, and shadcn/ui + TailwindCSS at the frontend. TaskRaft draws inspiration from task management apps like Tasksboard and Trello, offering a simplified yet robust approach. Tanstack Query and Zustand are used for server-side and global state management respectively. User authentication is handled through JSON Web Tokens (JWT), while data modeling relies on Mongoose.
- Robust user registration and login powered by JWT authentication.
- User-friendly profile page for editing personal information.
- An accessible user dashboard for convenient access to recent and existing boards, with the option to create new ones.
- An intuitive board view, reminiscent of popular Kanban board interfaces such as Trello and Tasksboard.
- Functionality for adding lists to boards and cards to lists.
- Board information editing capabilities.
- User invitations to facilitate collaborative board access.
- Real-time collaboration functionality via efficient long-polling mechanisms.
Backend:
- express: Fast and minimalist web application framework for Node.js.
- express-async-handler: Simple middleware for handling exceptions inside of async express routes and passing them to your express error handlers.
- mongoose: Object Data Modeling MongoDB and Node.js.
- ejs: Templating language.
- nanoid: Small, secure, and URL-friendly unique ID generator.
- jsonwebtoken: JSON Web Token (JWT) implementation for Node.js.
- bcryptjs: Library for hashing and comparing passwords.
- nodemailer: Send e-mails with Node.js.
Frontend:
- vite: A build tool that aims to provide a faster and more efficient development experience for web projects.
- eslint: A pluggable and configurable linter tool for identifying and fixing problems in JavaScript code.
- postcss: A tool for transforming CSS with JavaScript plugins.
- typescript: A typed superset of JavaScript that compiles to plain JavaScript.
- tailwindcss: A highly customizable, low-level CSS framework.
- react: A JavaScript library for building user interfaces.
- react-router-dom: Declarative routing for React applications.
- zustand: A small, fast, and scaleable state management for React.
- react-icons: A set of high-quality SVG icons for React projects.
- @tanstack/react-query: A powerful data-fetching and state management library for React.
- react-hook-form: Performant, flexible, and extensible forms with easy-to-use validation.
- @dnd-kit/core: A set of utility primitives for building performant, accessible, and reliable drag-and-drop interfaces.
- zod: A TypeScript-first schema declaration and validation library.
- date-fns: Modern JavaScript date utility library.
- nanoid: Small, secure, and URL-friendly unique ID generator.
- Clone the repository.
git clone https://github.com/waterrmalann/task-raft.git- Install the dependencies. (frontend and backend are decoupled)
# server-side dependencies
pnpm install
# client-side dependencies
pnpm -C frontend install-
Rename
.exmaple-envto.envand configure the variables accordingly. -
Run the project. (from root)
pnpm run dev- Access the application.
Open your browser and visit http://localhost:3000
Contributions are always accepted. Feel free to open a pull request to fix any issues or to make improvements you think that should be made. Any contribution will be accepted as long as it doesn't stray too much from the objective of the app. If you're in doubt about whether the PR would be accepted or not, you can always open an issue to get my opinion on it.
This project is licensed under the permissive MIT License, see LICENSE.