My Learning Journey

Five weeks. Five checkpoints. One portfolio.

Week 1 · HTML Checkpoint 1.1

Laying the Foundation

Built the HTML skeleton — semantic elements, proper heading hierarchy, nav, main, footer. First time I realised how much structure matters before a single line of CSS.

HTML5 Semantic markup Accessibility Git
View details →
Week 2 · CSS Checkpoint 1.2

Style & Responsiveness

Added the dark theme, CSS custom properties, flexbox layouts. The mobile-first approach broke my brain at first — but media queries finally clicked.

CSS3 Flexbox CSS Grid Custom Properties Media Queries
View details →
Week 3 · JavaScript Checkpoint 1.3

Making Things Move

Event listeners, DOM manipulation, the typing hero animation. Spent a whole evening debugging why my scroll reveal wasn't firing — turned out I had the threshold backwards.

JavaScript DOM API IntersectionObserver Event Listeners
View details →
Week 4 · API Checkpoint 1.4

Connecting to the World

Fetched live data from the Open Library API — async/await, error handling, dynamic card rendering. The bookshelf page came alive the moment the covers loaded.

Fetch API async/await JSON Open Library Error Handling
View details →
Week 5 · Accessibility Final Polish

Building for Everyone

Lighthouse audit, ARIA labels, keyboard navigation, focus rings, colour contrast fixes. Went from a Lighthouse score of 71 to 96 — before/after screenshots included.

ARIA WCAG 2.1 Lighthouse Focus Management Colour Contrast
View details →