Boost productivity for students and educators with centralized study material
Note Forge is a web app where you store exercises, tag them by subject and difficulty, and drag them into exportable LaTeX study guides.
🎮 Live Demo · ✨ Features · 📖 Docs · 🐛 Issues
Note Forge was born out of a real need: as a tutor at my university, I found myself spending too much time searching for exercises, images, and references to assemble study guides for my students. With materials of varying difficulty, format, and source, the process was inefficient. Note Forge solves that.
| Role | How it helps |
|---|---|
| 🎓 Students | Centralize all study material — exercises, images, and answers — in one place |
| 👨🏫 Teaching Assistants | Build study guides from an existing exercise bank with drag-and-drop |
| 👨💼 Professors | LaTeX support for distributing exercises across subjects and exporting guides effortlessly |
- 🎨 Modern UX — rose, amber, and slate color palette with clean, animated UI
- 🌍 i18n support — full English and Spanish translations
- 🎮 Interactive demo — no registration, no Docker, no backend needed. Try it here
- LaTeX Editor — real-time rendering for equations, matrices, and scientific notation with syntax highlighting
- Rich Metadata — 5-level difficulty rating, duration estimates, multi-tag support, custom images, and references
- Advanced Search — filter exercises by subject, difficulty, or whether they include images
- Drag & Drop Interface — intuitive reordering with smooth animations
- Unified Workspace — three-panel layout: exercise library, guide metadata, and live preview
- Smart Metrics — automatic total time calculation (15 min/exercise) and average difficulty with visual indicators
- Export Options — save drafts and export to LaTeX (
.tex) format
- Flexible Organization — subject-based categories with custom images, rich descriptions, and unlimited nesting
- Dedicated Views — hero sections with cover images, tabbed interface (exercises vs. guides), and pinnable favorite subjects
- Complete i18n with English and Spanish
- Full-featured interactive demo with pre-loaded mock data — no setup required
Dashboard
Categories
Guides
Export
| Technology | Version | Purpose |
|---|---|---|
| React | 18.3 | UI library with hooks and functional components |
| TypeScript | 5.5 | Type safety and enhanced developer experience |
| Vite | 5.0 | Lightning-fast build tool with instant HMR |
| TailwindCSS | 3.4 | Utility-first CSS for rapid development |
| React Router | 6.x | Client-side routing with nested routes |
| react-i18next | 16.0 | Complete i18n solution with language detection |
| Technology | Version | Purpose |
|---|---|---|
| Node.js | 22+ | JavaScript runtime with ES modules |
| Express | 4.x | Fast, minimalist web framework |
| MySQL | 8.0+ | Relational database with JSON support |
| JWT | 9.x | Stateless authentication tokens |
| bcrypt | 6.0 | Password hashing and security |
- Context API for global state management
- Custom React hooks for reusable logic
- Docker & Docker Compose for containerization
- GitHub Pages for demo deployment
The fastest way to explore Note Forge — no setup needed:
- Visit xhandlr.github.io/note-forge
- Click "Probar sin registrarse" on the landing page
- Explore full functionality with pre-loaded mock data
The demo includes pre-configured categories, sample exercises with LaTeX, study guides with drag-and-drop, and full search capabilities.
For local development:
- ✅ Node.js v22.x+ — Download
- ✅ MySQL 8.0+ — Installation Guide
- 🐳 Docker/Podman (optional) — Get Docker
- 📦 npm or pnpm — comes with Node.js
1. Clone the repository
git clone https://github.com/xhandlr/note-forge.git
cd note-forge2. Set up the database
mysql -u root -p
source db/init.sql3. Configure environment variables
cp note-forge-api/.env.example note-forge-api/.env
# Edit .env with your database credentials:
# DB_HOST=localhost
# DB_USER=root
# DB_PASSWORD=your_password
# DB_NAME=note_forge
# JWT_SECRET=your_secret_key4. Start the backend
cd note-forge-api
npm install
node index.js
# API running at http://localhost:50005. Start the frontend
cd note-forge-ui
npm install
npm run dev
# App running at http://localhost:5173git clone https://github.com/xhandlr/note-forge.git
cd note-forge
docker-compose up -d
# Visit http://localhost:5173To stop:
docker-compose downnote-forge/
│
├── db/ # Database layer
│ ├── init.sql # Initial schema and tables
│ └── init_test.sql # Test schema
│
├── note-forge-api/ # Backend (Node.js + Express)
│ ├── config/ # Database and auth configuration
│ ├── controllers/ # Request handlers
│ ├── services/ # Business logic layer
│ ├── models/ # Data models and SQL queries
│ ├── routes/ # API endpoint definitions
│ ├── middleware/ # JWT authentication
│ ├── .env.example # Environment template
│ └── index.js # Server entry point
│
├── note-forge-ui/ # Frontend (React + TypeScript)
│ ├── public/ # Static assets
│ └── src/
│ ├── assets/ # Images, fonts
│ ├── components/
│ │ ├── UI/ # Reusable components
│ │ └── Dashboard/ # Navbar, Footer
│ ├── contexts/ # React Context (Demo, Notifications)
│ ├── pages/ # Route-based views
│ │ ├── Auth/ # Home, Login, Registration
│ │ ├── Categories/ # Category views and forms
│ │ ├── Exercises/ # Exercise views and forms
│ │ ├── Guides/ # Guide builder workspace
│ │ ├── Dashboard/ # Main dashboard
│ │ └── Search/ # Search page
│ ├── services/ # API services
│ ├── mocks/ # Mock data for demo mode
│ └── i18n/ # EN/ES translations
│
├── docker-compose.yml
├── README.md
├── README_ES.md
└── LICENSE
This project is licensed under the MIT License.
Built with 🩷💛🩷 by xhandlr
If you find this project useful, consider giving it a ⭐ on GitHub!