Personal-Manager

📱 Personal Manager - Indian Edition

A comprehensive Progressive Web App (PWA) for managing finances, tasks, notes, goals, and habits. Built specifically for Indian users with ₹ (Rupee) currency support, modern glassmorphism design, and 3D interactive elements.

Version React Tailwind License

✨ Features

💰 Finance Management

📝 Notes

✅ Tasks

🎯 Goals

🔥 Habits

🎨 Design Features

🚀 Getting Started

Prerequisites

Installation

  1. Clone or Download the Repository 
    git clone https://github.com/yourusername/personal-manager-app.git
cd personal-manager-app
  2. Install Dependencies 
    npm install
  3. Start Development Server 
    npm start
  4. Open in Browser
    • The app will automatically open at http://localhost:3000
    • If it doesn’t open automatically, navigate to the URL manually

📦 Building for Production

Build the App

npm run build

This creates an optimized production build in the build/ folder.

Test Production Build Locally

# Install serve globally (one time only)
npm install -g serve

# Serve the build folder
serve -s build

🌐 Deploying to GitHub Pages

Step 1: Update package.json

Open package.json and update the homepage field:

"homepage": "https://yourusername.github.io/personal-manager-app"

Replace yourusername with your GitHub username.

Step 2: Deploy

npm run deploy

This will:

  1. Build your app
  2. Create/update the gh-pages branch
  3. Push the build to GitHub Pages

Step 3: Enable GitHub Pages

  1. Go to your repository on GitHub
  2. Click Settings
  3. Scroll to Pages section
  4. Under Source, select gh-pages branch
  5. Click Save

Your app will be live at: https://yourusername.github.io/personal-manager-app

📂 Project Structure

personal-manager-app/
├── public/
│   ├── index.html          # HTML template
│   ├── manifest.json       # PWA manifest
│   └── robots.txt          # SEO robots file
├── src/
│   ├── components/
│   │   ├── Icons.js        # All SVG icon components
│   │   ├── LoginScreen.js  # Login page
│   │   ├── Navigation.js   # Top & bottom navigation
│   │   ├── HomePage.js     # Dashboard/home page
│   │   ├── NotesPage.js    # Notes management
│   │   ├── TasksPage.js    # Tasks management
│   │   ├── GoalsPage.js    # Goals tracking
│   │   ├── HabitsPage.js   # Habits tracking
│   │   ├── SettingsPage.js # Settings & account
│   │   └── Modals/
│   │       ├── AddExpenseModal.js
│   │       ├── AddNoteModal.js
│   │       ├── AddTaskModal.js
│   │       ├── AddGoalModal.js
│   │       ├── AddHabitModal.js
│   │       └── ResetDialog.js
│   ├── utils/
│   │   ├── constants.js    # App constants (quotes, categories)
│   │   ├── exportUtils.js  # CSV/TXT export functions
│   │   └── helpers.js      # Helper functions
│   ├── App.js              # Main app component
│   ├── App.css             # App-specific styles
│   ├── index.js            # App entry point
│   └── index.css           # Global styles + Tailwind
├── .gitignore              # Git ignore rules
├── package.json            # Dependencies & scripts
├── tailwind.config.js      # Tailwind configuration
├── postcss.config.js       # PostCSS configuration
└── README.md               # This file

🎯 Usage Guide

Login

Adding Data

Expense Categories

The app includes Indian-specific categories:

Exporting Data

Resetting Dashboard

3D Effects

🔒 Privacy & Data

🛠️ Technologies Used

📱 PWA Features

🎨 Customization

Changing Colors

Edit tailwind.config.js to customize the color scheme:

theme: {
  extend: {
    colors: {
      primary: '#your-color',
      secondary: '#your-color',
    }
  }
}

Changing Default Salary

Edit src/utils/constants.js:

export const defaultSettings = {
  monthlySalary: 50000, // Change this value
  monthlyLimit: 50000,
  income: 50000
};

Adding More Quotes

Edit the quotes array in src/utils/constants.js

🐛 Troubleshooting

npm install fails

App doesn’t start

Build fails

Deployment issues

3D effects not working

📈 Future Enhancements

🤝 Contributing

Contributions are welcome! Please follow these steps:

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

📄 License

This project is licensed under the MIT License - see below for details:

MIT License

Copyright (c) 2024 Personal Manager

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

👨‍💻 Author

Your Name

🙏 Acknowledgments

📞 Support

Having issues? Here’s how to get help:

  1. Check Documentation: Read this README thoroughly
  2. Search Issues: Check if someone else had the same problem
  3. Create Issue: Open a new issue on GitHub with details
  4. Email Support: Contact via email (if provided)

⭐ Show Your Support

If you found this project helpful, please give it a ⭐ on GitHub!

**Made with ❤️ in India 🇮🇳** [Report Bug](https://github.com/yourusername/personal-manager-app/issues) · [Request Feature](https://github.com/yourusername/personal-manager-app/issues) · [Documentation](https://github.com/yourusername/personal-manager-app/wiki)