A personal study dashboard designed to help students track habits, manage courses, calculate grades, and boost productivity.
StudyHub is a widget-based dashboard tailored for students. It replaces scattered productivity tools with a single, cohesive interface: exam dates, GPA, notes, habits, and a focus timer all live in one place.
There is no backend, no account, and no database. It is a vanilla JavaScript app built with Vite and Tailwind CSS, and everything it knows is kept in your browser's localStorage. The whole thing is a static bundle — the published build under docs/ is what GitHub Pages serves.
- Dashboard: Customizable widget layout with drag-and-drop ordering.
- Courses: Course list plus a detail page for materials, tasks, and per-course notes.
- Exams: Upcoming exam tracking with dates and countdowns.
- Cheatsheets: Collected quick-reference sheets, each with its own detail page.
- Weekly Schedule: Grid timetable for recurring classes.
- Grade Calculator: Weighted grade and GPA calculation.
- Focus Timer: Pomodoro with configurable work and break intervals.
- Stopwatch: Track pure study time with precision.
- Habit Tracker: Daily habit monitoring with streak counters and progress bars.
- Digital Notebook: Rich text editor with multiple paper styles (lined, grid) and infinite scrolling.
- Scratchpad: Freehand drawing surface with a saved gallery.
- Bookmarks & Highlights: Keep links and saved snippets next to the work they belong to.
- Widgets: Clock, photo, stats cards, weekly activity chart, and mini games.
- Theme Engine: Curated color presets or your own custom accent color.
- Visuals: Glassmorphism UI with smooth animations and transitions.
- Responsive: Optimized for desktop, tablet, and mobile, including safe-area insets.
- Onboarding: First-run setup that seeds the dashboard with your details.
Full localization support, currently English (en) and Turkish (tr).
- AI Tutor: Currently a UI prototype; backend integration is pending.
- Cloud Sync: Data is stored locally on the device; there is no cross-device sync.
- Mobile App: Available as a web app; native iOS/Android apps are on the roadmap.
- Partial Backup: Export writes the main
studyhub_datarecord only. Habits, the grade calculator, Pomodoro settings, the scratchpad, and the widget layouts live under their ownlocalStoragekeys and are not included — see Data Storage. - One Network Request: The app itself sends nothing anywhere, but
index.htmlloads the Inter typeface from Google Fonts, so the page is not strictly offline. - Clearing Site Data Clears Everything: There is no copy anywhere else. Export before you reset a browser profile.
- Build Tool: Vite 6
- Core: Vanilla JavaScript (ES6+ modules), no framework
- Styling: Tailwind CSS 3.4 with PostCSS and Autoprefixer
- Icons: Inline SVG
- Storage: Browser
localStorage
Requires Node 18+ (Vite 6's baseline) and Python 3 for the launcher. There is nothing else to configure: no .env, no services, no database.
1. Clone.
git clone https://github.com/kaanddemir/studyhub.git
cd studyhub2. Run.
python run.pyIt checks the setup before starting and prints where to open the app:
StudyHub
────────────────────────────────────────────
Open http://localhost:5173/studyhub/
Data browser localStorage, nothing leaves the machine
Stop Ctrl+C
Ctrl+C stops it. Missing setup — no Node, a Node too old, a port already taken — is reported before anything starts, with the command that fixes it. npm install does not have to be run first: when node_modules is missing, run.py installs the dependencies itself and says so.
The /studyhub/ in the address is not a typo. The site is published under that subpath on GitHub Pages, so base in vite.config.js puts the app there in every mode; the server root is empty.
Both settings are environment variables and both are optional. PORT (5173) chooses the port; the dev server is bound to it strictly, so a port that is taken is reported rather than silently swapped. MODE chooses what to run: dev (default, hot reload), build (production bundle into docs/), or preview (build, then serve the result the way GitHub Pages will).
PORT=5174 python run.py
MODE=preview python run.pyThe site is published with GitHub Pages from docs/, which is why vite.config.js sets outDir: 'docs' and base: '/studyhub/' rather than the usual dist.
MODE=build python run.pyThat rewrites docs/. Committing it is the deploy — there is no pipeline behind it.
studyhub/
├── public/ # Static assets copied verbatim (logo)
├── src/
│ ├── components/ # UI components, one per page or widget
│ ├── data.js # Default state, load/save against localStorage
│ ├── translations.js # en / tr strings
│ ├── security.js # escapeHTML, used on every interpolated value
│ ├── main.js # App entry, router, theme restore
│ └── style.css # Global styles and Tailwind layers
├── docs/ # Production build, committed and served by Pages
├── index.html # HTML entry point
├── run.py # Entrypoint: python run.py, Ctrl+C stops it
├── vite.config.js # base and outDir for Pages
├── tailwind.config.js
└── LICENSE
StudyHub is local-first. Nothing is uploaded, and there is no server to upload it to — every record is written to your browser's localStorage under the origin you opened the app on.
The main record is studyhub_data (profile, courses, exams, cheatsheets, notebook, schedule, stats). Several features keep their own keys alongside it: habit_tracker_data_v3, grade_calc_data, pomodoro_settings, dashboard_notes_list, scratchpad_current, scratchpad_gallery, photo_widget_image, photo_widget_zoom, and the dashboardLayout / coursesLayout / cheatsheetsLayout widget orders.
- Backup: Settings → Export downloads
studyhub_backup_<date>.json. It contains thestudyhub_datarecord; the separate keys above are not in it. - Reset: Logging out clears all of the keys listed here and returns you to onboarding. It is a factory reset, not a sign-out.
This project is licensed under the MIT License.
Built by heykaan.dev