Deployment Documentation
Build, Deploy & Launch
Learn how to set up HabitFlow locally, configure its environment and deploy the application using Vercel.
Development Process
Project Deployment Timeline
From local development to a live application.
Develop Features
Build new features or improve existing ones in your local development environment.
Test & Debug
Run the application locally, fix bugs, and verify that everything works as expected.
Commit & Push Code
Save your changes with commits and push them to your GitHub repository.
Automatic Deployment
Vercel builds and deploys the application when changes are pushed to the connected GitHub repository.
Getting Started
Prerequisites
Install and configure these tools before running HabitFlow locally.
Node.js
JavaScript runtime required to run the Next.js application.
pnpm
Package manager used to install and manage project dependencies.
Git & GitHub
Version control and source-code hosting for the project.
PostgreSQL
Relational database used to store application data.
Local Development
Installation & Setup
Follow these steps to download the source code, install dependencies and start HabitFlow on your local machine.
1. Clone the repository
Download the project from your GitHub repository.
git clone <your-repository-url>
cd habitflow2. Install dependencies
Install all required project packages.
pnpm install3. Configure environment variables
Create your local environment file if it does not already exist, then add the required configuration.
touch .env4. Generate Prisma Client
Generate the Prisma Client used to communicate with PostgreSQL.
pnpm exec prisma generate5. Start the development server
Run HabitFlow locally and open http://localhost:3000 in your browser.
pnpm devConfiguration
Environment Variables
HabitFlow uses environment variables for database connectivity and authentication. Configure these values in your local environment and production hosting settings.
DATABASE_URLPostgreSQL database connection string.
NEXTAUTH_URLBase URL of the application.
NEXTAUTH_SECRETSecret used by NextAuth.js to secure authentication.
GOOGLE_CLIENT_IDGoogle OAuth client ID, if Google sign-in is enabled.
GOOGLE_CLIENT_SECRETGoogle OAuth client secret, if Google sign-in is enabled.
Never commit your .env file or expose database credentials, OAuth secrets or authentication secrets in your source code. Only configure Google OAuth variables if that feature is enabled.
Production
Build & Run
Prepare the application for production and verify that the production build completes successfully.
Production Build
pnpm buildCreates an optimized production build of HabitFlow.
Production Server
pnpm startStarts the production server after a successful build.
Hosting Platform
Deploy with Vercel
Vercel provides hosting and continuous deployment for Next.js applications. Connect your GitHub repository to deploy HabitFlow.
Vercel Deployment Workflow
GitHub integration and automated builds
1.Push your project code to GitHub.
2.Import the repository into your Vercel account.
3.Configure the project settings and environment variables.
4.Ensure the production database connection is configured.
5.Deploy the project and review the build logs.
6.Test the deployed application and authentication flows.
Final Verification
Deployment Checklist
Review these items before considering a production deployment complete.
Connect the GitHub repository to Vercel.
Configure the production environment variables.
Ensure the production PostgreSQL database is accessible.
Configure the Prisma Client generation and build process.
Deploy the application and check the build logs.
Verify authentication, database operations and application routes.
Ready to Deploy HabitFlow?
Follow the deployment workflow, configure your production environment and make HabitFlow available to users.