Come installare e configurare un nuovo progetto Next.js su Ubuntu

Next.js è un framework ben noto per React che ti aiuta a creare siti web veloci e moderni, facile da usare e con funzionalità potenti come il rendering lato server, la creazione di pagine statiche e la costruzione di API.

Se stai cercando di avviare un progetto Next.js sui tuoi sistemi basati su Ubuntu, questa guida ti accompagnerà attraverso il processo passo dopo passo.

Prerequisiti

Prima di iniziare a configurare un progetto Next.js, ci sono alcune cose che dovrai installare sul tuo sistema Linux, tra cui:

  • Node.js: Next.js è costruito su Node.js, quindi devi avere Node.js installato.
  • npm: npm (Node Package Manager) è utilizzato per gestire i pacchetti e le dipendenze del tuo progetto.

Procediamo con il processo di installazione sia per Node.js che per npm.

Passo 1: Installa Node.js e NPM in Linux

Prima di installare qualsiasi nuovo software, è una buona idea aggiornare l’elenco dei pacchetti per assicurarti di installare l’ultima versione del software disponibile nei repository.

sudo apt update

Successivamente, puoi installare Node.js (installa anche npm), ed è meglio installare la versione di Node.js contrassegnata come LTS (Long-Term Support), poiché è la versione più stabile e ampiamente utilizzata.

sudo apt install nodejs

Una volta completata l’installazione, verifica che Node.js sia installato correttamente controllando la sua versione:

node -v
npm -v

Ora hai sia Node.js che npm installati sul tuo sistema.

Passo 2: Installa e Configura il Progetto Next.js

Ora che hai Node.js e npm installati, è tempo di creare un nuovo progetto Next.js. Il modo più semplice per installare Next.js è utilizzare create-next-app, che è un pacchetto ufficiale fornito dal team di Next.js.

sudo npm install -g create-next-app

Ora che create-next-app è installato, puoi creare un nuovo progetto Next.js.

npx create-next-app@latest my-next-app

Qui, my-next-app è il nome della cartella del tuo progetto. Puoi sostituirlo con qualsiasi nome preferisci. Il comando npx scaricherà e eseguirà il pacchetto create-next-app, e installerà un nuovo progetto Next.js per te.

Create a New Next.js Project

Una volta che il comando ha terminato l’esecuzione, avrai una nuova cartella chiamata my-next-app con la struttura di base di un’applicazione Next.js.

Passo 3: Esegui il Tuo Progetto Next.js

Dopo che il progetto è stato creato, vai nella cartella del tuo progetto e avvia il server di sviluppo:

cd my-next-app
npm run dev

Questo comando avvierà il server di sviluppo Next.js. Per impostazione predefinita, il server verrà eseguito su http://localhost:3000.

Run Next.js Project

Apri il tuo browser e vai a quell’URL, e dovresti vedere la pagina di benvenuto predefinita di Next.js.

Default Next.js Page

Puoi iniziare a creare nuove pagine nella cartella app. Ad esempio, crea un nuovo file about.js all’interno della directory app per creare una pagina About.

Conclusione

Hai configurato con successo un nuovo progetto Next.js sulla tua macchina Ubuntu! Ora puoi iniziare a costruire la tua applicazione web aggiungendo nuove pagine, componenti e funzionalità.

Next.js rende facile costruire applicazioni web moderne, e con l’aiuto di questa guida, hai imparato come installare e configurare un progetto Next.js.

Source:
https://www.tecmint.com/install-next-js-ubuntu/