// Referens
Ordlista
Begrepp inom Next.js, React och webbutveckling, förklarade på svenska.
A/B-test
AffärsnyttaEn metod för att jämföra två versioner av en sida eller funktion för att avgöra vilken som presterar bättre.
API
WebbEtt gränssnitt som låter olika system prata med varandra, till exempel när din sajt hämtar data från en server.
App Router
Next.jsNext.js nyare routingsystem baserat på mappen app/, med stöd för server components, delade layouter och streaming.
Async/await
JavaScriptSyntax för att skriva asynkron JavaScript-kod på ett linjärt sätt, utan nästlade callbacks eller kedjade promises.
Autentisering
Next.jsProcessen att verifiera vem en användare är, typiskt via inloggning med e-post och lösenord, eller via en tredjepartstjänst.
Bildoptimering
Next.jsAtt leverera bilder i rätt format, storlek och kvalitet för att minska laddningstid utan att offra visuell kvalitet.
Bounce rate
AffärsnyttaAndelen besökare som lämnar en sida utan att interagera vidare, till exempel utan att klicka vidare till en annan sida.
Bundler
JavaScriptEtt verktyg som väver ihop projektets många filer till färre, optimerade paket som webbläsaren laddar effektivt. Next.js sköter detta åt dig.
Cache
WebbMellanlagring av data eller färdiga sidor så att de inte behöver beräknas på nytt vid varje förfrågan. Centralt för prestanda i Next.js.
CMS
WebbContent Management System — ett administrationsgränssnitt för att skapa och redigera webbinnehåll utan att röra koden.
Core Web Vitals
WebbGoogles mått på upplevd prestanda: laddningstid, interaktivitet och visuell stabilitet. Påverkar både användarupplevelse och ranking.
CTA
AffärsnyttaCall to Action — ett tydligt uppmaningselement som guidar besökaren att göra något specifikt, till exempel 'Kom igång' eller 'Boka demo'.
Deployment
WebbProcessen att publicera en ny version av en applikation så att den är tillgänglig för riktiga användare.
DOM
WebbWebbläsarens trädstruktur över alla element på en sida. JavaScript ändrar det som visas genom att uppdatera DOM.
Edge runtime
Next.jsEn lättviktsmiljö för serverfunktioner som körs i nätverkets kant, nära besökaren, i stället för i ett centralt datacenter.
Error boundary
Next.jsEn React-mekanism som fångar fel i sin komponentträd och visar ett reservgränssnitt i stället för att krascha hela sidan.
fetch
JavaScriptWebbläsarens och Node.js inbyggda funktion för att göra HTTP-förfrågningar, returnerar ett promise med svaret.
generateStaticParams
Next.jsEn Next.js-funktion som talar om vilka dynamiska URL-parametrar som ska pre-renderas vid byggtillfället.
Headless CMS
WebbEtt innehållssystem som hanterar text och bilder men lämnar presentationen till ett separat frontend som Next.js. Redaktörer uppdaterar innehåll utan att röra koden.
Hosting
WebbTjänsten som tillhandahåller servrar och infrastruktur där en webbapplikation körs och är tillgänglig på internet.
Hydration
Next.jsSteget där React kopplar interaktivitet till den HTML som servern redan skickat. Innan hydration syns sidan men knappar och formulär svarar inte än.
Statiska sidor som byggs om i bakgrunden med jämna mellanrum, så att innehållet kan uppdateras utan en helt ny build.
Internationalisering (i18n)
Next.jsProcessen att förbereda och anpassa en applikation för flera språk och regioner.
Klientrendering (CSR)
Next.jsWebbläsaren får en näst intill tom sida och bygger innehållet med JavaScript efter laddning. Vanligt i traditionella React-appar utan ramverk.
Ett formulärelement vars värde styrs av React-state, så att React alltid vet och kontrollerar vad fältet innehåller.
Konvertering
AffärsnyttaNär en besökare genomför en önskad handling, till exempel gör ett köp, anmäler sig till ett nyhetsbrev eller fyller i ett formulär.
Landningssida
AffärsnyttaEn sida skapad för ett specifikt syfte, ofta kopplad till en annonskampanj, med fokus på att driva en enda konvertering.
Lazy loading
Next.jsTeknik som skjuter upp laddning av resurser till dess de faktiskt behövs, till exempel bilder utanför vykorgen eller sällan använda komponenter.
Lead
AffärsnyttaEn potentiell kund som visat intresse, till exempel genom att lämna kontaktuppgifter eller ladda ner en resurs.
Linting
JavaScriptAutomatisk analys av kod för att hitta fel, potentiella buggar och stilavvikelser utan att köra koden.
Loading UI
Next.jsPlatshållarvy som visas medan en sida eller komponent hämtar data, implementerat via React Suspense i Next.js App Router.
LocalStorage
WebbWebbläsarens inbyggda lagring för nyckel-värde-data som finns kvar även när fliken stängs, men aldrig skickas till servern.
Memoization
ReactTeknik som cachar resultatet av en dyr beräkning och returnerar det cachade resultatet om indata inte ändrats.
Metadata API
Next.jsNext.js inbyggda system för att definiera sidspecifik metadata som title, description och Open Graph-taggar.
Middleware
Next.jsKod som körs innan en förfrågan når sidan, till exempel för omdirigeringar, språkval eller behörighetskontroll.
Miljövariabler
Next.jsKonfigurationsvärden som hålls utanför koden, till exempel API-nycklar och databasadresser, och kan skilja sig mellan miljöer.
Node.js
JavaScriptEn JavaScript-runtime som kör JavaScript utanför webbläsaren, på servern. Grunden som Next.js och de flesta moderna webbutvecklingsverktyg bygger på.
Organisk trafik
AffärsnyttaBesökare som hittar sajten via sökmotorer som Google, utan att du betalat för annonsering.
Pages Router
Next.jsNext.js äldre routingsystem baserat på mappen pages/. Fungerar fortfarande, men nya projekt bör välja App Router.
Prestandaoptimering
Next.jsArbetet med att göra en applikation snabbare, mer responsiv och mer resurseffektiv för slutanvändaren.
Promise
JavaScriptEtt JavaScript-objekt som representerar ett asynkront operations slutresultat — antingen ett värde eller ett fel — som inte är tillgängligt ännu.
Ref
ReactEn behållare i React som håller ett muterbart värde utan att trigga omrendering, ofta används för att komma åt DOM-element direkt.
Rendering
Next.jsProcessen där kod och data omvandlas till färdig HTML som webbläsaren kan visa. När och var renderingen sker påverkar både prestanda och SEO.
Responsiv design
WebbEn designstrategi där sidans layout anpassas automatiskt till skärmens storlek, oavsett om besökaren använder mobil, surfplatta eller dator.
REST
JavaScriptRepresentational State Transfer — ett arkitekturmönster för API:er som använder HTTP-metoder och URL:er för att representera resurser och operationer.
Route handler
Next.jsEn funktion i App Router som svarar på HTTP-förfrågningar, till exempel ett API-anrop. Motsvarar det som tidigare hette API-routes.
SEO
WebbSökmotoroptimering, arbetet med att göra en sajt lätt för sökmotorer att förstå och ranka. Renderingsmodellen i Next.js påverkar detta direkt.
Server action
Next.jsEn funktion som körs på servern men anropas direkt från en komponent, ofta för att hantera formulär och dataändringar utan ett separat API.
Server Components (RSC)
Next.jsReact-komponenter som körs enbart på servern och aldrig skickar sin JavaScript till webbläsaren. Standard i App Router och håller nere mängden klientkod.
Server-rendering (SSR)
Next.jsSidan byggs på servern vid varje förfrågan och skickas som färdig HTML. Passar innehåll som ändras ofta och behöver synas för sökmotorer.
Session
WebbEn serverlagrad identitet kopplad till en inloggad användare, vanligtvis refererad via en cookie med ett sessions-id.
Statisk generering (SSG)
Next.jsSidorna byggs en gång vid byggtillfället och serveras som färdiga filer. Mycket snabbt och passar innehåll som sällan ändras.
Streaming
Next.jsServern skickar delar av sidan efterhand som de blir klara, så att besökaren ser innehåll snabbare i stället för att vänta på hela sidan.
Suspense
ReactEn React-mekanism som visar ett reservinnehåll medan ett barn väntar på asynkrona data eller laddning.
Teknisk skuld
WebbDen extra arbete som uppstår i framtiden på grund av genvägar eller kompromisser i kod och arkitektur som tagits idag.
Tillgänglighet
WebbPrincipen och praktiken att bygga webbplatser som fungerar för alla, inklusive personer med funktionsvariationer som använder hjälpmedel.
Transpilering
JavaScriptAtt översätta nyare eller annan kod till en variant som fler webbläsare förstår, till exempel TypeScript till vanlig JavaScript.
Tree shaking
JavaScriptBundlerns process att ta bort oanvänd kod från det slutliga paketet, baserat på vilka exports som faktiskt importeras.
TypeScript
JavaScriptEtt tillägg till JavaScript som inför typer, vilket fångar fel tidigare och gör större kodbaser lättare att underhålla.
UI
WebbUser Interface — de visuella element användaren interagerar med: knappar, formulär, menyer, typografi och layout.
useEffect
ReactEn React-hook för att köra kod som svar på att en komponent mountas, uppdateras eller avmonteras, till exempel för att hämta data eller prenumerera på events.
UX
WebbUser Experience — upplevelsen en person har när de använder en produkt, inklusive hur intuitiv, effektiv och tillfredsställande den är.
Webbapplikation
WebbEn applikation som körs i webbläsaren och ofta har inloggning, sparad data och funktioner som påminner om ett vanligt program. Skiljer sig från en enkel innehållssajt.