GulpJS

Hur du bygger webbaplikationer och JS server-side applikationer med GulpJS

GulpJS har på kort tid seglat upp och blivit the mest använda och uppskattade byggverktyget för utveckling av själva klientdelen av webbapplikationer. Ett av skälen är stream pipes, som innebär att build tasks enkelt fogas samman av små byggsteg.

Denna kurs är uppbyggd kring många små praktiska uppgifter, vilka tillsammans ger dig en bra grund för ditt fortsatta arbete som client-side web developer.

Detta får du lära dig
  • Minifiering av stilmallsfiler (CSS), skriptfiler (JS), bildfiler (JPG/PNG) och html filer
  • Webbplats exekvering med dynamisk omladdning efter filuppdatering
Kursinnehåll

Background and overview

Snabb översikt varför GulpJS har utvecklats och hur området utvecklats i raketfart de senaste åren

Short intro to NodeJS

Här går vi snabbt igenom Node JS och NPM, så att du kan använda plattformen GulpJS bygger på

  • What is NodeJS
  • Usage of the node package manager NPM
  • Understanding the package.json file

GulpJS scripts

Här går vi igenom hur ett gulpjs skript byggs upp och hur man skapar byggsteg, överför kommandoradsargument med mera

  • Anatomy of a gulpjs script
  • Tasks
  • Pipes
  • Recommended project directory structure
  • Source files
  • Destination directory
  • Dependent tasks

The sample project

Här går vi igenom exempelprojektet, som används för de flesta av övningarna

  • Directory structure
  • HTML files
  • Stylesheets
  • Javascript files
  • Short intro to Twitter Bootstrap
  • Bower dependencies

File tasks

Vi startar med de mest grundläggande byggstegen, såsom kopiering, radering av filer och sammanslagning av filer

  • Copying files to a directory
  • File globing
  • Keeping or changing the folder structure
  • Merging files
  • Deleting files and directories

Support plugins

Det finns några plugins som man alltid bör ha med

  • Logging with colors
  • Empty pipe steps
  • Debug print outs between pipe steps
  • How to load all project plugins without effort
  • Running tasks in parallel or sequential and how avoid being surprised

Development server

Här visar vi steg-för-seg hur du konfigurerar en plugin för att starta en liten lokal webbserver som servar din webbplats. Dessutom hur du konfiguerar upp att varje gång du sparar någon av dina källkodsfiler, så laddar din webbläsare om alla filer helt automagiskt.

    Production build

    En stor del av byggprocessen handlar om att minska ned storleken på de filer som ska driftsättas. Här går vi igenom hur du gör.

    • Minifications of webb pages (HTML)
    • Minification of style sheets (CSS)
    • Minification of images (PNG, JPG)
    • Minification of scripts (JS)
    SnabbFakta
    NamnGulpJS
    Längd2 Dagar
    NivåBeginner
    MålgruppWebbapplikationsutvecklare
    Förkunskaper Erfarenhet av programmering av webbapplikationer i HTML/CSS/JS
    Verktyg
    • NodeJS
    • GulpJS CLI
    Pris15 000 kr + moms 15000
    KursDatum
    DatumPlats
    Hämtar kursschema...
    Samma-Företags Rabatt

    Vi ger 20% rabatt för tillkommande deltagare från samma företag vid samma kurs-tillfälle. Läs mer här.

    Företagsintern Kurs

    Om du beställer en företagsintern kurs kommer vi till er och håller kursen i era lokaler. Priset bestäms av vår prismodell och baseras på antalet kursdagar, antalet deltagare, samt i förekommande fall resa och logi.

    Läs mer om vår prismodell och beställningsvillkor här.

    Relaterade Kurser
    KursDagarNivå
    JavaScript3BeginnerVisa
    TypeScript2IntermediateVisa
    NodeJS2 Intermediate Visa
    Kurs i Modern Angular 3BeginnerVisa