Side-Planner.com

A web-based personal side projects management application that combines traditional task board functionality with AI assistance for intelligent project planning. The system helps individuals organize their development workflow while leveraging AI to suggest sub and related tasks.

SidePlanner.Overview.mov

AI Model Used: gemini-2.0-flash-exp (get a free API key here)

If you want to update the prompt to fit your use case, you can do so in the route.ts file.

Core Features:

• Personal Board Management

  • Customizable board view (Kanban-style)
  • Standard columns: Backlog, To Do, In Progress, Done
  • Task cards with title, description, priority, and labels
  • Drag-and-drop functionality for task management

• AI Task Enhancement

  • AI analysis of existing tasks to suggest related subtasks
  • Complexity estimation suggestions based on task complexity

This project is based on a template built with Next.js, Shadcn/ui, and Drizzle.

Tech Stack

• Framework: Next.js
• Database: Postgres
• ORM: Drizzle
• UI Library: shadcn/ui
• Vercel AI SDK: Vercel AI

Getting Started

git clone https://github.com/nextjs/saas-starter
cd saas-starter
npm install

Running Locally

Use the included setup script to create your .env file:

npm db:setup

Then, run the database migrations and seed the database with a default user and team:

npm db:migrate
npm db:seed

This will create the following user and team:

• User: test@test.com
• Password: admin123

You can, of course, create new users as well through /sign-up.

Finally, run the Next.js development server:

npm dev

Open http://localhost:3000 in your browser to see the app in action.

Add environment variables

In your Vercel project settings (or during deployment), add all the necessary environment variables. Make sure to update the values for the production environment, including:

1. BASE_URL: Set this to your production domain.
2. POSTGRES_URL: Set this to your production database URL.
3. AUTH_SECRET: Set this to a random string. openssl rand -base64 32 will generate one.
4. GOOGLE_GENERATIVE_AI_API_KEY: Set this to your Google Generative AI API key.