nextjs

Aloitus nextjs kanssa

Yleiskatsaus

Next.js on React-kehys tuotantoon. Se tarjoaa hybridiä staattista ja palvelinrenderöintiä, TypeScript-tuen, älykkään niputtamisen, reittien esihakujen ja paljon muuta ilman konfiguraatiota.

Aloittaminen

Repositorion kloonaamisen jälkeen seuraa näitä vaiheita:

1

Asenna Riippuvuudet

npm install
2

Käynnistä Kehityspalvelin

npm run dev
3

Käännä Tuotantoa Varten

npm run build && npm start

Projektirakenne

├── app/                # App Router (Next.js 13+)
│   ├── layout.js       # Juuriasettelu
│   ├── page.js         # Kotisivu
│   └── [routes]/       # Dynaamiset reitit
├── pages/              # Pages Router (vaihtoehto)
│   ├── api/            # API-reitit
│   └── _app.js         # App-komponentti
├── public/             # Staattiset tiedostot
├── components/         # React-komponentit
├── styles/             # CSS-tiedostot
├── next.config.js      # Next.js-konfiguraatio
└── package.json        # Riippuvuudet ja skriptit
        

Keskeiset Käsitteet

Tiedostopohjainen Reititys

Luo sivuja lisäämällä tiedostoja app/ tai pages/ hakemistoon.

Palvelinkomponentit

Komponentit renderöidään palvelimella oletuksena. Käytä 'use client' asiakaskomponenteille.

API-reitit

Luo backend API-päätepisteitä app/api/ tai pages/api/ hakemistoon.

Hyödyllisiä Komentoja

npm run dev Käynnistä kehityspalvelin Fast Refresh -tuella
npm run build Luo optimoitu tuotantokäännös
npm start Käynnistä tuotantopalvelin
Lisätietoja löytyy virallisesta Next.js Dokumentaatiosta.