wojsamjan / mygulp501

Intro to Gulp

myGulp501

• Setting up work environment - HTML5+CSS3+JavaScript:

  • Brackets - A modern, open source text editor that understands web design.

    • Brackets API
    • Brackets Shortcuts

  • Gulp - gulp is a toolkit for automating painful or time-consuming tasks in your development workflow, so you can stop messing around and build something.

    • Callum Macrae, Building With Gulp
    • Mark Goodyear, Getting started with Gulp

  • Git - Installing Git

  • Node.js - Installing Node.js

  • Installing Gulp globally:

    npm install gulp -g

  • Installing Gulp locally in our project directory:

    npm init
    npm install gulp --save-dev
    # add node_modules to .gitignore file

Tasks

1. [deadline 05.03.2017] CERN map

• Create a new repository and link up to projects.md.
• Getting to know Gulp gulp.
• Add a CERN neighbourhood map to the code of the first website.
• Add new tasks in gulpfile.js.

2. [deadline 22.03.2017] GeoJSON with Leaflet

• Look through the docs GeoJSON.
• Write some GeoJSON and test them on the website: Simply edit GeoJSON map data.
• Create a website using the Leaflet JavaScript Library.
• Use the following [Geometry Objects] http://geojson.org/geojson-spec.html#geometry-objects): Point, LineString and Polygon.

3.1. [deadline 22.04.2017] Responsive Tables

• Create a website with responsive tables.

3.2. [deadline 22.04.2017] Responsive Images

• Create a website with responsive images.

4. [deadline 06.05.2017] Web Math with MathJax

• Create a website with math formulas using MathJax.

Exam JS

• 2 - CSS + JS CLOCK
• 13 - Slide In On Scroll