How rouicezar/vibecoding-guide works
Vibe Guide is a bilingual beginner’s guide for turning an idea into an AI-assisted project. Its intended user journey runs from describing and validating an idea, through choosing tools and a technical approach, to planning, building, testing, delivery, and maintenance. Content modules cover the roadmap, prompts, troubleshooting, resource guidance, component examples, glossary, and project research; browser scripts provide navigation and local project drafts. The supplied tree omits the page and component source described in the README, so UI wiring and several runtime handoffs cannot be verified here.
Main entry points: learning.ts Learning stages · idea-template.ts Idea template · resource-tasks.ts Resource tasks · component-fit.ts Component fit
Components 23
Learning roadmap
- Learning stages
src/data/learning.ts - Learning branches
src/data/learning-branches.ts - Learning support
src/data/learning-support.ts - Prompt review
src/data/learning-prompt-review.ts
Project planning
- Project journey
src/data/journey.ts - Idea template
src/data/idea-template.ts - Resource tasks
src/data/resource-tasks.ts - Tool guidance
src/data/tools.ts - Stack choices
src/data/stacks.ts - Project workflows
src/data/project-workflows.ts - Action guides
src/data/action-guides.ts
Reference library
- Resource guidance
src/data/resource-guidance.ts - Component fit
src/data/component-fit.ts - Component demos
src/demos/advanced.js - Glossary catalog
src/data/glossary/catalog.ts - Term diagrams
src/data/glossary/visuals.ts - Project research
src/data/explore/index.ts
Browser features
- Project drafts
src/scripts/project-storage.ts - Browser storage
- Site navigation
src/scripts/navigation.ts - Template interactions
src/scripts/templates.ts
Other components
- Beginner
- Built project
Connections 21
- Beginner → Learning stages: explores roadmap
- Learning stages → Learning branches: expands stages
- Learning stages → Learning support: offers recovery
- Learning stages → Prompt review: uses prompts
- Beginner → Idea template: frames idea
- Idea template → Project journey: informs planning
- Beginner → Tool guidance: compares options
- Beginner → Resource tasks: uses worksheets
- Resource tasks → Stack choices: assesses technology
- Beginner → Project workflows: plans project
- Beginner → Action guides: follows actions
- Beginner → Resource guidance: consults guidance
- Beginner → Component fit: chooses components
- Component fit → Component demos: previews examples
- Beginner → Glossary catalog: looks up terms
- Glossary catalog → Term diagrams: explains concepts
- Beginner → Project research: researches ideas
- Project drafts → Browser storage: reads and writes
- Beginner → Project drafts: saves or restores
- Site navigation → Beginner: supports navigation
- Beginner → Built project: builds and delivers