Built with: Next.js, React, TypeScript, Prisma, Supabase, PostgreSQL, Tailwind CSS, Clerk, and Stripe (for optional premium features)
Live Demo: Link to my deployed project
- Collaboration: Organize projects with teammates in dedicated workspaces.
- Boards & Lists: Create and manage boards for different project stages. Organize tasks within boards using customizable lists with drag-and-drop functionality.
- Task Management: Create, edit, delete, and reorder individual tasks within lists.
- Visual Appeal: Enhance your project boards with beautiful cover images powered by the Unsplash API.
- Activity Tracking: Maintain transparency with comprehensive activity logs for workspaces and individual boards.
- Member Roles: Manage user permissions within workspaces by assigning member roles.
- Subscription-based Upgrades: Offer premium features like unlimited boards through Stripe integration.
- Effortless Project Management: Introducing Taskify, your one-stop app for organizing projects and boosting teamwork.
- Streamline Workflows: Create boards, lists, and manage tasks with ease, all in a user-friendly interface.
- Get Started Now: Sign up for free and experience the power of organized collaboration.
- Allow users to create new accounts or log in with existing credentials using Clerk.
- Implement secure authentication practices.
- A popup guides users through creating their initial organization upon first sign up or whenever user wants to create one.
- Displays the organization name and account type (free/pro).
- Sidebar lists all associated workspaces.
- Displays boards within the current organization.
- Provides a central hub for managing projects within the workspace.
- Offers tabs for:
- Appears when users create a new board.
- Offers options to select a cover image (powered by Unsplash API) and name the board.
- Displays the board title, cover image, and associated lists with cards.
- Enables users to:
- Rename the board title.
- Delete the board.
- Create new lists.
- Create cards within lists.
- Create, copy, or delete lists.
- Drag and drop lists to reorder them.
- Create cards within a list.
- Delete cards.
- Copy cards for duplication.
- Rename cards.
- Drag and drop cards within a list or across lists.
- View and manage individual card details (description, audit logs).
-
Clone the repository:
git clone [https://github.com/](https://github.com/)<your-username>/taskify.git
-
Install dependencies:
cd taskify npm install
-
Set Up Environment Variables:
- Create a .env.local file in the project root.
- Add any environment variables your project requires (e.g., database connection details, API keys).
-
Run the Development Server:
npm start
This will start the development server on http://localhost:3000
by default.
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.