Purpose: The app helps students manage their academic tasks, including study schedules, events, assignments, and study plans.
1. Application Overview:
Purpose: The app helps students manage their academic tasks, including study schedules, events, assignments, and study plans.
Features:
User Registration & Login: Users can create accounts, log in, and the system will save their personal study data.
User Profile: Displays personalized user information after login and provides functionality for adding events, assignments, and study plans.
Event, Assignment, and Study Plan Management: Users can add, edit, and delete their upcoming events, assignments, and study plans.
Reminders & Notifications: Includes features to remind users of upcoming assignments and events.
Home & About Sections: Introduces the application and provides details about its functionality.
2. HTML Structure:
The index.html file includes several sections: Home, About, Register, Login, and User Profile. It is designed with clear navigation using buttons that dynamically show the relevant sections.
Home Section: Welcomes users and presents a brief overview of the app's functionalities.
About Section: Describes the features of MyStudyPlanner in detail.
User Profile: Once logged in, users see their profile, events, assignments, and study plans, along with options to manage them.
Registration & Login Forms: Allow users to register and log in.
3. CSS Design:
Navigation Bar: Styled to be responsive and prominent, with a sticky header so users can navigate easily between sections.
Home and About Pages: These sections have been styled with modern buttons, background images, and content boxes. The Home section includes an image gallery, while the About section has a background image for a visually appealing design.
Responsive Design: The layout is responsive, ensuring compatibility across devices, with specific media queries for smaller screen sizes.
Profile Section: This section has a table format for managing events, assignments, and study plans. The buttons in the profile section are color-coded for actions like add, delete, and edit.
4. JavaScript Functionality:
User Registration & Login:
User data is stored in localStorage, and a basic check is done to ensure that usernames are unique.
During login, the application validates the username and password, logs in the user, and displays the profile.
Persistent Login: When users refresh or return to the app, the login session persists using localStorage.
Event, Assignment, and Study Plan Management:
Users can add new events, assignments, and study plans via forms.
The data is saved in localStorage, and the interface is dynamically updated to reflect the added items.
Users can also delete or edit their data, and the tables are dynamically updated.
Profile Display:
When a user logs in, the username is displayed, and user-specific data (events, assignments, and study plans) are loaded from localStorage.
The logout button clears the session and redirects the user to the homepage.
5. Project Enhancements:
Improved Homepage:
Add a background image to the homepage and enrich the content with more descriptions or feature highlights.
Enhanced About Page:
Ensure that the about section is visually appealing with a good background image and well-styled text.
Image Display in Home and About Pages:
You have already added space for images with good CSS styling. You can replace the placeholder images with actual content that matches the apps theme.
