4.68 out of 5
893 reviews on Udemy

Introduction to web programming for GIS applications

Understanding web programming fundamentals focused on geospatial applications using Leaflet, Turf.js, and PostGIS
Michael Miller
3,107 students enrolled
English [Auto] More
Understand the basic technologies used in web programming and how they interact to form a web application. You will gain basic knowledge of HTML, CSS, JavaScript, jQuery, Bootstrap, PHP, AJAX, SQL, and the PostgreSQL database. More specifically you will gain enough understanding of these technologies to be able to use Leaflet, Turf.js, and PostGIS to create a web-mapping application that is freely available to all.

“Excellent overview of web programming with Geospatial data. I highly recommend this for any beginners. For those with more experience designing web applications, there are a number of points addressed that often are overlooked in typical tutorials. This was a great dive into using open source tools and provides a great example of the tools in action. ” – Student Review on Udemy

“Thank you for this course! It fills a knowledge gap that I wasn’t even aware I had. As a GIS scientist without formal computer science training, a lot of what you are teaching here will come in handy.” – Student message on Udemy

“You truly have inspired me to take a step away and focus on learning more webGIS. Thanks!!” – Student comment on Twitter

“Michael is an incredibly knowledgeable instructor who assumes no prior knowledge. The course content builds up from some very basic coding practices to complex interaction between client and database via a server. Although it was not expected that the exercises were completed I did indeed follow along and now have a fully-functional webapp that I can modify to suit my needs. For an introduction, this course covers an incredibly wide range of concepts covering not only the display and processing of spatial data but also some internet security measures and even a little history thrown in which makes it much easier to understand the possibilities and limitations of Web GIS. I am thoroughly looking forward to starting Michael’s Leaflet course.” – Student Review on Udemy

“The course is exactly what I need — not some copy the script and modify, but rather an understanding of what the process is. At this point, it sounds like a great overview and I am equally impressed with the background and teaching style of the instructor.” – Student Review on Udemy

“Great course does exactly what it says on the tin! Easily digested bite sized lectures that are clear and concise and always put the learning into a geospatial perspective, just what I was looking for.” – Student review on Udemy

This course is oriented towards achieving a conceptual understanding of how web technologies work together to form a web application that can be used to distribute, collect, or analyze geospatial data.

The focus will be on understanding concepts.  You will not have to install any software on your computer.  You will not be asked to follow along step-by-step. Instead the goal will be to provide the background information necessary to understand how the internet works, which technologies you really need to understand and when to use them.  We will also explore additional technologies that you may want to explore further as your understanding and needs grow.

We will be using readily available open source software so you will be able to create web maps without spending any money. The concepts you will learn, however, will be equally valid if you have access to commercial GIS software and web servers.

My intention is to provide the information that I wish I had available before I began my journey into the world of geospatial web development.  I spent a lot of time trying to put together the big picture from the detailed information that was available and I wasted a lot of time pursuing technologies that really were not necessary.  My hope is to help you navigate the world of web development more efficiently than I did and that after taking this course you will be better prepared to take more detailed courses from myself or others. 



A short lecture to introduce the course and tell you what it is all about.

My Background

A little bit about me and why I decided to develop this course.

Course Philosophy and Goals

Understand the philosophy and goals of the course

Client - Server Architechture

What is client-server architecture and how does it work?

Components of a web application

The major and minor components of a web application

Introduction to client side programming

Introduction to how HTML, CSS, and JavaScript work together in the browser.

Section 1

HTML - Structure and content

The structure of an HTML document

The basic structure of an HTML document. Header and body sections.

Basic HTML Tags

An introduction to HTML tags. Headers, paragraphs, and lists.

Links and finding reference material on the internet

Adding a link to a web page and using the web to find reference material about HTML tags

Additional HTML tags

Divs, line breaks, and HTML tags for styling

HTML Tables

Create tables in HTML using table, th, tr, and td tags.

HTML Forms part 1

Creating a form with HTML tags

HTML Forms Part 2

Continuation of previous lecture on creating forms in HTML

Section 2 HTML

CSS - Making your document look good

Introduction to CSS

Introduction to the basics of CSS

Where CSS lives

Description of the three different places that you can include CSS in your document.

CSS precedence

How thebrowser determines which CSS rules to apply when their are conflicts.

CSS Pseudo-selectors

How to use pseudo-selectors to refine the selections that css rules are applied to.

Colors in CSS

Methods for specifying colors in CSS

Uses of CSS

What is CSS used for in web applications and how can we learn more.

Section 3 CSS

The Document Object Model and Events

Intro to the DOM

A short introduction to what the Document Object Model means and how it works.

What is an object

An introduction to the concept of objects

Abstraction and Instantiation

Describing an object class, an abstract class, and the instantiation of objects.

Objects in computer programs

An example of how objects are used, and how their properties are set  in Powerpoint and QGIS

Going from HTML to the DOM

How is the HTML code of a web page translated into a document object model.

Intro to Events

Learn what an event is and how to respond to events with an event handler

​Section 4 - The DOM

JavaScript and JQuery

Intro to JavaScript

An introduction to the purpose of JavaScript.

Accessing the DOM from JavaScript - Part 1

Learn how to access and modify the Document Object Model using Javascript

Accessing the DOM from JavaScript - Part 2

Learn more about how to access and modify the Document Object Model using Javascript

Viewing objects in Developer tools

Learn how to view element properties using the google chrome developer tools

Event Handlers part 1

Writing event handlers in Javascript

Event Handlers Part 2

More about writing event handlers in javascript

Event Handlers Part 3

Even more about event handlers and the if statement in Javascript 


Understand the purpose of variables and how to use them

DOM manipulation example 2

View a second example of DOM manipulation using JavaScript using the switch statement

Calculations in javascript

Using Javascript to perform simple calculations

Validation in Javascript Part 1

Learn how to validate user input and report errors to the user.

The problem with alerts

Learn about the problems associated with alert boxes and methods for communicating with the user without using alerts.

Validation Part 2

More about validation and an example of using DOM manipulation to communicate to the user.

More DOM manipulation

Finishing our example by outputting our results to the user using DOM manipulation

Loops in JavaScript

Learn how to use for loops and while loops to minimize code repetition in Javascript

Arrays in Javascript

Learn more about using arrays in JavaScript

Objects and JSON

Learn how to use objects and JSON to store data.

Frameworks, Libraries, API's, and Plug-Ins

Introduction to Frameworks, libraries, API's, and plug-ins

An introduction to the frameworks and libraries that we will be using in this course, and a few that we won't be using, but that you probably should know about.

Bootstrap - Introduction

An introduction to the purpose and uses of bootstrap

Bootstrap - Demonstration

A demonstration of using Bootstrap classes to layout and style your web page

jQuery - Introduction

An introduction to jQuery.

jQuery - Selections

Selecting DOM elements with jQuery selectors

jQuery - Methods

Using jQuery to modify the DOM

Geospatial data on the web

Learn how Geo-spatial data is stored on the web


Learn how spatial data is structured in geoJSON format

Mapping Libraries and API's

Learn about the pros and cons of different mapping libraries and what they can do for you.

Client-side example. Putting it all together.

Code Editors

A description of the advantages of Code Editors with some examples.

First Map - HTML & CSS

Learn how to create a basic responsive web map layout with HTML, CSS, and bootstrap

First Map - JavaScript

Use Javascript to initialize a web map and add a background map to it.

First Map - Add Custom Data

Learn how to display and style your own custom data

First Map - Respond to user events

Learn how to respond to both DOM events and map events with JavaScript event handlers.

First Map - Adding geoJSON data

Learn how to add data from an external geoJSON data to a web map

First Map - Build HTML from geoJSON

Learn how to loop through geoJSON data and create HTML from it on the fly.

First Map - Spatial Analysis with Turf.js

Learn how to integrate Turf.js to perform spatial analysis in the client.

First Map - Creating geoJSON with QGIS

Learn how to use QGIS to create and modify geoJSON data files for use in leaflet.

First Map - Summary

Summary of client side web mapping and its limitations.

Introduction to Server Side technologies.

Introduction to server side technology

Understand the two main server-side technologies, databases and server side programming languages.

Introduction to Databases

Understand more about the types of databases available and how they are used.

Geospatial data in databases

Understand how geospatial data is stored in databases and the options that are available.

Introduction to servers

Understand the types of servers that are available and the advantages and disadvantages of each.

Common Frustrations

A brief explanation of the history of the web and why we need so many disparate programming languages to develop a web application.


Introduction to SQL

Understand how SQL is used in conjunction with a server side programming language to create dynamic web pages.

SQL Create statement
SQL Insert Statement

Learn how to use a SQL Insert statement to add new records to a database table.

SQL Select statement

Learn how to use SQL SELECT statements to retrieve data from the database with both single table, multi-table, and spatial queries.

What can I do with a SQL Statement?

Learn the different methods available to submit a SQL statement to a database with examples.

SQL Update and Delete Statements


Introduction to PHP

Learn the purpose and basics of PHP

Arrays in PHP

Learn how to deal with numeric and associative arrays in PHP

Communication with the server - GET and POST
Conditional Statements and Loops in PHP

Learn how to control program flow in PHP with conditional statements and loops

SQL Injection and PHP Data Objects

Understand the dangers of SQL injection attacks and how to prevent them with PDO data objects

Accessing the database in PHP

Learn how to access and manage the database using PHP Data Objects

Limitations of PHP and addressing them with AJAX

Learn about some of the limitations with PHP and how to solve them with JavaScript and AJAX

Introduction to AJAX - Part 1

Learn how to use AJAX to submit a request to the server, process the results on the server and return the data to the client.

Introduction to AJAX - Part 2

Live demonstration of using AJAX requests to retrieve data from the server.

Returning JSON data with AJAX

Learn how to format database data on the server as JSON and process it on the client.

Returning spatial data as GeoJSON - Part 1

Learn how to format spatial data on the server as geoJSON for inclusion in a leaflet map.

Returning spatial data as GeoJSON - Part 2

Live demonstration of adding data from the database to a leaflet map.


Introduction to PostGIS

Understand how PostGIS adds geospatial functionality to the PostgreSQL database.

You can view and review the lecture materials indefinitely, like an on-demand channel.
Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don't have an internet connection, some instructors also let their students download course lectures. That's up to the instructor though, so make sure you get on their good side!
4.7 out of 5
893 Ratings

Detailed Rating

Stars 5
Stars 4
Stars 3
Stars 2
Stars 1
30-Day Money-Back Guarantee


15 hours on-demand video
Full lifetime access
Access on mobile and TV
Certificate of Completion