Unit 09 · lesson

Trace One Page Through the Entire Jekyll Pipeline

This is the technical core of the final defense.

Pick one real project detail page.

Trace it from source all the way to the public browser.

1. Content source

Example:

_projects/line-follower.md

Identify:

  • front matter;
  • Markdown body;
  • data fields;
  • selected/default layout.

2. Jekyll content model

Explain how the projects collection is configured and exposed as site.projects.

3. Liquid/rendering

Identify at least one Liquid expression or loop that uses the document.

4. Conversion

Show where Markdown becomes HTML.

5. Layout composition

Trace:

project content
→ project layout
→ default layout

if that matches your architecture.

6. Assets

Show how CSS and one image URL become part of the final page.

7. Destination

Find the generated page under _site and its public route/permalink.

8. Git/deployment

Identify:

  • source commit;
  • pushed repository branch;
  • Pages build/deploy path;
  • public URL.

Final trace format

Your evidence can be a D2 diagram, annotated diagram, or another clear architecture artifact, but every arrow must name a transformation or responsibility.

No unlabeled spaghetti arrows.

Checkpoint

Another student should be able to use your trace to answer:

If the project title is wrong in the public browser, where would I inspect first and why?