A modern, cloud-based planner application designed for students and teachers to manage their daily tasks, schedules, and goals with an intuitive, paper-planner-inspired interface.
MyPlanner is a comprehensive productivity application that brings the familiarity of a paper planner to the digital world. Built with modern web technologies, it provides students and teachers with an elegant solution for organizing tasks, tracking habits, and managing their daily schedules.
- 📝 To-Do List: Create, update, and manage daily tasks with ease
- 📅 Schedule Management: Plan your day with an intuitive scheduling interface
- 🎯 Priority Tracking: Set and monitor your daily priorities
- 📚 Notes: Take quick notes and organize your thoughts
- 📖 Reading List: Keep track of books you want to read
- 💧 Water Tracker: Monitor daily water intake
- 😊 Mood Tracker: Track your emotional well-being
- 🙏 Gratitude Journal: Practice daily gratitude
- 🍽️ Meal Planner: Plan your meals ahead of time
- 📊 Productivity Insights: Visualize your productivity patterns
- 🌤️ Weather Widget: Stay informed about current weather conditions
- 🔐 User Authentication: Secure login and signup functionality
- 👤 User Profiles: Personalized user experience
- 🎨 Customization Options: Tailor the app to your preferences
- React 18.3 - Modern UI library
- Vite - Next-generation frontend tooling
- React Router - Client-side routing
- TailwindCSS - Utility-first CSS framework
- Radix UI - Accessible component primitives
- Lucide React - Beautiful icon library
- Node.js - JavaScript runtime
- AWS RDS MySQL - Managed relational database
- AWS S3 - Cloud storage
- ESLint - Code linting
- PostCSS - CSS transformations
- Axios - HTTP client
- Node.js (v16 or higher)
- npm or yarn
- Git
-
Clone the repository
git clone https://github.com/carolinecummings19/MyPlanner.git cd MyPlanner -
Install dependencies
npm install
-
Configure environment
Create a
config.jsonfile in the root directory with your configuration settings. -
Start the development server
npm run dev
-
Open your browser
Navigate to
http://localhost:5173(or the port shown in your terminal)
npm run build
npm run preview- Sign Up/Login: Create an account or log in to access your planner
- Customize Your View: Navigate to the Customize page to personalize your planner
- Add Tasks: Use the To-Do List component to add and manage your daily tasks
- Schedule Your Day: Fill in your schedule with classes, meetings, or events
- Track Your Habits: Use the water tracker, mood tracker, and gratitude journal
- Stay Organized: Manage your notes, priorities, and meal plans all in one place
MyPlanner/
├── public/ # Static assets
├── src/
│ ├── assets/ # Images and media
│ ├── components/ # React components
│ │ ├── Book.jsx
│ │ ├── Gratitude.jsx
│ │ ├── MealPlanner.jsx
│ │ ├── MoodTracker.jsx
│ │ ├── Schedule.jsx
│ │ ├── ToDoList.jsx
│ │ ├── WaterTracker.jsx
│ │ ├── Weather.jsx
│ │ └── ...
│ ├── pages/ # Page components
│ │ ├── Home.jsx
│ │ ├── Login.jsx
│ │ ├── Signup.jsx
│ │ ├── Profile.jsx
│ │ └── ...
│ ├── App.jsx # Main app component
│ └── main.jsx # Entry point
├── config.json # Configuration file
├── package.json # Dependencies
└── vite.config.js # Vite configuration
Contributions are welcome! If you'd like to contribute to MyPlanner:
- Fork the repository
- Create a feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
This project is currently unlicensed. Please contact the developer for usage permissions.
Caroline Cummings
- GitHub: @carolinecummings19
- Repository: MyPlanner
- Built with React and Vite
- Styled with TailwindCSS
- Icons by Lucide
⭐ Star this repository if you find it helpful!