Documentation · Chapter 05

Workshop: a simple,
consistent interface.

Reorganize reading-list without changing its behavior. Every improvement should be independently verifiable.

We improve reading-list without changing its HTTP logic or temporary session storage.

OBJECTIVE

Give every Books page the same identity.

  1. Create head, header, footer, and book-form partials.
  2. Store pages under src/views/books.
  3. Create public/css/app.css and public/img/logo.svg.
  4. Add clear keyboard navigation and metadata.
  5. Customize 404.php and default.php.

Shared header

src/views/partials/header.php

phpaml — zsh
<header>
    <nav class="container" aria-label="Main navigation">
        <a class="brand" href="/books">
            <img src="/img/logo.svg" width="32" height="32" alt="">
            <span>Reading List</span>
        </a>
        <a href="/books">Books</a>
        <a href="/books/create">Add</a>
        <a href="/about">About</a>
    </nav>
</header>

Shared footer

src/views/partials/footer.php

phpaml — zsh
<footer>
    <div class="container">
        <small>&copy; <?= date('Y') ?> Reading List</small>
    </div>
</footer>

Safe migration order

  1. Create partials without removing old HTML.
  2. Migrate only books/index.php and reload /books.
  3. Migrate create.php, then test a valid and invalid addition.
  4. Migrate edit.php, then test update and deletion.
  5. Add CSS and images after confirming the HTML.

This progression avoids changing structure, style, and behavior simultaneously. If an error appears, the last small step probably identifies its cause.

Final checklist

Every page has one unique h1✓
Tab reaches every control✓
Errors remain near fields✓
Values are escaped✓
An unknown URL shows 404✓
No src file is public✓
phpaml — zsh
aml test
# puis vérifier /books, /books/create et une URL inconnue

SUMMARY

What to remember

  • partial() explicitly composes classic views.
  • src/views stays private; public is served to the browser.
  • Semantic HTML comes before CSS decoration.
  • JavaScript enhances but does not replace the server.
  • Public error pages expose no internal detail.