Back to project
Mood: AI-Enhanced Journaling Web App

Mood: AI-Enhanced Journaling Web App

Project Overview

DEMO: https://mood-journal-ai.vercel.app/

Mood is an innovative journaling web app that leverages the capabilities of GPT-3.5 Turbo to provide users with insightful analyses of their journal entries. By summarizing mood and sentiment over time, Mood offers a unique window into personal emotional trends, supported by a line graph for visual tracking.

Concept and Execution

The project was conceived as an advanced exploration of NEXTJS 13 features and AI integration, following a Frontend Masters course by Scott Moss,I highly recommand to check it yourself on frontendmasters-course and also have a look on Scott's github https://github.com/Hendrixer. Mood is designed to not only serve as a standard journaling tool but also to utilize AI for deep content analysis, offering users a novel way to understand and visualize their emotional journey.

Tech Stack

  • Next.js 13: Employs the latest features of Next.js for robust web app development.
  • Clerk: Integrated for secure and efficient user authentication.
  • Prisma with PlanetScale: Utilized for database management, ensuring scalable and reliable data storage.
  • Tailwind CSS: Used for styling, providing a sleek and responsive user interface.
  • OpenAI's GPT-3.5 Turbo: Powers the AI-driven mood and sentiment analysis features.
  • Langchain.js: Aids in creating consistent AI prompts and handling AI interactions.
  • Zod: Implemented for structured data validation.
  • Recharts: Used for generating interactive mood tracking graphs.
  • Vitest: Incorporated for testing server-side rendering pages and other functionalities.

App Demo

Experience the Mood web app firsthand by visiting the demo site. See how AI-enhanced journaling can offer deeper insights into your emotional well-being.

Mood Journal App Demo

Click on the image above to visit the live site.

Features Implemented

  • AI-Powered Mood Analysis: Summarizes journal entries and assigns sentiment scores. Example of write page Example of AI-generated mood analysis:
  • Mood Tracking Graph: Visual representation of mood changes over time based on entries. Example of history graph Example of mood tracking graph:
  • AI-Driven Query Responses: Users can ask questions about their entries, with the AI conducting vector searches to provide relevant answers.
  • Autosaving Journal Entries: Entries are automatically saved, ensuring data is never lost.
  • Dynamic UI: Interactive and user-friendly interface for journaling and viewing analytics.

Challenges Faced

  • Integrating GPT-3.5 Turbo: Seamlessly incorporating AI for accurate mood and sentiment analysis.
  • Data Visualization: Implementing the mood tracking graph with Recharts for real-time data representation.
  • Optimizing Next.js 13 Features: Effectively utilizing advanced features like middleware authentication and SSR.
  • Database Management with Prisma: Ensuring robust and scalable data handling with PlanetScale.

Conclusion

The creation of Mood has been a journey in itself, more about the process than the destination. Building this app was not just about crafting a tool, but about enjoying each step of the development journey. It's a project where the joy was truly found in the journey, pun intended. This experience has been a rewarding adventure in coding and creativity, leaving me with not just a functional product, but a sense of accomplishment and personal growth.

Disclaimer: This project was inspired by a Frontend Masters course and is intended for educational and personal use.