The practitioner's guide to Claude Code. From "what even is this?" to "I can't work without it."
Conversational. Opinionated. Interactive terminal demos on every page.
Most people install Claude Code, type a prompt, get a mediocre answer, and walk away thinking "AI coding tools aren't that useful."
They're wrong. They just skipped the setup.
Without CLAUDE.md: Claude Code guesses your stack, writes .jsx in a TypeScript project, uses inline styles when you use Tailwind.
With CLAUDE.md: Same prompt produces production-ready code that matches your exact conventions. Every time.
This guide shows you how to go from zero to "I can't work without this" in about a week.
The guide lives at claudecodeguide.dev. You don't need to install anything or clone this repo. Just open the site and start reading.
Open the 9-Step Setup Guide — takes about an hour, sticks forever.
You don't need to be a developer. You don't need to know what a terminal is. You need to want Claude Code to actually work well.
- Absolute beginners who installed Claude Code and aren't sure what to do next
- Developers who use it daily but feel like they're leaving half the value on the table
- Product Managers who want to ship without waiting for eng — there's a whole templates section for you
- Founders building MVPs with AI and no dedicated engineering team
- Team Leads rolling out Claude Code across a team and want a repeatable playbook
- Anyone who tried it once, thought "meh", and deserves a second shot with proper context
The guide is 34 pages across 5 sections, plus 15 hands-on tutorials for every audience. Here's the full table of contents:
|
|
Start Here — terminal + Claude App + VS Code routes No Terminal Required — Claude web app only For Product Managers
For Everyone — no code, no terminal |
No walls of text. Every concept shows you what to expect before you try it:
~ $ claude "add email validation to the signup flow"
Reading signup form, API route, and schema...
✓ Created lib/validation.ts
✓ Updated signup form with error states
✓ Added server-side validation in API route
✓ 3 tests written and passing
→ Same task. Autocomplete vs full execution.
45+ animated terminal demos across 34 pages. Every tutorial also has an animated Claude App chat demo — no terminal required. The philosophy: show, don't tell.
Once you've finished the guide, there are a few other tools built for the same audience — practitioners who want to actually get things done with AI, not just read about it.
If you're a PM specifically, PM Pilot is built for you — Claude Code pre-configured for product work, ready to install once you've done the guide.
| Tool | What it does |
|---|---|
| pm-pilot | Claude Code configured for PMs. 25 skills, ready to install. |
| bug-shepherd | Zero-code bug triage for PMs. |
| ceremonies | Agile ceremonies that don't suck. Retros, estimation, team analytics — open source. |
| morning-digest | Your morning briefed in 30 seconds. |
| root-kg | Your knowledge graph. Ask questions across all your notes, meetings, and emails — cited answers in plain English. |
The guide is built with Next.js and Fumadocs. Every article is an .mdx file in content/docs/. If you can write Markdown, you can contribute.
Ways to help:
- Fix a typo — edit any
.mdxfile and open a PR - Suggest a topic — open an issue
- Add a template — create a new
.mdxincontent/docs/templates/ - Improve a demo — DemoCard components are in
src/components/demo-card.tsx
To run the site locally:
git clone https://github.com/mshadmanrahman/claudecode-guide.git
cd claudecode-guide
npm install
npm run devSee CONTRIBUTING.md for full details.
Tech stack:
| Layer | Tech |
|---|---|
| Framework | Next.js 16 (App Router, Turbopack) |
| Docs Engine | Fumadocs |
| Content | MDX with custom components |
| Styling | Tailwind CSS v4 |
| Fonts | Newsreader + Space Grotesk + Geist Mono |
| Hosting | Vercel |
- 34+ content pages with interactive terminal demos
- 9-step interactive setup guide with progress tracking
- Blog with Substack email capture
- Learning roadmap with 5 stages
- Dark mode, responsive, Vercel deployment
- 15 hands-on tutorials — terminal, Claude App, and VS Code/Cursor routes
- Animated AppChatDemo component for non-coder learning paths
- Shareable achievement cards at the end of every tutorial
- GA4 event tracking (tutorial_start, tutorial_complete)
- Video walkthroughs (Remotion)
- Community templates gallery
- "Ask the guide" AI assistant
- Translations (Bengali, Swedish, Spanish)
If this guide helped you, give it a star -- it helps others find it and keeps development going.
- pm-pilot -- Claude Code configured for PMs. 25 skills out of the box.
- root-kg -- Personal knowledge graph. Ask questions across all your notes, meetings, and emails.
- morning-digest -- Your morning briefed in 30 seconds. Calendar, email, Slack, and action items.
- discovery-md -- AI product discovery for PMs. From braindump to stakeholder one-pager.
- ceremonies -- Agile ceremonies that don't suck. Retros, estimation, team memory.
- bug-shepherd -- Zero-code bug triage for PMs. Reproduce and sync bugs without reading code.
MIT. Use it, fork it, make it yours.
Built by Shadman Rahman Senior Product Manager. Claude Code practitioner. Writing about AI workflows.
Subscribe to the newsletter for new guides and updates.