MY WEB PROJECT

Next.js Moods

A web application built with Next.js and Firebase that allows users to log their daily moods and visualize trends over time. This project serves as a mood tracker, helping users understand their emotional patterns.

Register

Login

Home Page

Dashboard

About

Next.js Moods is a simple yet powerful mood tracker. Users can log in and update their daily mood, which is stored in a Firebase Firestore database. They can also visualize their mood history and track their mood trends over time. This project demonstrates how to combine Next.js and Firebase for seamless data management and a responsive user experience.

Features

• User authentication with Firebase
• Daily mood logging with an intuitive UI
• Mood data storage in Firebase Firestore
• Display of mood trends and averages
• Responsive design for mobile and desktop

Technologies Used

• Next.js
• Firebase
• Firestore for data storage
• Firebase Authentication for user management
• React
• Tailwind CSS for styling

Getting Started

• Prerequisites
• Node.js and npm installed. You can download Node.js here.
• A Firebase project. You'll need to create a project on Firebase Console and get your configuration details.

Installation

• Clone the repository:

• git clone https://github.com/your-username/nextjs-moods.git

• cd nextjs-moods

• npm install

Set up your environment variables:

• Create a .env.local file in the root directory and add your Firebase configuration. It should look like this:

• NEXT_PUBLIC_FIREBASE_API_KEY=your-api-key

• NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your-auth-domain

• NEXT_PUBLIC_FIREBASE_PROJECT_ID=your-project-id

• NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=your-storage-bucket

• NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=your-sender-id

• NEXT_PUBLIC_FIREBASE_APP_ID=your-app-id

Running the Application

• npm run dev

• This will start the development server. Open http://localhost:3000 in your browser to view the application.