Syllabus Map
A syllabus planner app idea: a course outline becomes weekly goals. Weekend build with Next.js, Claude API and Supabase, for self-taught developers and students.
Why now
Self-paced learning posts on Dev.to and Hacker News all share the same failure: no plan. Turning an outline into a schedule is a clean, contained use of an LLM.
The spec
Paste a syllabus or a course outline and get a week-by-week map with goals you can tick off and a realistic finish date.
Build time
WeekendAPIs or integrations · Level 3 of 5Audience
Self-taught developers and students.
Stack
- Next.js
- Claude API
- Supabase
Fun factor
The course you started three times, finished once.
Core features
- Paste an outline or a link
- Weekly plan with hours per week
- Checkable goals
- Finish date that updates as you go
AI features
- Outline parsing into topics
- Rebalancing when you fall behind
Stretch goals
- Multiple courses
- Calendar export
- Study buddy sharing
First version
Outline in, weekly checklist out, saved in the browser.
Build plan
3 milestones, in the order you would build them. Saved ideas get this plan with checkboxes and notes.
The build prompt
Paste this into ChatGPT, Claude, Codex, or Cursor, then build the first version before anything else.
# Build Syllabus Map You are a senior full-stack engineer pairing with me on a side project. Build a working first version of the product described below. Read the whole brief before writing any code, then follow "How to work" at the end. ## The idea **Syllabus Map.** Paste a syllabus or a course outline and get a week-by-week map with goals you can tick off and a realistic finish date. **Why now:** Self-paced learning posts on Dev.to and Hacker News all share the same failure: no plan. Turning an outline into a schedule is a clean, contained use of an LLM. **Who it is for:** Self-taught developers and students **What makes it fun:** The course you started three times, finished once. ## Scope - **Build time:** Weekend. Size every decision to ship a working first version inside this window. - **Technical ambition:** Level 3 of 5, "APIs or integrations". The product leans on third-party APIs. Wrap each integration in its own module, handle its failures and rate limits, and cache what is safe to cache. - **First version only.** Ship the core features below end to end. Stretch goals are listed so you can design around them, not build them. ## Core features (each must work end to end in the first version) 1. Paste an outline or a link 2. Weekly plan with hours per week 3. Checkable goals 4. Finish date that updates as you go ## AI features - Outline parsing into topics - Rebalancing when you fall behind How to build them: - Put every model call behind one server-side module with a typed interface, so the provider can change without touching the UI. - Read API keys from environment variables only, and document each one in `.env.example`. - Write prompts as versioned constants with clear instructions and an example of the expected output; parse and validate responses before using them. - Handle timeouts, rate limits, and malformed output with a graceful fallback the user can understand. Stream responses where a wait would exceed a couple of seconds. - Never let a feature depend on the model being perfect. Show the result, let the user edit or retry. ## Stretch goals (later, not in the first version) - Multiple courses - Calendar export - Study buddy sharing Leave clean seams for these (a module boundary, a nullable column, a feature flag), but do not implement them unless I ask. ## Tech stack Use exactly: Next.js, Claude, Supabase. Stay on current stable versions, follow each tool's official conventions, and add a library only when the standard library or the chosen stack cannot do the job cleanly. If part of this stack is a poor fit for a specific requirement, say so and propose the smallest change. ## Owner's notes Written by me, the project owner. Treat these as requirements and preferences that override the generated material above when they conflict. The first version should be exactly this, and no bigger: Outline in, weekly checklist out, saved in the browser. ## Build plan (with saved progress) 0 of 3 steps complete. Resume at step 1: Outline parsing. Before you start it, check what is already implemented so you do not repeat finished work. 1. **Outline parsing** [not started] Topics with estimated hours. 2. **Weekly plan** [not started] Spread across available hours. 3. **Progress** [not started] Tick goals; recompute the finish date. ## Definition of done for the first version - [ ] Paste an outline or a link works end to end, with real data, not a placeholder. - [ ] Weekly plan with hours per week works end to end, with real data, not a placeholder. - [ ] Checkable goals works end to end, with real data, not a placeholder. - [ ] Finish date that updates as you go works end to end, with real data, not a placeholder. - [ ] Every screen handles loading, empty, and error states. - [ ] Typecheck, lint, and any tests pass, and the main user flow was exercised by hand. - [ ] A README explains setup, environment variables, and how to run it locally. ## Quality bar - Responsive from a phone to a desktop, keyboard-accessible, semantic HTML, visible focus states, labelled inputs, and sensible contrast. - Loading, empty, and error states for every screen that reads or writes data. Errors say what happened and what to do next. - Validate on the server, never trust the client, and keep secrets in environment variables with a committed `.env.example`. - Type-safe end to end. No `any` without a comment explaining why. - Small, readable modules named after what they do. No premature abstraction, no dead code, no TODOs left for later without a note. - Sensible defaults over settings. If a choice is not in this brief, pick the simplest option that keeps the product coherent and say what you chose. ## How to work 1. **Read, then restate.** Summarize the product in three sentences and list your assumptions. Ask only the questions that block implementation. For everything else, decide and note the decision. 2. **Plan before code.** List the files and modules you will create, in build order, mapped to the core features. If a build plan is included above, use it instead: resume at the first step not marked done and check what already exists before touching it. 3. **Set up.** If a project already exists, inspect its code, instructions, and conventions first and build on them. Otherwise scaffold the stack above with linting, formatting, a typecheck script, `.env.example`, and a README stub. 4. **Model the data first.** Define the types, schema, and any migrations before the UI, so the shape of the product is settled early. 5. **Build in vertical slices.** Finish one core feature end to end (data, logic, UI) before starting the next. Keep the app runnable after every slice and commit each slice with a message that says what changed and why. 6. **Then the interface.** Apply the quality bar above to each screen as it lands, not as a final pass. 7. **Verify.** Run typecheck, lint, and tests. Exercise the main user flow by hand. Check each item in the definition of done and each acceptance criterion. 8. **Report.** Tell me what works, what you tested and how, what is not done, every setup step I must complete myself, and the three most useful next steps. Never claim a service, test, or flow was verified when it was not. If you can edit and run the project, start implementing right after the short plan. If you cannot, give me concrete code and the exact commands to run for the next step. Rules: keep the product name and the scope as written, do not invent features, prefer boring and proven choices, and stop to ask me when a decision would be expensive to reverse.
How to use
- Copy the prompt above.
- Open ChatGPT, Claude, or your AI editor and paste it into a new conversation.
- Build milestone one, run it, then move to the next. Add stretch goals only after the first version works.
Want ideas built around you instead? Generate four from your own interests, time, and stack.
FAQ
Frequently asked questions
Answers on what Syllabus Map is, how to build it, and where example ideas come from.
Similar to Syllabus Map
More education ideas, then a few from other categories.
Ready to generate yours?
Four ideas per round, shaped by your interests, skill level, and how much time you have.