Skip to Content
Tutorials

Programming

Programming tutorials for people who want code that actually runs, not code that only looks right. Pick a language, start at the beginning, and don't skip the basics. They are where most problems come from.

0 likes
Make a Button Do Something With addEventListener Level: Beginner

Find the button, attach a listener, change something on the page when it's clicked. Three steps, and two mistakes that make it silently do nothing.

0 likes
Fix a Blank Page When Your HTML File Won't Open Right Level: Beginner

Your HTML file opens blank, shows as text, or downloads instead of rendering. Check the extension, the file:// open path, the doctype and a missing closing tag before you rewrite the page.

0 likes
The CSS Box Model in 15 Minutes Level: Beginner

Measure two boxes with the same declared width, calculate padding and border, and reproduce the 100% width overflow mistake before fixing it.

0 likes
Center Something Without Copy-Pasting Stack Overflow Level: Beginner

Compare text alignment, a centred block and two-axis child placement, then test why centering needs available space.

0 likes
Classes vs IDs: Stop Overusing #id for Styling Level: Beginner

Diagnose an ID rule that defeats a reusable note modifier, then keep the ID for navigation while moving presentation to classes.

0 likes
Change Colors and Fonts Without Touching Every Tag Level: Beginner

Set a shared typography base, trace inherited colours and remove a local override without restyling every paragraph.

0 likes
Read Computed Styles in DevTools Without Guessing Level: Beginner

Trace a reproducible colour and spacing conflict from the rendered result to the winning rule, then verify the repair in the source file.

0 likes
Build a Contact Form With Labels Stuck to Their Inputs Level: Beginner

Build a local form with working labels and a grouped topic choice, then inspect submitted field names without sending a message.

0 likes
Images With alt Text That Isn't Useless Level: Beginner

Choose different text alternatives for informative, decorative and linked images, then inspect their names and broken-image behavior.

0 likes
Links That Open Where You Meant Them To Level: Beginner

Build a three-file local site, resolve paths from nested folders and test fragments and deliberate new-tab navigation.

0 likes
Semantic HTML in 10 Minutes: header, main, nav, footer Level: Beginner

Build a page with named navigation regions and a working skip link, and distinguish page landmarks from an article header.