Daytree

• 

  Landing Page

• 

  Authentication Page

• 

  Main Habit Tracking Page

• 

  Tally Page to Track Consistency

Inspiration

Most habit trackers become overwhelming over time. We wanted to build something minimal, fast, and focused on consistency rather than perfection. DayTree was created to encourage small daily actions, visualize long-term progress, and make habit building feel rewarding instead of burdensome.

What it does

DayTree helps users build and maintain habits through a clean daily planner. Users can create habits, organize them by time of day, track daily completion, monitor streaks, visualize consistency with GitHub-style heatmaps, manage backlogs, and securely authenticate using email or Google Sign-In.

How I built it

DayTree is built as a full-stack MERN application.

Frontend: React, Vite, Tailwind CSS Backend: Node.js, Express.js Database: MongoDB Atlas Authentication: JWT, Google OAuth, Email OTP Media: Cloudinary Email: Resend Deployment: Vercel (Frontend), Render (Backend)

The application follows a RESTful architecture with secure authentication, protected routes, analytics generation, and a modular backend structure.

Challenges I ran into

The biggest challenges were deploying a full-stack application across multiple platforms, configuring Google OAuth for production, handling MongoDB Atlas connectivity, managing environment variables securely, solving SPA routing issues on Vercel, and ensuring consistent date handling across time zones for streaks and analytics.

Accomplishments that I'm proud of

Built a production-ready MERN application from scratch. Implemented secure authentication with JWT and Google OAuth. Designed a clean and responsive user interface. Developed streak tracking, backlog management, and contribution-style heatmaps. Successfully deployed the application with CI/CD on Vercel and Render. What I learned

This project significantly improved my understanding of backend architecture, authentication flows, deployment pipelines, environment management, MongoDB Atlas, REST API design, debugging production issues, and integrating multiple third-party services into a cohesive application.

What's next for DayTree

Future plans include habit reminders, recurring schedules, shared accountability groups, calendar integrations, advanced analytics, mobile support, offline synchronization, AI-powered habit insights, and richer progress visualizations to make building habits even more engaging.

Built With

• docker
• express.js
• javascript
• mongodb
• node.js
• react