String To Slug

1/**
2 * Converts a string to a slug.
3 * Replaces non-word characters and underscores with spaces,
4 * splits the string into an array of words, and joins them with hyphens.
5 * Finally, converts the resulting string to lowercase.
6 *
7 * @param string - The string to convert to a slug, such as 'This is a Header!'.
8 * @returns The slugified string, such as this-is-a-header.
9 */
10export function stringToSlug(string: string) {
11	return string
12		.toString()
13		.replace(/[\W_]+/g, ' ')
14		.split(' ')
15		.join('-')
16		.toLowerCase();
17}

1import { stringToSlug } from '@/lib/utils';
2
3export default function SomeComponent(){
4	const headline = "This function is awesome!"
5	return (
6		<h1 id={stringToSlug(headline)}>{headline}</h1>
7		// Will result in: <h1 id="this-function-is-awesome">This function is awesome!</h1>
8		// So you can use it as a Link Anchor {YOUR_URL}.com/#this-function-is-awesome
9	)
10}