AI with Kyle
Posts
Saturday Sessions: Claude Code on the Web

Saturday Sessions: Claude Code on the Web

Claude Code free credits

Kyle Balmer
November 08, 2025

It’s Saturday!

Today I want to give you a run down of how to get started using Claude Code.

The BIG daddy of vibe coding.

And also the most intimidating! Until today at least.

You’ve probably heard people extolling the virtues of Claude Code as the “best” tool for coding. But equally you may not know how to get access. Or maybe you’ve had a look into it and thought “nope! not for me!”.

That’s understandable considering the first instruction for using Claude Code looks like this:

Sorry what now?

Ooooo easy! Just type “npm install -g @anthropic-ai/claude-code” somewhere or another cool cool cool.

NOT user friendly. If you’ve never used a terminal/CLI (that’s where you type that mess above") this is incomprehensible!

However, Anthropic recently released a new “version” of Claude Code.

It’s called Claude Code Web and it looks like this:

Much better!

If you’ve used Lovable, Bolt, Replit or indeed any of the main vibe coding tools this looks a lot more familiar. It’s a chat interface - basically the same as how we use ChatGPT etc.

And right now if you have a Claude account already you’ve been given free credits. Lots of them.

Too many arguably! This is my current count:

$967 to go!!

If you are on the $20/month plan you’ve been given $250 free Claude Code credits. If you are on the $200/month plan you’ve been given $1000 credits.

To put that in perspective I’ve worked using Claude Code on the web for 4-5 hours and only spent $33 …still $967 left! And all to spend before the 18th November.

So, the stars are aligned. We have i) access to the world’s best coding model and ii) it’s via a chat interface and iii) free credits for the next 10 days.

Let’s get to work

Let’s get you set up so you can actually use Claude Code Web. There are one or two quirks which, if you haven't touched vibe coding, may trip you up. So today I want to smooth that all out and get you started.

Go to Claude Code

First step is nice and easy. Head to https://claude.ai/code to see the web interface. You can also do this on the phone app version of Claude - just look for Code in the side bar. You will need a paid plan.

Github

OK here is the fiddly bit I’ve seen people get stuck on. To use Claude code you need to connect Github. But what if you have no idea what Github is? Welp, that’s where people bounce off.

Github is (and I’m oversimplifying) a website where you can store your project files. Think of it like a cloud storage folder, like Google Drive or Dropbox. But it’s specifically for coding projects.

Projects are kept in something called a repo (short for repository) which is basically a folder. And when you make changes the repo is updated.

The reason for this (you don’t really need to know this at this stage!) is similar to Google Docs. Remember before Google Docs etc. when you would have to send something like an Excel sheet to all your team members. Everyone would work on the Excel on their own computer. And then send it back to you via email. And you’d end up having to align and merge everyone’s changes - nightmare. Cloud documents made this easier by allowing everyone to literally be on the same page - they could see in real time all the changes be made so they knew not to reduplicate efforts or make changes that would muck up other people’s work. Github is similar - sort of!

Claude Code will need a Github repository to work from. A place to store your files.

To get this working first go to https://github.com/ and set up a free account.

Look for “New Repository” or go directly to https://github.com/new and you’ll get to a screen like this:

Give your repository a name. If you already have an idea for a project use a name that makes sense. Otherwise “Test” is fine for now. Set the project to Public and click Create Repository. Public means it will be accessible - which we’ll need for testing. More on this later.

Now go back to Claude Code and connect to Github. Use the Github button below the main chat window and look for:

Click here and follow the instructions to allow Claude Code to have access to your Github. Then choose your repository. OK done!

Your first project

Once you’ve got Github connected you can use Claude Code like normal. The chat panel will now be able to work with your repo, make and edit folders and files and start to build your software. The world is now your oyster.

To start as a test stay basic “Make a me a to-do list” or “Build a calculator for me”. Some basic fun test project just to see what Claude Code is capable of.

Claude will run off and get building. Depending on the complexity of the task it’ll return results in a minute or two. That said one of the amazing things about Claude code is that if a task is big it will take a long time to get it done. That’s actually a good thing! Lots of vibe coding tools will expend the same amount of effort regardless of a task - which means they are great for small specific prompts but try to “rush” longer tasks that require more work.

Claude Code will actually expand its work effort to the task at hand. I’ve had it plug away at a particularly complex task for 45 minutes once!

Anthropic (Claude’s creators) reported it spending 30 hours on a task once!

Busy bee

Very cool! Basically an autonomous worker at that point. Although personally I’d assume at 30 hours it had crashed out! I applaud their confidence in letting it run!

Testing and deployment

You’ve got the basics and can now produce code.

At this point you’ll probably notice something is missing.

How can you, you know, see and test the software???

Other vibe coding tools have a “preview” or “live” mode where you can see what’s being built and play around with it. It’s what makes Lovable et al. much more accessible.

But with Claude Code nope…you just have your chat window. What gives??

To preview and play with the app we’re building we have a couple of options. Actually…many many many options but we’re going to keep it simple for now!

The simplest method is using Github Pages. Basically Pages allows you to publish your app and gives you a public link you can access to play around with the app.

To do this:

Open up Github and find your repo
Go to Settings > Pages
Select your “branch” (there should only be one right now) as the source
Github will give you a URL like https://yourusername.github.io/proectname
Open that URL up in a browser

This is a quick and dirty method to get visibility and test the app. It’ll also update as your project updates. The main downside of course is that your code is public. For toy projects and testing out Claude Code this is not a problem at all. You can publish Pages on Github privately for $48/year by upgrading to Github Pro (which allows lots of projects + Pages, not just the one!) later if need be.

OR you can test locally or on a server. Locally means bringing the files onto your computer and running something called localhost and then opening the project in your browser. And on a server would mean connecting Github to something like Vercel or Netlify to host the files. Both are relatively simple to do but beyond the scope of this guide.

Remember though you can always just ask the AI! “Hey Claude, I want to be able to see and play with my current project but don’t know how. What are my options?” Never underestimate just asking the tool!!

Get to it

OK!

You now have everything you need to get over the initial “technical” hurdles of using Claude Code.

It’s now available via the web in a browser or the Claude app. Much easier than using command line in the terminal!!
You know what Github is and how to set it up and connect. It’s Google Drive but for Code and we just need to click a few buttons to connect.
And you know how to actually preview your project. Using Github Pages as a quick and dirty method and later looking into other options.

That’s enough for you to right now get started with Claude Code. I promise that if you spend the next hour or so getting through this setup (hopefully less!) you’ll have the mot powerful coding tool in the world at you fingertips this weekend.

Kyle