Lab: The Service Bay

Listen up. You’ve read the manuals, you’ve seen the specs, but that doesn’t mean you know how to turn a wrench. Theory is nice, but in this shop, we judge you by what you can build.

I’ve got three jobs lined up for you. Start with the routine maintenance. if you can handle that, maybe I’ll let you touch the custom fabrication work. And if you’re really good? well, I’ve got a chassis that needs a complete overhaul.

Pop the hood. Let’s see what you’ve got.

Tier 1: Routine Maintenance (The Tune-Up)

We’ve got a stock sedan coming in. The owner just wants a digital dashboard installed. Nothing fancy—just needs to show the RPM and Fuel levels without catching fire.

The Specs

Initialize the Shop: Create a new Express server. Install ejs.
Configure the Engine: Set EJS as your view engine. Point it to a views folder.
The Dashboard: Create a dashboard.ejs file.
Fuel Injection: In your route, pass the following data object:
```
{
  rpm: 3500,
  fuel: 75,
  status: "Idling"
}
```
Gauges: Render these values on the page. Use <h1> for the status and <h3> for the others.

Make sure you’re using Escaped Output <%= %>. If someone tries to inject bad fuel (malicious script) into that status variable, I don’t want my shop blowing up.

🤖 AI Apprentice Prompt

Stuck on the lift? Ask the AI to help you troubleshoot your pathing.

“My server is crashing and says it can’t find the views directory. Inspect my server.js and explain how path.join fixes this issue.”

Tier 2: Custom Fabrication (The Body Kit)

Alright, that was kid stuff. Now we’ve got a client who wants a custom parts list displayed. But here’s the catch—they want it dynamic. If they add a part, it shows up. If the list is empty, it tells them to go shopping.

The Specs

** The Inventory:** Pass this array to your view:

const mods = ["Spoiler", "Rims", "Nitrous", "Tint"];

The Fabrication: Create a parts-list.ejs.
The Loop: Use a Scriptlet <% %> loop to iterate through the mods array and generate an <li> for each item.
The Warning: Add logic inside the loop. If the specific part is “Nitrous”, give that <li> a class of danger (make it red with CSS).
Shop Branding: Create a partial named header.ejs that contains a generic nav bar. Include this partial at the top of your parts list.

🤖 AI Apprentice Prompt

Need to refactor that messy loop?

“Review this forEach loop in my EJS template. Refactor it to use a partial named _part-item.ejs for each list item to clean up the main file.”

Tier 3: The Solo Special (Frame-Off Restoration)

You’re still here? Impressive. Alright, this is the big one. We’re rebuilding the entire chassis. I’m tired of copy-pasting headers and footers into every single file like some amateur. We’re going to use a Master Layout.

The Specs

Upgrade the Tools: Install express-ejs-layouts.
The Blueprint: specificy app.use(expressLayouts) in your server configuration.
The Chassis: Create a layout.ejs file. This is your master frame. It should have the <html>, <head>, and <body> tags.
The Injection: Place your header partial inside the body, followed by the magical <%- body %> tag.
The Assembly: Render your dashboard.ejs from Tier 1 again. But this time, delete the HTML boilerplate from dashboard.ejs. It should only contain the gauges.

If you did it right, the dashboard will appear inside the chassis, with the header automatically applied.

🤖 AI Apprentice Prompt

Layouts refusing to cooperate?

“I installed express-ejs-layouts but my content is rendering below the HTML closing tag. Analyze my middleware order in server.js and explain why the layout engine must be initialized before the routes.”

Final Inspection

Zip up your project folder. Ensure all dependencies are listed in package.json. If I see a node_modules folder in your submission, you’re scrubbing the floors for a week.

Dismissed.