När du genererar URL:er från titlar kan titeln vanligtvis inte användas rakt av – mellanslag, frågetecken och andra specialtecken hör inte hemma i URL-sluggar. Då kommer en slugify-funktion väl till pass.

Jag stötte nyligen på uppgiften att skapa ett kontaktformulär med input-rader i en kolumn och en textarea och submit-knapp i den andra kolumnen. Den lilla utmaningen var att få textarean att fylla det tillgängliga utrymmet ovanför submit-knappen på ett responsivt sätt, så att textarean fortsätter att fylla det tillgängliga utrymmet oavsett antalet input-rader i kolumnen till vänster.

Här är designen, där du kan välja antalet input-rader:

Tänk dig den här arrayen med namn:

const names = [
	"Filip",
	"Anna",
	"Jennifer",
	"Anna",
	"Robert",
	"Emma",
	"Filip",
	"Anna",
]

I arrayen förekommer Filip två gånger och Anna tre gånger. Tänk om vi vill filtrera bort dubbletterna och få en array med bara unika namn?

Jag ställs ofta inför uppgiften att centrera något. Antingen horisontellt eller vertikalt, och ofta på båda ledderna samtidigt. När inte flex och grid fanns i CSS kunde det vara ganska bökigt att få till vertikal och horisontell centrering. Nu finns det smidiga lösningar!

Vi utgår från ett span-element i en div:

Använd den här räknaren om du vill räkna ord, tecken eller en sekvens av tecken i en text!

Number of words: 0

Number of characters: 0

Färger på webben kan definieras på många olika sätt. Det finns 140 färgnamn såsom till exempel green, goldenrod och navy. Utöver det finns dessa fyra standarder för färgvärden: HEX, RGB, RGBA och HSL. Jag går igenom dessa en i taget i det här inlägget och visar också hur man kan generera slumpmässiga färgvärden för respektive standard med React.

Hur många decimaler av pi kan du? Här kan du testa dig och försöka bli bättre! Klicka på rutan nedan och skriv första decimalen för att börja. Om du vill ha hjälp kan du klicka på "Visa facit"-knappen där du även ser hur långt du har kommit genom att de korrekt angivna decimalerna har grön bakgrund.

Nu ska vi se hur vi gör operationer på oföränderliga objekt i JavaScript, precis som vi gjorde för arrayer i det här inlägget.

Här utgår vi från ett objekt med en person:

const person = {
	name: "Filip",
	age: 26,
	city: "Uppsala",
}

Som nämnt många gånger förut försöker jag alltid hålla mina variabler oföränderliga när jag utvecklar. Nu ska vi kika närmare på hur vi åstadkommer oföränderliga arrayer i JavaScript när vi lägger till element, byter ut element eller tar bort element. Vi utgår från en array med fåglar:

const birds = ["Talgoxe", "Blåmes", "Tallbit", "Skogsduva"]

Låt säga att vi har den här arrayen med städer:

const cities = ["Uppsala", "Stockholm", "Lycksele", "Lund"]

Och låt säga att vi vill skriva ut städerna i arrayen i en mening i stil med denna:

Uppsala, Stockholm, Lycksele och Lund är 4 fina städer i Sverige.

Hur?!