03-Setup & Codebase Understanding
By Ted Tyler
Summary
## Key takeaways - **Claude Code: Codebase Explainer First**: Before asking Claude Code to write code, use it as an explainer to understand new codebases and data. This ensures you have a better grasp of what's happening before generating code. [01:55] - **Agentic Search for Codebase Overview**: Claude Code agentically searches your codebase to identify important files and provide a high-level description of the application's architecture and features, saving you manual file navigation. [01:04] - **Visualize Codeflow with Diagrams**: Claude Code can generate diagrams to illustrate complex processes, such as the flow of a user query from front-end to back-end, aiding comprehension through visualization. [04:31] - **Initialize Claude MD for Project Memory**: Use the '/init' command to create a Claude MD file that initializes project-specific memory, including documentation, tests, and linting rules, for Claude Code to reference. [06:27] - **Git Integration for Commits**: Claude Code can automate Git commands, including writing descriptive commit messages, streamlining the process of adding and committing changes to your codebase. [13:22] - **Manage Conversation Context with Commands**: Commands like '/clear' and '/compact' allow you to manage Claude Code's conversation history, either starting fresh or retaining a summary to maintain context while shifting focus. [12:06]
Topics Covered
- How AI accelerates understanding unfamiliar codebases.
- Visualize complex system flows with AI-generated diagrams.
- Tailor AI's understanding with persistent project memory.
- Master AI interaction with essential workflow commands.
- Automate Git commits with AI-generated messages.
Full Transcript
The first example we'll work on is an
endtoend rag chatbot. Let's use cloud
code to explore the codebase. Before we
start using cloud code to write lots of
code for us, let's talk about how we can
use this tool to get up to speed on
larger code bases. Right here, I have an
application where I can chat with Claude
about course materials from deep
learning AI. So, let's try asking an
outline of a course. For example, what
is the outline of the MCP build rich
context AI apps with Anthropic? We'll
see here that I'll get a response with
quite a bit of detail around the lessons
and descriptions for each of those
lessons. With that in mind, let's see
how we can get up to speed on the
underlying code that powers this
application. Back in VS Code, I have the
terminal open here, and I'm going to hop
into Claude Code just by typing in
Claude and pressing enter. In this
application, I can start chatting with
my codebase. So, I'm going to start with
a highle question just to give me an
overview of the codebase. What we're
going to see cloud code do is
agentically search over the codebase,
figure out some of the most important
files and give me a description of
what's happening in this application.
Instead of searching through each
individual file, we're going to
agentically search and find the most
relevant ones. So here we're going to
get some information about the
architecture, the key components, some
of the features and now if there are
particular things I want to dig into, I
can easily do that. I can also ask other
higher level questions like how are
these documents processed? In this
application, we're using retrieval
augmented generation to fetch
information about these courses. If I
want to get more information about that
process, I can ask a question like this
one. We like to say that claude code is
a fantastic engineer alongside you, but
it's an even better explainer. So, as
you're getting up to speed with new code
bases, with new data sets, first start
using cloud code as a way to explain
things to you so that when you ask it to
write code, you can have a better
understanding of what's going on. Here
we can see the sources in the codebase
that are actually splitting text into
chunks, that are adding lesson context,
and that are storing course metadata.
This ability to quickly get up to speed
with a codebase, especially when you
might not be familiar with the
underlying technology or language, is
exceptionally valuable. Instead of
navigating to each of these folders and
figuring out what's going on, we can ask
more specific questions and even get
diagrams and visualizations made for us.
So the first thing I'll ask Claude is to
trace the process of handling a user's
query from front end to back end. You
can imagine you might have some limited
knowledge in one of the parts of the
stack or you're not familiar with how
this is all happening. So cloud code is
going to give us quite some useful
information here. What's useful when
you're seeing cloud code work is its
ability to give you a bit of a to-do
list so you can start to understand
what's happening. At any point in time,
you can press escape and guide cloud
code to follow a different set of
to-dos. But in this case, I feel pretty
good about what it's doing. It's going
to start tracing from the front end,
start following API endpoints, analyze
our retrieval augmented generational
system, and then figure out how to
actually generate the response. It's
reading the appropriate files that are
handling these particular tasks and
finishing up its list to give us a
powerful summary. As we're in this
environment, we can stay within VS Code
or open up Cloud Code in its own
dedicated terminal instance. That's
completely up to you as you're working
in this application. Once it's done, we
can see a very detailed path for what's
happening here. Not only can I read each
of these step by step, I can even ask
Claude to write this to a file, but I'm
seeing in quite a bit of detail what's
happening on the front end with some
JavaScript. what happens once that
reaches my backend. What the retrieval
augmented generation system is doing.
How I'm generating a response. Finally,
how I'm searching through my vector
database, how I'm filtering what's
necessary, getting a response back, and
then finally sending that to the user.
There's a lot that's going on in this
application, and I can use Claude to
dive deeper into any of those pieces.
But let's just say I learn best from
visualizations. So let's ask Claude to
draw a diagram that illustrates this
flow. We can ask Claude to draw diagrams
for web visualizations. We can ask for
ASI art. But let's see what Claude comes
up with with its own intelligence and
knowledge of how the application works.
So let's see what Claude code has come
up with. We've got a really nice diagram
here showing us the step-by-step
process. So it can't create these visual
diagrams. We could always ask it to use
something like D3JS or Recharts if we
want something like a web application.
But we can see right here we've got a
really nice diagram from the front end
making a request to the back end calling
the necessary functions generating the
response necessary if there's any
history involved talking directly to the
large language model with our system
prompts and our tools and a query
figuring out where to go next. searching
through our vector database using
Chromma DB, getting back results,
formatting that, sending it to the model
to produce a final response. There's
quite a bit of detail that goes into
this. And if we want, we can even
augment Claude with additional tools for
generating the visualizations that we
want, but out of the box, just getting
this information quickly and efficiently
is going to help us get up to speed with
this codebase in a fraction of time that
we used to spend. So with that in mind,
let's ask a very simple question. How do
I run this application?
You might be in a situation where
there's a new technology here, a new
idea. Very simply, it's nice to just
know how to get up and running. I can
see here my API documentation, my web
interface, and if there are any
environment variables I need, I'm good
to go. Now that you've got an idea of
how to just start talking to Claude
Code, let's talk a little bit about some
of the more powerful features with Cloud
Code. When you start working with an
application in cloud code, one of the
first things we recommend you do is run
a command called slashinit. You can see
here in cloud code when I add this
slash, we have a list of many built-in
commands that I can use. /nit allows me
to initialize a claude MD file with the
codebase documentation. The claude MD
file is missionritical for introducing
memory for claude code so that it knows
how best to work in your codebase. The
Claude MD file is very useful for
specifying how you want things to be
run. This could be your tests. This
could be your linting and any long-term
memory that you want Claude to have each
time you're working with cloud code for
this particular project. Instead of
making this from scratch, slashinit is
going to analyze the codebase to figure
out at a high level what it should know
about each time you're working with this
application. There are three different
cla MD files that you can make like the
one generated with /nit all the way here
on the left. This cla MD file lives in
your application. You can have many of
them in nested subfolders but this is
shared with other engineers and
committed to your version control.
Another option is if you have personal
instructions and customizations, things
specific for your editing environment
and terminal environment, you can put
that in a claude.local.md
file. This is git ignored and not shared
with other engineers. Finally, in your
home directory in thecloud folder, you
can add a cla and you can think of this
like a global claude MD for all projects
on your machine. This is helpful if you
want Claude to follow instructions
across a wide range of projects that you
build with Claude Code.
We can go ahead and allow Claude Code to
find different files so that it knows
how best to create this Claude MD file.
This Claude MD file is meant to be added
to your current git project and shared
with other team members. As more
individuals work on the codebase, they
can add to this Claude MD file. And you
can even nest Claude MD files in
subdirectories if you need more specific
instructions for things like the backend
or front end or our docs that we have
here. What's really nice about using a
tool like Claude Code with Visual Studio
Code is that as I see changes to files,
I can see those visually in my editor.
And anytime that I am using a tool in
Claude Code, it's going to ask me for
permissions. This missionritical human
in the loop is really important when you
get up and running. And if you don't
need Claude to ask you every single
time, you can always use this second
option. We'll go ahead and auto accept
those edits. and we'll see that a cloud
MD file has been created for us. To give
you a quick walkthrough, we can see it's
given us a project overview, key
technologies, an architectural overview,
a nice little diagram here, some core
components, and much more. If we want
things to change to this particular
cloud MD, we can easily do so. As it
continues searching the codebase, it
makes additional edits here to my Claude
MD and gives me a summary of what's been
done. When I'm using a tool like Claude
Code in VS Code, I have the ability to
specify which file I'm in and even get
information about particular lines. To
set this up, I'm going to use the / IDE
command. And I can see right here that
I'm connected with Visual Studio Code.
Now that I'm in Visual Studio Code, we
can see right here that the second that
I visit a file, it's tagged right here
for what's going on. This gives Clog
Code the right context for which file
I'm in. And if there are questions I
have about that file, it makes it easier
for Claude code to identify that. If I
ever want to make any changes to my
Claude MD file, I can manually write
that if I'd like or I can use a handy
command to go ahead and use this pound
key and directly add to memory. So I'm
just going to say here always use UV to
run the server. Do not use pip directly.
This is a package manager in the Python
ecosystem and I want to make sure that
Claude doesn't get confused. When I use
this shortcut, we can see there are
different places where this memory can
be saved. We mentioned there is the
project memory that is included in git
for everyone on your team to use. We
have local memory that is git ignored
but just useful for you as the developer
and then user memory that is applicable
to all projects you use with cloud code.
For this one, I'll just go ahead and
update the project memory. I can see
here I've made that change. And if I
look in my claw MD, I'll see right here
I have some mentions to using UV to make
sure that I'm doing that correctly. If I
want to be more specific, I can also say
make sure to use UV to manage all
dependencies. I'll add this to my cloud
MD and we'll see right here that it's
been added. If I take a quick look at
this particular file, we can see any
mention of dependencies now includes UV.
We spoke a little bit about some of the
commands that are built into cloud code
like slashit. There are a couple other
useful ones that I want to showcase
here. And in fact, we're going to see
later on in this course. We can even
make our own. One of the first ones I
want to walk you through is /help. This
shows me right off the bat a quick
description of all the commands and a
quick summary. This is useful as you're
getting up to speed with cloud code. The
next one I want to showcase is a command
called slashclear. What this allows you
to do is clear the conversation history
and start from scratch. This is very
helpful as you shift gears and build new
features. This allows you to clear the
context window and start fresh. If you
want to continue the conversation, have
a smaller context window, but still have
a summary of what's been done. We also
have this command compact that allows
you to clear the history but keep a
summary so that you can build off with
Claude having an idea of what was done
before. One more useful command is the
escape key that allows you to get out of
whatever command you're in. So if I'm
going and trying to do something like
compact and I want to stop that process,
I can always press escape. If I start a
process with clawed code to explain what
is in the codebase. If I want to stop
that process, escape will allow me to
interrupt and continue onwards. So don't
feel like you have to wait for cloud
code if you're not getting what you
need. In the next lesson, we'll start
using cloud code to build features, add
to files, modify changes, and make sure
we're doing the right thing along the
way. Before we hop off, one last useful
piece with cloud code is its ability to
work with Git. So, I've made some small
changes to this application and I want
to add and commit these changes. Instead
of me manually have to write the git
commands, write a descriptive commit
message, we're going to actually have
Cloud Code do that work for us. And
what's really nice is Cloud Code's
ability to add and commit the necessary
commands. I'll go ahead and add this
particular file. not only commit, but
you can see here I've got this really
nice descriptive commit message that's
incredibly useful as we start asking
Cloud Code about historical changes with
Git and when we push this to GitHub and
other people are reading the changes we
make. So we'll add in commit and the
next lesson we'll use cloud code to
start writing lots of things for
Loading video analysis...