#Sinossi In questo repository trovi tutti i sorgenti per il progetto della Capsule collection Spring Summer 2016. Il progetto è online dal 10 Settembre 2015.

Uso

Questo progetto viene gestito tramite Gulp, un manager di automazione dei task, e RequireJS, un manager di moduli e file.

Per cominciare ad utilizzare Gulp, segui queste linee guida.

All'interno del file gulpfile.js trovi due task principali che puoi avviare da shell (gulp nometask):

• default: è il task che esporta tutti i file CSS, JS e HTML pronti per la produzione online
• watch: è il task che ascolta le modifiche dei file in fase di sviluppo e le prepara per poterle testare e debuggare in locale. Se sei pratico di livereload, usalo per ricaricare in tempo reale le modifiche in Chrome. Per far ciò, nel file gulpfile.js, devi modificare la variabile baseUrl, presente alla riga 3, inserendo l'url che usi in locale per navigare il progetto

npm

Puoi installare questo progetto sulla tua macchina via npm, avviando da shell il comando "npm moschino-ccss16". In questo modo verranno automaticamente scaricate le dipendenze necessarie per gulp.

Struttura di cartelle e file

Questo progetto segue la seguente struttura di cartelle e file:

• build:

  • js: in questa cartella trovi il file app.js che devi caricare nel file HTML e rappresenta l'applicazione con tutte le sue logiche e meccaniche. Il file viene generato dai sorgenti presenti in dev/js
  • css: in questa cartella trovi i CSS compilati dai sorgenti SASS presenti in dev/css
  • html: questa cartella contiene i file HTML, che sono la copia di quelli presenti in dev/html ma con percorsi già predisposti per il go-live

• dev:

  • css: in questa cartella trovi i file sorgenti scritti in SASS e che verranno compilati in build/css. I file con prefisso "_" vengono importati da common.scss e quickbuy.scss
  • js: in questa cartella trovi i file sorgenti su cui lavorare in fase di sviluppo. Il file da cui parte l'applicazione è in dev/js/bootstrap-dev.js
  • html: questa cartella contiene i file HTML che verranno ottimizzati e esportati nella root del progetto, per poter lavorare in locale

• node_modules: in questa cartella trovi tutte le dipendenze, installate via npm necessarie per i task definiti in gulpfile.js

• static: in questa cartella trovi file che non hanno bisogno di essere elaborati via gulp o require.

  • css: in questa cartella trovi eventuali font aggiuntivi
  • gfx: in questa cartella trovi tutti gli assets grafici del progetto
  • js:
    • contents: in questa cartella ci sono i file js che contengono gli oggetti JSON dei contenuti
    • framework: in questa cartella trovi i file che vengono caricati autonomamente nei file HTML
    • plugins: in questa cartella trovi un plugin che comunica a chi usa vecchi browser di fare un update del browser. Deve essere caricato autonomamente nell'HTML perché altrimenti non funziona
  • templates: sono i file HTML caricati via ajax e automaticamente compilati via HandlebarsJS

• README.md: sono io! :)