The challenge
Slugs are Human readable URLs created from a string. They normally identify a resource, while keeping it fairly readable for normal people.
Used normally in GET requests, they are very good for SEO, has they increase the chances of a higher score on page indexing on most search engines.
As part of my work, I sometimes need to create URLs that allow easy readability. I normally use it to create branches on GitHub.
So I decided to build a simple tool that would allow me to generate a slug and made it available online, so I could access it everywhere.
The Solution
A simple javascript tool that will convert the string, making it all lower case, replacing all the spaces by “-” except the start and end ones, and replacing any special characters.
You can find a live demo by clicking on the button bellow
The implementation
You can use the tool by simply adding it to your page, or to your project using CommonJS or AMD module definition.
You use it by simply creating a new instance of Slugifier and optionally passing an object literal with a set of configs. The tool allows for a few options such as:
separator: Defines a different separator (other than “-“);
lowercase: (boolean) Determines if all chars are to be lowercased. Defaults to yes;
truncate: (Number) Truncates the slug at nth char. Sending 0 or NaN will not truncate. Defaults to 0;
symbols: (boolean) Determines if symbols are to be converted. Defaults to yes;
// simplest implementation
var slugifier = new Slugifier();
console.log(slugifier.slug('Some Random String'));
// Output: some-random-string
// Using configs
var slugifier_Max10 = new Slugifier({ separator: "_", truncate: 10 });
console.log(slugifier_Max10.slug('Some Random String'));
// Output: some_rando
You can take a look at the code on my GitHub page.