But seriously, try part one, it's pretty fun. If you stubbornly refuse to learn about the Node.js backend powering this application, I'll provide an API URL that you can use instead of your running the backend on your own machine. I'll be writing this tutorial with the assumption that anyone reading it has already completed the first part - Build An Interactive Game of Thrones Map (Part I) - Node.js, PostGIS, and Redis. Part 0 - Project Setup 0.0 - Install Dependencies The application will be built using vanilla Javascript (no frameworks), but we will still organize the codebase into seperate UI components (with seperate HTML, CSS, and JS files) for maximal clarity and seperation-of-concerns.

We will be using Leaflet.js to render the map, Fuse.js to power the location search, and Sass for our styling, all wrapped in a custom Webpack build system. We will also be going over the basics of wiring up a simple Webpack build system, along with covering some guidelines for creating frameworkless Javascript components.įor a preview of the final result, check out the webapp here. Using the techniques that we'll cover for this example webapp, you will have a foundation to build any sort of interactive web-based map, from 'A Day in the Life of an NYC Taxi Cab' to a completely open-source version of Google Maps. Our webapp is built on top of the backend application that we completeted in part I of the tutorial - Build An Interactive Game of Thrones Map (Part I) - Node.js, PostGIS, and Redis In this installment, we'll be building a web application to display from from our 'Game of Thrones' API on an interactive map. Welcome to part II of the tutorial series 'Build An Interactive Game of Thrones Map'. The Exciting World of Digital Cartography

Game of thrones font google