Trei metode locale de previzualizare a site-ului în 60 de secunde

Iată trei modalități de a configura previzualizările site-urilor locale, în 60 de secunde! În primul rând, ne vom uita la Prepros. Apoi vom folosi BrowserSync cu Gulp. În sfârșit, ne vom uita la XAMPP. Terminat.

Trei metode locale de previzualizare a site-ului

1. Prepros

Instalați și rulați aplicația prepros pentru sistemul dvs. de operare. Glisați dosarul static al site-ului pe interfață. Faceți clic dreapta pe numele proiectului și alegeți Deschideți previzualizarea.

2. BrowserSync

În fișierul dvs. de proiect rulați npm init, apoi instalați BrowserSync și Gulp cu sudo npm instala gulp browser-sync -save-dev. Faceți un gulpfile.js cu codul corect în el (descărcați fișierele sursă pentru ajutor în acest sens). Alerga gulp browser-sync.

3. XAMPP

Pentru proiectele care utilizează PHP, instalați XAMPP pentru sistemul dvs. de operare. Puneți "folderul dvs. de proiect" în dosarul "htdocs" al XAMPP, apoi executați XAMPP și porniți serviciile Apache și MySQL.

Într-un browser accesați folderul localhost / yourproject. Asta e!

Resurse utile

Aflați mai multe despre rularea site-urilor locale pe Envato Tuts+.

  • O introducere rapidă în tutorialul BrowserSync
  • Linia de comandă pentru Web Design: Live Reload & BrowserSync tutorial
  • Sudo Explained
  • Fișierele sursă pentru acest tutorial