🧭 True North

A personal growth companion for journaling, habit tracking, and emotional wellness

Live Demo • Features • Getting Started • Tech Stack

---

📋 Overview

True North is a comprehensive personal wellness application designed to help you track your daily habits, journal your thoughts, and monitor emotional well-being patterns over time. Built with React and Firebase, it offers a seamless, responsive experience across all devices.

---

✨ Features

📓 Journaling

Capture your thoughts with a clean, distraction-free writing experience. Log daily moments, revisit past entries, and build a personal narrative of your journey.

---

📊 Multi-Tracker System

Track various aspects of your daily life with a flexible, customizable tracking system:

Tracker	Description
🌞 Day Rating	Rate your overall day experience
😴 Sleep Quality	Monitor nightly sleep patterns
😰 Anxiety Level	Track anxiety intensity
😓 Stress Level	Log daily stress levels
📱 Screen Time	Record hours spent on screens
😊 Mood	Capture your emotional state
⚡ Energy	Track daily energy levels
📋 Discipline	Measure consistency with goals
💭 Thoughts	Monitor intrusive thought patterns

---

📈 Analytics & Visualization

Gain insights into your patterns with interactive charts and monthly trend analysis.

---

✅ Habit Tracker

Build and maintain daily habits with visual progress tracking and streak monitoring.

---

🛠️ Tech Stack

Category	Technologies
Frontend	React 18, React Router v7
State Management	Redux Toolkit
Backend	Firebase (Firestore, Authentication)
Visualization	Chart.js, Recharts
Styling	CSS with CSS Variables (Dark/Light theme)
Icons	React Icons

---

🚀 Getting Started

Prerequisites

• Node.js v16 or higher
• npm or yarn
• Firebase account

Installation

1. Clone the repository

   git clone https://github.com/yourusername/truenorth.git
   cd truenorth

2. Install dependencies

   npm install

3. Configure Firebase

   • Create a project at Firebase Console
   • Enable Firestore Database and Authentication
   • Copy your Firebase config credentials

4. Set up environment variables

   cp .env.example .env

   Edit .env with your Firebase credentials:

   REACT_APP_FIREBASE_API_KEY=your_api_key
   REACT_APP_FIREBASE_AUTH_DOMAIN=your_project.firebaseapp.com
   REACT_APP_FIREBASE_PROJECT_ID=your_project_id
   REACT_APP_FIREBASE_STORAGE_BUCKET=your_project.appspot.com
   REACT_APP_FIREBASE_MESSAGING_SENDER_ID=your_sender_id
   REACT_APP_FIREBASE_APP_ID=your_app_id
   REACT_APP_FIREBASE_MEASUREMENT_ID=your_measurement_id

5. Create firebase.js

   Copy the example file and it will automatically use your .env variables:

   cp src/firebase.js.example src/firebase.js

6. Start the development server

   npm start

   Open http://localhost:3000 in your browser.

---

🔒 Firebase Security Rules

Configure Firestore rules to protect user data:

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /users/{userId}/{document=**} {
      allow read, write: if request.auth != null && request.auth.uid == userId;
    }
    
    match /journal_entries/{entryId} {
      allow read, write: if request.auth != null;
    }
  }
}

---

📁 Project Structure

src/
├── components/          # React components
│   ├── Home.js          # Landing page
│   ├── Journal.js       # Journal entries
│   ├── HabitTracker.js  # Habit tracking
│   └── Login.js         # Authentication
├── trackers/            # Tracker system
│   ├── UnifiedTracker.js
│   └── trackerConfig.js
├── context/             # React context (Auth)
├── utils/               # Utility functions
│   ├── firestore.js     # Firestore operations
│   ├── localCache.js    # Local caching
│   └── dataSync.js      # Data synchronization
├── css/                 # Stylesheets
└── App.js               # Main app component

---

📦 Scripts

Command	Description
npm start	Start development server
npm run build	Build for production
npm test	Run test suite

---

🎨 Theming

True North supports both dark and light themes using CSS variables, automatically adapting to user preference.

---

🤝 Contributing

Contributions are welcome! Please follow these steps:

1. Fork the repository
2. Create a feature branch: git checkout -b feature/YourFeature
3. Commit changes: git commit -m 'Add YourFeature'
4. Push to branch: git push origin feature/YourFeature
5. Open a Pull Request

---

📄 License

This project is licensed under the MIT License.

---

🙏 Acknowledgments

• React
• Firebase
• Chart.js
• Recharts
• React Icons

---

Made with ❤️ for personal growth