Installare e configurare Jigsaw nell'ambiente di ServBay

Che cos'è Jigsaw?

Jigsaw è un generatore di siti statici basato su Laravel, adatto per costruire documentazione, blog e siti web statici semplici. Offre un sistema di template flessibile e potenti strumenti di sviluppo, rendendo molto semplice la costruzione e gestione di siti web statici.

Passaggi per installare Jigsaw

In questo articolo, spiegheremo come installare e configurare Jigsaw nell'ambiente di ServBay.

Passaggio 1: Creare la cartella del progetto

Innanzitutto, creare una nuova cartella del progetto nella directory www di ServBay:

cd /Applications/ServBay/www
mkdir servbay-jigsaw-app
cd servbay-jigsaw-app

Passaggio 2: Creare un progetto Jigsaw usando Composer

ServBay include già Composer, quindi possiamo usare direttamente Composer per creare il progetto Jigsaw:

composer create-project tightenco/jigsaw

Passaggio 3: Configurare il server web

1. Aggiungi nuovo sito web

   Apri ServBay, clicca sulla scheda "Host" e aggiungi un nuovo sito web:

   • Nome: My Jigsaw Site
   • Dominio: servbay-jigsaw.local
   • Tipo di sito: PHP
   • Versione PHP: scegli la versione PHP appropriata
   • Directory radice del sito: /Applications/ServBay/www/servbay-jigsaw-app/build_local

2. Salva la configurazione

   Salva la configurazione.

Passaggio 4: Costruire il sito Jigsaw

1. Installa le dipendenze

   Esegui il seguente comando nella directory del progetto per installare le dipendenze npm:

   npm install

2. Costruire il sito

   Esegui il seguente comando per costruire il sito Jigsaw:

   ./vendor/bin/jigsaw build

Passaggio 5: Esegui il server di sviluppo locale

1. Accedi al server di sviluppo

   Apri il browser e accedi a https://servbay-jigsaw.local, vedrai la versione in locale del sito Jigsaw.

Passaggio 6: Personalizzare il sito Jigsaw

1. Modifica il contenuto

   Modifica i file Markdown e i file di template Blade nella directory source per personalizzare il contenuto e il layout del tuo sito.

2. Aggiungi nuove pagine

   Crea nuovi file Markdown nella directory source per aggiungere nuove pagine. Ad esempio, crea un file about.md:

   ---
   title: "Su di noi"
   ---
   
   # Su di noi
   
   Questa è la pagina su di noi.

3. Configura il menu di navigazione

   Modifica i file di template del menu di navigazione nella directory source/_layouts per aggiungere nuovi link di navigazione.

4. Ricostruisci il sito

   Dopo ogni modifica al contenuto o ai template, esegui di nuovo il seguente comando per costruire il sito Jigsaw:

   ./vendor/bin/jigsaw build

Usare Jigsaw per costruire il sito web

Ora che hai installato e configurato con successo Jigsaw nell'ambiente di ServBay, puoi iniziare a usarlo per costruire il tuo sito web. Di seguito sono riportate alcune operazioni comuni:

Creare articoli per il blog

1. Creare un articolo

   Crea nuovi file Markdown nella directory source/_posts per aggiungere articoli del blog. Ad esempio, crea un file 2024-06-05-my-first-post.md:

   ---
   title: "Il mio primo articolo"
   date: 2024-06-05
   ---
   
   # Il mio primo articolo
   
   Questo è il contenuto del mio primo articolo.

2. Ricostruisci il sito

   Esegui il seguente comando per costruire il sito Jigsaw:

   ./vendor/bin/jigsaw build

Personalizzare stili e script

1. Modifica gli stili

   Modifica i file SCSS nella directory source/_assets/sass per personalizzare gli stili del sito.

2. Modifica gli script

   Modifica i file JavaScript nella directory source/_assets/js per personalizzare il comportamento interattivo del sito.

3. Compilare le risorse

   Esegui il seguente comando per compilare i file SCSS e JavaScript:

   npm run dev

Con questi passaggi, hai installato e configurato con successo Jigsaw nell'ambiente di ServBay e hai iniziato a usarlo per costruire il tuo sito web. La semplicità e la flessibilità di Jigsaw lo rendono una scelta ideale per costruire siti web statici.