Web Map Workshop

This is a series of workshops introducing the fundamentals of web programming and webmapping through a technical, tutorial-based paradigm. The workshop series will use a variety of modern tools and techniques, starting with introducing web programming basics and website fundamentals, then introduce a web mapping library called Leaflet that utilizes HTML, CSS, and Javascript to display spatial data and create rich, interactive map experiences.

The workshops are organized into modular sessions, but are best taken in sequence. Technologies introduced and covered:

• JavaScript
• HTML
• CSS
• Leaflet
• NodeJS
• PHP
• PostGIS/SQL
• ExpressJS
• Web Servers with Python and XAMPP

This workshop series is designed for beginners and contains no required prerequisites outside of a desire to improve your coding skills and learn how to utilize web development and programming to make web-based maps. A basic understanding of modern website design and structure using HTML, CSS, and Javascript is helpful, but not necessary. We will cover alot of the basics in the first couple of sessions.

Examples, code, and data, for all of the sessions can be found in this repository.

See below for the session topics, tutorials, and materials.

1 - Code Your First Website: Intro to HTML/CSS

2 - Using Bootstrap: Website Frameworks and Templates

3 - Web Map Fundamentals: Creating a Basic Leaflet Web Map

4 - JavaScript: A Mapper's Introduction

5 - Customization: Map Symbolization, Custom Icons, and User Interface

6 - Introduction to PostGIS and SQL: Using CartoDB and Leaflet

7 - Advanced Mapping: Data Collection with PHP and the CartoDB API

8 - Advanced Mapping: Leaflet with PostGIS/NodeJS/Express