Come impostare un ambiente di sviluppo locale

Sep 11, 2025
Come si fa
Set up a local development environment
(Immagine di immagine: futuro)

Un ambiente di sviluppo locale consente di utilizzare la propria macchina per eseguire il tuo sito web, invece di utilizzo di uno fornito da a web hosting azienda. È possibile personalizzare la configurazione senza preoccuparti del fatto che influenzerà il tuo sito live, nonché di fare e testare lo sviluppo del sito prima di caricare il tuo sito. Togliendo il rischio quando la costruzione di qualcosa rende il processo di sviluppo molto meno stressante.

Un altro vantaggio di lavorare localmente è che non è necessario connettere a Internet. Se hai il wifi lento, piace lavorare in giardino o viaggiare, non è necessario cercare un segnale WiFi tutto il tempo.

Il tempo trascorso a un sito di messa in scena e in attesa che il tuo sito si aggiorna davvero aggiungendo oltre un giorno di sviluppo. Un ambiente locale ti consentirà di concentrarti sul codice e sui bit divertenti dei siti web di costruzione.

Questo tutorial presuppone che tu sia su un Mac e il tutorial per iniziare con Valet si concentra su questo. Per un'alternativa PC, prova Homestead. .

Una conoscenza di base del terminale è buona, anche se dovresti essere in grado di seguire, poiché i comandi sono tutti abbastanza semplici. Sono principalmente per ottenere i componenti prerequisiti installati e in esecuzione.

Dopo aver completato questo tutorial, avrai configurato PHP, homebrew e compositore sulla macchina, installato Valet e ha imparato come configurare i siti locali.

Scarica i file. per questo tutorial.

  • 5 modi per accelerare i tuoi siti Web e app

01. Installare homebrew.

Set up a local development environment: Install Homebrew

Inizia installando homebrew dal terminale (Immagine di immagine: Sush Kelly)

Il primo passo qui è installare homebrew. Digita il seguente comando nel terminale. 

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

02. Installa PHP.

Set up a local development environment: Install PHP

Assicurati che il tuo PHP sia la versione 7 (Immagine di immagine: Sush Kelly)

Successivamente dobbiamo installare / aggiornare a PHP7, quindi controlla utilizzando PHP -V -V. Se hai bisogno di installare puoi digitare: 

brew install homebrew/php/php70

Se si riavvia la finestra del terminale ora e digita PHP -V. Ancora una volta, dovrebbe mostrare V7 installato.

03. Installa compositore

Avrai bisogno di scaricare compositore, quindi inserirlo in una directory che fa parte del tuo percorso. 

 PHP -R "Copia ('https://getcomposer.org/installer', 'compositore-setup.php');"
php -r "se (hash_file ( 'sha384', 'compositore setup.php') === '48e3236262b34d30969dca3c37281b3b4bbe3221bda826ac6a9a62d6444cdb0dcd0615698a5cbe587c3f0fe57a54d8f5') {echo 'installatore certificati';} else {echo 'installatore corrotta'; unlink ( 'compositore-setup. PHP ');} echo php_eol; "
Compositore PHP-Setup.php
PHP -R "scollegante ('compositore-setup.php');"

04. Passa al tuo percorso

Set up a local development environment: Move to your PATH

Metti il ​​compositore nel tuo percorso (Immagine di immagine: Sush Kelly)

Ora sposta il compositore in una directory all'interno del tuo percorso. Una volta fatto, puoi controllare l'accesso ad esso digitando Compositore-V. . 

 MV Compositore.Phar / usr / locale / bin / compositore

05. Controlla il tuo percorso

Se digiti. Echo $ Path. , vedrai ciò che contiene. Se non lo è, digitare quanto segue per aggiungerlo. 

 Percorso di esportazione = $ PATH: ~ / .Composer / Venditore / Bin

06. Richiedi Valet a livello globale

Ora abbiamo i pezzi installati, possiamo andare avanti con l'installazione di Valet. Primo. Controlliamo nulla usando la porta 80. Digita il seguente, e se non restituisce nulla, siamo bravi ad andare. 

 Netstat -an | grep "\ .80" | GREP Ascolta

07. Installa valet

Usiamo compositore per installare il pacchetto Valet per noi, e quindi possiamo eseguire Valet Installa. . 

 Composerglobal richiede Laravel / Valet
Valet Installa

08. Directory Park / Unpark

Creare una directory per i tuoi siti di sviluppo e dillo a Valet per servirli. Si noti che le cartelle all'interno di questo sono accessibili come Sub Domini. 

# Passa alla Directory dei tuoi progetti
CD ~ / Progetti / Valet /
Valet Park

09. Dimenticare le directory.

In un modo simile a parcheggiare, se non vuoi più che una cartella possa servire tramite Valet, usa il comando Dimentica dal Directory. 

 con spazi //
Valet Dimentica

10. Link / Directory scollette

Puoi anche collegarsi alle directory. Questo ti consente di scegliere il nome che usi. 

 CD ~ / Progetti / Valet / SottoProject /
# collega la directory del sottoprogetto per renderlo accessibile su collegamento ipertestuale "http://subproject.dev" \ hhttp: //subproject.dev
VALET LINK SUBPROJECT

11. Condividi il tuo sito con il mondo

Puoi condividere il tuo URL di Dev locale al mondo esterno. Nella directory del tuo progetto, digita Valet Condividi. E creerà un URL che puoi usare.

12. Utilizzo di un database

Avrai bisogno di installare il tuo database di scelta - per WordPress, possiamo andare avanti e installare MySQL. 

 Brew Installa MySQL

13. Scegli uno strumento di database

Con un set up di database, uno strumento per importare ed esportare i dati è utile, dal momento che non abbiamo phpmyadmin o simili con il vallet in quanto è così leggero.

14. Scarica Sequel Pro

Set up a local development environment: Download Sequel Pro

Sequel Pro è uno strumento di database semplice (Immagine di immagine: Sequel Pro)

Stiamo usando Sequel Pro, in quanto offre un'interfaccia semplice. Puoi Scaricalo qui .

15. Collega il database

Utilizzando le impostazioni predefinite da MySQL, aggiungi i seguenti dettagli e prova la connessione. 

 Host: 127.0.0.1
Nome utente: root.
Password: (lascia vuoto)

16. Configurare un sito WordPress

Set up a local development environment: Set up a WordPress site

Installare il nucleo di Wordpress nella directory del Valet (Immagine di immagine: Sush Kelly)

Con tutto ora in posizione, impostare un sito WordPress. Creare una nuova cartella all'interno della directory del telet e installare il nucleo di wordpress.

17. Aggiungi un database

Set up a local development environment: Add a database

Creare un database in Sequel Pro (Immagine di immagine: Sush Kelly)

In Sequel Pro, crea un nuovo database con lo stesso nome della cartella creata. Aggiorna il. wp-config. file per adattarsi.

18. prova che è tutto il lavoro

Set up a local development environment: Test it's all working

Testa al browser e controllare che funzioni (Immagine di immagine: Sush Kelly)

Ora se apri il tuo browser e vai a (la tua cartella) .test Dovresti vedere la schermata di installazione di WordPress. Segui questo attraverso il normale.

19. prendendolo ulteriormente

Valet non è solo per eseguire le installazioni WordPress su, è stato in realtà originariamente creato per lo sviluppo della LARAVEL. Sia che tu stia costruendo qualcosa su misura in PHP o utilizzando un framework, puoi facilmente creare un nuovo sito creando una nuova directory per la tua cartella principale.

Generate CSS – the conference for web designers: 26 September, Rich Mix, Shoreditch, London

(Immagine di immagine: futuro)

Unisciti a noi il 26 settembre per Genera CSS. , una conferenza su misura per i web designer offerti da Creative Bloq, Net e Web Designer. Risparmia £ 50 con un biglietto del primo uccello quando prenoti prima del 15 agosto 2019.

Questo articolo è stato originariamente pubblicato in questione 287 di Creative Web Design Magazine Web designer . Comprare il problema 287 qui o Iscriviti al web designer qui .

Articoli Correlati:

  • 40 tutorial di wordpress brillanti
  • I migliori servizi di hosting di WordPress nel 2019
  • 4 modi diversi per creare un mockup del sito web

Come si fa - Articoli più popolari

Come girare la fotografia in illustrazione

Come si fa Sep 11, 2025

(Immagine di credito: Cindy Kang) Capire il modo migliore per girare la fotografia in illustrazione aprirà un mondo ..

8 caratteristiche CSS all'avanguardia (e come usarli)

Come si fa Sep 11, 2025

(Immagine di immagine: Getty Images) CSS è in continua evoluzione e una serie di nuove eccitanti funzionalità è st..

Come abbozzare rapidamente le mani

Come si fa Sep 11, 2025

Per disegnare le mani, è necessario guardare oltre la complessità dell'anatomia della mano e riconoscere le regole semplici che..

Creare trame ghostly con tecniche multimediali misti

Come si fa Sep 11, 2025

Quando ho passato per la prima volta da un flusso di lavoro tradizionale a un'illustrazione digitale, il mio tecnic..

Disegna un Geisha Bad-Ass

Come si fa Sep 11, 2025

In questa illustrazione geisha volevo catturare un avvincimento grungy, scuro, urbano, allacciata con eleganti elementi tradizion..

Sculpt Anatomia realistica in Zbrush

Come si fa Sep 11, 2025

Pagina 1 di 2: Pagina 1 Pagina 1 Pagina 2 Se vuoi andare oltre che ..

4 semplici passaggi per migliorare il tuo rendering

Come si fa Sep 11, 2025

L'uso di luci a cupola è stato uno dei maggiori progressi della creazione CGI negli ultimi decenni. Bagnare una scena da ogni di..

Crea inchiostri misti con indesign

Come si fa Sep 11, 2025

Pagina 1 di 2: Crea un campione di inchiostro misto Crea un campione di i..

Categorie