Simple explanation
Welcome to Day 11. Today's lesson is short. But it saves significant time every single session. The problem it solves When you want Claude Code to work on a specific file — most beginners describe it in words. "On the homepage — you know, the main file, the index one — in the hero section at the top..." Claude Code guesses which file you mean. Sometimes it guesses wrong. Or worse — you copy the entire file contents and paste them into your prompt. The prompt becomes enormous. Claude Code gets confused by too much information. The @ mention solves both problems instantly. How @ mentions work Inside any Claude Code prompt — type @ followed by a file name, folder name, or URL. Claude Code reads that file directly. No copy-pasting. No describing. No guessing. The three ways to use @ mentions: @ a specific file @src/pages/index.js Points Claude Code directly at one file. Use when you want to change something specific. @ an entire folder @src/components/ Points Claude Code at every file in that folder. Use when you want to understand the structure or make consistent changes across multiple files. @ a webpage @https://example.com Fetches the live content of any webpage and reads it. Use when you want Claude Code to match the style of an existing page — or analyse a competitor's site.
What to do
Practical examples Instead of: "On my homepage in the hero section change the headline to say..." Write: "In @src/pages/index.js change the hero headline to say..." Instead of: "Look at all my page components and make sure the buttons are consistent..." Write: "Look at @src/components/ and make sure all buttons use the same style." Instead of: "I want my contact page to look similar to my about page..." Write: "Make @src/pages/contact.js match the layout style of @src/pages/about.js" Today's practical task 1. Open Claude Code. 2. Use @ to point at your homepage file directly. 3. Ask Claude Code to add one new section to it — using the @ mention instead of describing the file. 4. Then use @ to point at a second page. 5. Ask Claude Code to make one element consistent between both pages. Notice how much faster and more accurate Claude Code is when you point directly instead of describing. The session stays focused. Claude Code touches exactly the right files. Nothing extra gets changed. One tip: if you do not know the exact file path — type @ and press Tab. Claude Code will show you a list of files to choose from.
Copy-paste prompt
Look at @[your-homepage-file-path] and @[your-about-page-file-path]. Make the button styles consistent across both pages — same size, same color, same font weight. Only change the button styles. Do not touch anything else on either page.
Course note
Key takeaway
Type @ followed by a file path, folder path, or URL to point Claude Code directly at what you want it to read. Pointing is faster and more accurate than describing. Use it in every session from today.