Passa ai contenuti principali

BrowserSync o LiveReload?

Sviluppando in AngularJs on anche mettendo in piedi un semplicissima pagina statica, è utile vedere in realtime il risultato dell'editing
Utilizzando un edito come Atom o SublimeText è possibile solo se si attiva un sistema che controlla la modifica dei file del progetto e che fa un aggiornamento automatico della pagina
A questo riguardo c'è un progetto LiveReload che può aiutare
Ma preferisco parlarvi di BrowserSync
BrowserSync makes your tweaking and testing faster by synchronising file changes and interactions across multiple devices. It’s wicked-fast and totally free

Installazione

L'installazione è veloce e semplice utilizzando npm
npm install -g browser-sync
finito...

Come funziona

E' necessario lanciare un ascoltatore, alla fine è un server, che controlla la modifica dei file. Per i files statici, in questo caso CSS:

browser-sync start --server --files "css/*.css"
Ma è possibile anche puntare ad un progetto web:
browser-sync start --proxy "myproject.dev" --files "css/*.css"
Vi assicuro che è un tool semplice da usare ed anche veloce


Aggiunta

per monitorare ricorsivamente tutti i files dell'applicazione
 browser-sync start --server --files "app/**"

Commenti

Post popolari in questo blog

install language on osTicket

this simple guide aims you to install and configure your language on osTicket i written this guide based on forum post http://osticket.com/forum/discussion/76252/installing-language-pack

Develop Prestashop Module - puntata 1 creazione di un modulo prestashop

la creazione o lo sviluppo di un modulo   Prestashop funziona sia per il front-end che il back-end del sistema la struttura di un modulo è fissa che si compone con una serie di step: file di configurazione file di installazione files controllers per l'amministrazione files controllers per il frontend files delle view creazione dell'infrastruttura base del modulo per Frontend all'interno della cartella modules di prestashop creare una cartella  esempio     <root>          |---modules                    |-----miomodulo naturalmente il nome del modulo lo potete personalizzare all'interno della cartella miomodulo  creare i seguenti file config.xml index.php miomodulo .php   <-- inserite il vostro nome modulo al posto di mio modulo index.php il codice di index php , file che dovrà essere inserito in ogni cartella : <?php /* ...

Prestashop: override PayPal about.tpl

Abbiamo incontrato una difficoltà nell'override del template "about.tpl" di PayPal su Prestashop. Abbiamo cercato sul forge di Prestashop e abbiamo trovato questo bug . Ora il consiglio che viene dato è quello di utilizzare il "core display method". Così dopo un po' di debug l'abbiamo fatto. Per abilitare all'override l'"about.tpl" di Prestashop è necessario modificare il file "modules/paypal/backaward_compatibility/Display.php": <?php /**  * Class allow to display tpl on the FO  */ class BWDisplay extends FrontController { // Assign template, on 1.4 create it else assign for 1.5 public function setTemplate($template) { if (_PS_VERSION_ >= '1.5') parent::setTemplate($template); else $this->template = $template; } // Overload displayContent for 1.4 public function displayContent() { parent::displayContent();                 echo Module::display('paypal', ...