# Full-Stack Web Development with React & Node

<Avatar name="Sarah Chen" subtitle="Instructor · Senior Software Engineer" />

<Card title="Course Overview">
<Columns>
<div>
<Stat label="Overall Progress" value="64%" icon="chart-line" tone="info" change="+8% this week" />
<Stat label="Average Learner Rating" value="4.8 / 5" icon="star" tone="success" />
</div>
<div>
<Callout tone="info" title="Next up">Lesson 12: State Management with React Hooks — starts in about 15 minutes of study time.</Callout>
<Button variant="primary" size="large">Continue Learning</Button>
</div>
</Columns>
</Card>

<Card title="Course Modules">
<Steps>
<Step title="Module 1: JavaScript Fundamentals" status="done" subtitle="Completed · 6/6 lessons">
- Variables, scope, and closures
- Async patterns: promises & async/await
- ES6+ syntax deep dive
- Error handling and debugging
- Module quiz: 92%
</Step>
<Step title="Module 2: React Basics" status="done" subtitle="Completed · 8/8 lessons">
- Components and props
- JSX and rendering
- Conditional rendering and lists
- Handling events and forms
- Component lifecycle
- Module quiz: 88%
</Step>
<Step title="Module 3: Advanced React & Hooks" status="current" subtitle="In progress · 5/8 lessons">
- useState and useEffect
- Custom hooks
- Context API
- **Next: Lesson 12 — State Management with React Hooks** <Badge tone="info">Next up</Badge>
- Lesson 13: Reducers and useReducer
- Lesson 14: Performance optimization
- Lesson 15: Module quiz
</Step>
<Step title="Module 4: Node.js & Express" status="todo" subtitle="Not started · 0/7 lessons">
- Setting up a Node server
- RESTful APIs with Express
- Middleware and authentication
- Working with databases (MongoDB)
- Deployment and production
- Module quiz
</Step>
<Step title="Module 5: Capstone Project" status="todo" subtitle="Not started · 0/3 lessons">
- Project planning and setup
- Building the full-stack app
- Final review and submission
</Step>
</Steps>
</Card>

<Card title="Module 3 Progress">
<Progress value="5" max="8" label="5 of 8 lessons complete" tone="info" />
</Card>

<Card title="Course Details">
| Item | Value |
|---|---|
| Instructor | Sarah Chen |
| Total Lessons | 32 |
| Completed | 19 |
| Average Learner Rating | 4.8 / 5 (based on 1,204 ratings) |
| Certificate | Included upon completion |
</Card>

<FollowUps>
- Show me the next lesson content
- What are the prerequisites for Module 4?
- How does my progress compare to other learners?
</FollowUps>