Skip to content

AvilS-PL/student-planner

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

77 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

TypeScript React Node.js

🎓 Student Planner - Gamified Academic Organizer

Student Planner is a full-stack web application designed to help students manage their time, assignments, and academic activities. The project incorporates gamification elements (XP and leveling systems) to motivate users to work consistently and complete tasks on time.

🚀 Project Overview

Student Planner Dashboard
Main dashboard of the application.

✨ Core Features

  • 🔐 User Authentication: Secure registration and login flow utilizing JSON Web Tokens (Access & Refresh tokens) and Bcrypt password hashing.

  • 🎮 Gamified Activities: Users can create categories for school subjects, projects, or hobbies. Completing tasks rewards the user with Experience Points (XP), allowing them to level up specific activities and track their total time investment.

    Activities View

  • 📋 Task & Subtask Management:

    • Add detailed tasks with descriptions, estimated completion times, priorities, and due dates.

      Tasks View (from dashboard)

    • Break down complex assignments into manageable Subtasks (to-do lists).

    • Built-in timer to track the exact time spent on active tasks.

      Single Task View

    • Kanban-style tracking ("To Do", "In Progress", "Done").

    Single Activity View

  • 🧠 Automated Scheduling Algorithm (Planner):

    • Users define their preferred free time slots for each day of the week.
    • The algorithm automatically generates an optimized daily schedule (for today or tomorrow).
    • It intelligently allocates tasks to specific time blocks by calculating task duration, priority, due dates, and the user's defined free time.
    • Generated schedules can be manually edited and adjusted.

    Automated Daily Planner
    The automated algorithm allocates tasks around the user's defined free time.


🛠️ Technologies & Architecture

The project is divided into a frontend client and a backend API, both heavily utilizing TypeScript for type safety.

Frontend (/student-planner)

  • Framework: React (v19)
  • Build Tool: Vite
  • Routing: React Router (v7)
  • State & Data Fetching: Axios
  • Date Manipulation: Day.js
  • Auth Utilities: jwt-decode
  • Styling: CSS Modules

Backend (/backend)

  • Environment: Node.js
  • Framework: Express.js
  • Database: SQLite (Local development database)
  • ORM: Prisma
  • Security & Auth: JWT, Bcrypt, CORS
  • Environment Management: dotenv

💻 Local Setup & Installation

To run the project locally, you will need to start both the backend server and the frontend development environment.

Prerequisites: Ensure you have Node.js installed.

1. Repository Cloning

Clone the repository and enter it:

git clone https://github.com/AvilS-PL/student-planner.git
cd student-planner

2. Backend Setup

Navigate to the backend directory, install dependencies, and initialize the database:

cd backend
npm install

# Setup the SQLite database and generate the Prisma Client
npx prisma migrate reset
npx prisma generate

# Start the development server (runs on the port defined in .env, default 3000)
npm run dev

3. Frontend Setup

Open a new terminal window, navigate to the frontend directory, and start the Vite server:

cd student-planner
npm install

# Start the frontend application
npm run dev

⚠️ Note on Ports: By default, Vite runs the frontend on http://localhost:5173. Ensure it runs on this exact port, as the backend CORS policy is strictly configured to accept requests from this origin.

👥 Authors

  • Mateusz Śliwa   GitHub
  • Jan Ślosarczyk   GitHub

About

Final WDAI project

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages