Building Mindful Journal: How AI and GitHub Copilot Empowered My One-Day Productivity App

This is a submission for the GitHub Copilot Challenge : New Beginnings

What I Built

I built Mindful Journal, a digital journaling web app designed to help users reflect on their day, track their moods, and document new beginnings. The app is focused on promoting mindfulness and personal growth by making it easy for users to log their thoughts, emotions, and progress over time.

Features

• User Authentication: Users can sign up, log in, and manage their profiles securely.
• Daily Mood Tracking: A simple and intuitive interface allows users to log their mood each day using emojis or a 1-10 scale.
• AI-Powered Reflection Prompts: The app provides personalized prompts to encourage users to reflect on their experiences (e.g., "What was the highlight of your day?").
• Growth Timeline: A dynamic visualization that displays users' moods and journaling frequency over time, helping them identify patterns and track personal growth.
• Export Functionality: Users can export their journal entries as PDFs for long-term storage or sharing.

Technical Stack

• Frontend: Built with React.js and styled using TailwindCSS for a modern and responsive user interface.
• Backend: Developed with Node.js and Express.js, leveraging PostgreSQL for data storage.
• AI Integration: Powered by Gemini's API to generate insightful journaling prompts.
• Hosting: The app is hosted on Vercel for the frontend and backend deployment.

Demo

The link to my web app can be found at mindful journal. Some screenshots

Repo

Ifihan / mindful-journal

A digital journaling well-being web app

Mindful Journal

Mindful Journal is a digital journaling web app designed to help users reflect on their day, track their moods, and document new beginnings. The app focuses on promoting mindfulness and personal growth by enabling users to log their thoughts, emotions, and progress over time with a visually engaging interface.

View on GitHub

Copilot Experience

Using GitHub Copilot throughout the development of Mindful Journal significantly enhanced the process, making coding faster and more efficient. From the beginning, Copilot provided intelligent suggestions that helped me shape both the frontend and backend of the app. For instance, it streamlined the creation of reusable React components like the Mood Tracker and Timeline Visualization, offering concise and clean code snippets. It also suggested optimized state management techniques using useState and useEffect, which made handling user interactions and data updates much smoother.

One of the most impressive aspects of Copilot was its ability to help with debugging. During the development of the user authentication flow, Copilot identified potential issues with token validation and suggested solutions that resolved the problem quickly.

GitHub Models

For the development of Mindful Journal, I used GitHub Models. The integration of these models helped me debug and generate better code.

I used OpenAI's GPT-4 and Claude 3.5 (Sonnet) for generating the code for the web app. OpenAI's GPT-4 provided creative and personalized ways of implementing certain features such as the signup and login pages. Claude 3.5, on the other hand, excelled in generating concise and accurate backend logic code

Conclusion

Building Mindful Journal was an enriching experience that demonstrated the power of AI and modern development tools in creating meaningful applications. I believe this project has the potential to make a positive impact by encouraging users to reflect on their lives, track their progress, and embrace new beginnings with confidence.