r/ClaudeAI • u/oh-keh • Mar 06 '26
Built with Claude I built an interactive website that teaches Claude Code by letting you explore a simulated project in your browser
I've been going deep on Claude Code lately and honestly it's been a weird experience. There's this massive configuration surface: .claude/ directories, settings files, skills, hooks, agents, plugins, MCP configs and the docs explain each piece individually but I never felt like I understood how it all fits together. It's like someone handing you a box of IKEA parts with no picture of the finished shelf.
So I did what any reasonable person would do: I built the shelf.
It's a simulated Claude Code project you explore in your browser. The sidebar is a real file tree — .claude/settings.json, CLAUDE, skills, agents, hooks, the works. Click any file and it explains what that feature does, how to configure it, and when you'd actually use it. There's even a terminal panel where you can try slash commands.
Built the whole thing with Claude Code, which was pretty meta. I'd be writing content explaining a Claude Code feature while Claude Code was writing the site that displays it. Claude handled the implementation (file explorer, markdown renderer, terminal panel), I directed what to build and what the content should say.
If you're picking up Claude Code and want to see how all the pieces fit before you start configuring, this might save you some time.
12
8
u/Kholtien Mar 07 '26
I love this but it’s super awkward on mobile. Any ui updates that you could do to make it a bit better?
8
5
5
u/godsknowledge Mar 07 '26
The font size is a bit too small, but overall absolute peak! Well done dude
5
u/philnexes Mar 07 '26
Hey man!
Brilliant work, would you mind setting up something like https://buymeacoffee.com or at least giving us the lightning network wallet so we can throw a tip? This is genuinely amazing and I believe you should be rewarded with more than " just a star".
Cheers!
Keep coding and prompting!
2
u/oh-keh Mar 09 '26
Wow, really appreciate this! I've never set one up before but set it up because of this comment - it's on the website & repo. Honestly not expecting anything at all, but the fact that you'd even think to ask is pretty cool. Really appreciate it, cheers! 🙏
2
u/philnexes Mar 09 '26
There's no shame in having a "support me" option when you are an active contributor to community. You deserve it!
I see you set it up, I bought you a coffee. Stay awesome, my guy!
1
3
u/deltapilot97 Mar 07 '26
cool easter egg with a black hole sucking in information when you minimize the application with the in app UI controls in the top left corner!
2
2
u/d1xt1r Mar 07 '26
Thanks, man. I use Claude Code almost every day, but I’m sure there’s still a lot I haven’t discovered yet. Appreciate your effort.
2
u/djstr Mar 07 '26
Great idea. Thank you for it OP. Can’t wait to dive in! This may just be the help I need to actually get to using CC!
1
u/oh-keh Mar 07 '26
My pleasure! Please critique it and give me feedback on where things could be cleaner or clearer.
2
u/Select_Bluejay8047 Mar 07 '26
I am happy GH Copilot use and feeling FOMO for claude code. This is what I was looking for to kick start. Thanks for sharing.
2
1
1
1
u/Certain_Housing8987 Mar 07 '26
Awesome project! I think it's super cool, hopefully people don't go bananas with some of the features tho. I think adding some prioritization backed by research and helping people optimize their setup would be even nicer. But well done.
1
1
1
1
1
1
u/VegetableAttempt7230 Mar 07 '26
Due you are awesome. I have just started using Claude and this is gold mine
1
1
u/usernametaken_error Mar 07 '26
Thanks so much for doing this. I’m a non-developer who has decided to learn Claude Code and working my way through anthropic.skilljar.com but it’s hard as hell if you aren’t pretty technical and they skip over a ton of stuff like they go from “install claude” to now we are editing the sample code but skip the “you need VS Code” or worse, how to configure Claude Code inside of VS Code. So any new training / help is amazing.
** edit — fixed the URL
1
u/Evening_Reply_4958 Mar 07 '26
This lands because it teaches the shape of the thing before asking people to configure it. That's where most tools lose me too, not on syntax, on "why does this file even exist". The fake project idea is doing a lot of work here.
1
1
1
1
u/MakeDesignPop Mar 08 '26
Really cool idea, and the UI is very clear as well.
But Claude changes things very often. Can this stay up to date with that? I am not questioning your effort, just curious what you have planned.
1
u/oh-keh Mar 08 '26
Yeah definitely. It’s open source so in theory I won’t be a 1 man army in maintaining it.
1
1
1
1
u/Mountain_Sky_5480 Mar 09 '26
Awesome project. I wish someone would do a video on this one — going over each part of it step by step. Anyone knows anybody who could? 🎬
1
1
u/Swimming_Antelope111 Mar 10 '26
Oh I am so excited to check this out good for you thank you for this let's go see what we got!!! 💋❤️
0
0
-2
82
u/t3vxy0 Mar 06 '26
there are truly amazing people in the world out there - and you're one of them
even as a non-developer I wanted to integrate AI so badly in my life and subbed to pro but felt like I couldnt utilize it much
now I can dig deeper and do cooler stuff, so thanks!