Every blog, shop, and docs site does this quietly: you type a title, and somewhere a function turns it into the tidy string you see in the address bar. "The CSS Box Model, Explained!" becomes /blog/the-css-box-model-explained. That readable tail is called a slug, and building a good one is a deceptively nice little engineering problem. I built one that runs entirely in the browser, no libraries, and I want to walk through it because almost every step taught me something.
You can play with the live version here: https://dev48v.infy.uk/solve/day26-slug.html
What a slug actually has to be
Three things. Safe: only characters that survive a URL untouched, so no %20 or %C3%A9 gremlins. Legible: a human and a search engine can read the topic straight from the URL. Stable: once it's published, it's the permanent handle for that page.
The whole job is a short pipeline of string transforms, and the order matters more than any single step.
