Distribuera till Vercel och Netlify

Vercel har skapats av teamet bakom Next.js, vilket gör plattformen till den bäst optimerade för Next.js-applikationer.

Plattformen erbjuder en enkel distributionsupplevelse med funktioner som omedelbara statiska distributioner, serverlösa funktioner och automatisk skalning.

• Djup Next.js-integration.
• Snabbt globalt CDN.
• Automatiska SSL-certifikat.

Ni kan distribuera ert Next.js-projekt till Vercel direkt från terminalen med Vercel CLI. Installera först verktyget globalt:

npm install -g vercel

Gå sedan till projektets katalog och kör helt enkelt vercel. Verktyget guidar er genom konfigurationen, kopplar projektet till ert konto och distribuerar det.

Det vanligaste sättet att distribuera med Vercel är att ansluta ert Git-repositorium (GitHub, GitLab, Bitbucket). När det är anslutet distribuerar Vercel automatiskt varje gång ni skickar ändringar till er huvudgren.

Detta möjliggör Continuous Deployment (CD), automatiserar releaseprocessen och säkerställer att er aktiva webbplats alltid är uppdaterad med er kod.

Netlify är en annan kraftfull serverlös plattform med mycket bra stöd för Next.js-projekt. Den erbjuder en liknande uppsättning funktioner, bland annat kontinuerlig distribution, serverlösa funktioner och ett globalt CDN.

Netlify erbjuder också en användarvänlig instrumentpanel och utmärkta verktyg för att hantera era webbprojekt.

• Kraftfullt byggsystem.
• Integrerat med Git.
• Serverlösa funktioner tillgängliga.

Precis som Vercel har Netlify ett eget CLI-verktyg. Installera det globalt för att komma igång:

npm install -g netlify-cli

Kör netlify init från projektets katalog för att ansluta projektet till Netlify, eller netlify deploy för att distribuera en specifik version. Netlify identifierar automatiskt er Next.js-konfiguration.

Er Next.js-app kan använda miljövariabler (t.ex. API-nycklar). Det är mycket viktigt att inte hårdkoda dessa i er offentliga kod.

Både Vercel och Netlify erbjuder säkra sätt att hantera miljövariabler direkt i sina instrumentpaneler. Ni lägger till dem en gång, och därefter är de tillgängliga för applikationen under bygg- och körningsfaserna.

• Lagra känsliga uppgifter säkert.
• Använd olika värden i olika miljöer (t.ex. utveckling och produktion).

Efter distributionen får appen en tillfällig URL (t.ex. your-project.vercel.app). Ni vill förmodligen använda er egen domän (t.ex. www.mycoolapp.com).

Både Vercel och Netlify gör det enkelt att lägga till anpassade domäner via sina instrumentpaneler. De utfärdar och förnyar också automatiskt kostnadsfria SSL-certifikat (HTTPS) för era domäner, vilket säkerställer säkra anslutningar.

Den verkliga styrkan hos dessa plattformar kommer med Continuous Deployment (CD). När allt är konfigurerat hämtar Vercel eller Netlify automatiskt följande varje gång ni skickar kod till er anslutna Git-gren (t.ex. main):

1. Den senaste koden hämtas.
2. Next.js-applikationen byggs.
3. Den nya versionen distribueras.
4. CDN-cachen ogiltigförklaras.

Detta arbetsflöde sparar tid och minskar antalet fel, så att er aktiva webbplats alltid är aktuell.

I den här lektionen gick vi igenom grunderna i att distribuera era Next.js-applikationer. Vi lärde oss att plattformar som Vercel och Netlify förenklar processen genom att erbjuda serverlös infrastruktur, kontinuerlig distribution samt enkel hantering av domäner och miljövariabler.

Nu har ni verktygen för att ta era Next.js-projekt från lokal utveckling till en aktiv, produktionsklar webbplats!