Lay of the Land

You do not need to memorize the whole codebase, but you should know the basic moving parts.

Packages and node_modules

Web apps are built from reusable packages. node_modules is the folder where those packages live after you install them. Think of it as a box of Lego bricks the app depends on.

Environment files

Environment files hold private keys, URLs, and provider settings. Locally, that usually means .env.local. In production, those values live in your hosting and provider dashboards.

Auth and authorization

• authentication answers: who is this user?
• authorization answers: what is this user allowed to access?

This repo uses Clerk for authentication and Convex-backed product access for access decisions.

Database, data fetching, and state

• the database stores product state and product access
• data fetching pulls the current information into the UI
• state is the current UI or product condition the user is looking at

Convex is the app-state backbone in this repo.

Components

Components are reusable pieces of UI. If you have used Figma components, the mental model is similar: one reusable piece, many uses.

Styling

This repo uses Tailwind-style utility classes and shared theme tokens. You do not need to hand-write a full CSS system to make targeted UI changes.

What success looks like

You have enough context when terms like auth, env vars, components, and state stop feeling mysterious and start feeling like labels for familiar pieces of the product.