Summary  
This chapter explains how to configure and connect a PostgreSQL database to your project by setting environment variables and installing the required dependency.  

General domain of usage  
Web application backends

För detta projekt kommer vi att använda Postgres-databasen. Låt oss se hur den konfigureras på Vercel.

## Instruktioner
1. Klicka på "Fortsätt till Dashboard";
2. Välj "Storage" från huvudflikarna;
3. Skapa "Postgres (Serverless SQL)";
4. Acceptera villkoren;
5. Namnge databasen och klicka på "Skapa och fortsätt";
6. Klicka på knappen "Connect".

Efter att ha skapat och anslutit databasen måste vi konfigurera den och fylla den med data att arbeta med.

## Instruktioner
1. Besök fliken ".env.local";
2. Kontrollera att du har all nödvändig data:
   - `POSTGRES_URL`;
   - `POSTGRES_PRISMA_URL`;
   - `POSTGRES_URL_NON_POOLING`;
   - `POSTGRES_USER`;
   - `POSTGRES_HOST`;
   - `POSTGRES_PASSWORD`;
   - `POSTGRES_DATABASE`.
3. Kopiera all data och gå till projektet;
4. Hitta filen `.env.example` i projektets rot. Byt namn på den till `.env`;
5. Klistra in den kopierade datan från Vercel;
6. Öppna slutligen terminalen och kör `npm i @vercel/postgres` för att installera Vercel Postgres.

Det sista steget som återstår är att fylla databasen med data. Vi fokuserar på detta i nästa kapitel.

Lär dig att bygga moderna, högpresterande webbapplikationer med Next.js. Sätt upp projekt med strukturerade layouter, styling och routing för smidig navigering. Hämta och visa data effektivt samtidigt som rendering och prestanda optimeras. Implementera avancerade funktioner som paginering, CRUD-operationer och global sökning för dynamiska webbappar. Distribuera dina Next.js-projekt, anslut dem till databaser och lägg till autentisering för att skydda användardata.

Vi diskuterar vad du behöver kunna innan du börjar med Next.js-ramverket, vad du kan förvänta dig av denna kurs och vad du kommer att bygga.

Vi kommer att konfigurera projektet, undersöka olika sätt att lägga till styling i vår app och behandla visuella aspekter såsom bilder, typsnitt, sidor och layouter.

Lär dig att enkelt skapa och hantera en ny vy för din applikation samt navigera mellan alla sidor smidigt med ett inbyggt routingsystem.

Distribuera Next.js-appen med hjälp av GitHub- och Vercel-konton. Upprätta dessutom en databas för att förse appen med nödvändig data.

Överväg hur data kan erhållas och presenteras för användaren på ett tydligt och effektivt sätt.

Utforska hur moderna webbtekniker som paginering, CRUD-operationer, global sökning, formulärvalidering och mer implementeras.

Implementering av autentisering i Next.js.

Konfigurera en Projektdatabas

Instruktioner

Instruktioner

I praktiken