The files in your project
Your AI just created fourteen files. You open the project folder and have no idea which ones matter, or which you should never touch.
This answers: What are the files in my Next.js project? No coding needed. 3 quick decisions.
- Reading code
- Keys and secrets
Step 1 of 3
You want to change the headline on your pricing page. Which file do you open?
app/ page.tsx pricing/ page.tsx api/ checkout/route.tscomponents/ buy-button.tsxnode_modules/.env.localpackage.jsonWhat are the files in my Next.js project?
In Next.js, folders inside app/ become your site's addresses, so app/pricing/page.tsx is the /pricing page. components/ holds reusable pieces. files hold and must stay out of git. package.json lists the packages you use; node_modules is the downloaded code, replaced on every install, so never edit it.
Breaks at GitHub: Secrets file pushed with the code
Why AI tools write this bug
AI tools create files fast without explaining them, and sometimes edit node_modules or forget to keep files out of git.
How to fix it
- Find pages by their URL under app/.
- Check .gitignore lists files and node_modules.
- Change packages through package.json, never node_modules.
- Ask your AI for a map of the project when it adds files.
Check your own app
Paste this into Lovable, Cursor or Claude Code:
Without changing anything, give me a map of this project: what each top-level folder and file is for, which file each page of the site comes from, and where secrets are kept. Check that .gitignore excludes every .env file and node_modules, and tell me if any secret file is already tracked by git.
Common questions
- Should I commit package-lock.json?
- Yes. It records the exact versions installed, so your hosting service installs the same code you tested.