CourseViewer

A clean full-stack application for browsing and managing educational content — built to learn the craft properly.

Year: 2024
Role: Full-stack Developer
Client: Personal project
Stack: JavaScript · React · Node.js

CourseViewer — course browsing application

01 — Problem

Course material tends to end up as a pile of files and links with no structure. I wanted a single clean interface for browsing and managing educational content — and a project meaty enough to practice real full-stack architecture on.

02 — Approach

A React front end backed by Node.js, with the UI doing the heavy lifting: clear hierarchy, fast browsing, and an interface that gets out of the way of the content.

The project doubled as deliberate practice in component architecture, state management and clean API design — patterns I now use professionally every day.

Application anatomy — React component tree beside the Node.js REST API

2024Built from scratch

OpenCode on GitHub

03 — Result

A working full-stack application with a clean UI — and the foundation for the production systems I build today. The code lives on my GitHub.

Interface states of CourseViewer: browse, read and manage — Fig. 03 — Three interface states: browse, read, manage.

GitHub ↗

Next projectRüko GPT01