That ugly green map is being provided by MapBox, one of the leaders in open source mapping right now, and arguably the best base map provider out there. They have a number of tools that allow you to create and publish your own base maps using OpenStreetMap data as their backbone.
The tools that they make available vary in complexity with the amount of flexibility and customizability that they provide. We could spend an entire workshop and more talking about how to author maps from scratch, lucky for us they also let you start from one of their out of the box themes and create your own.
With the free account, you get 50,000 map views / month which is way more than enough for personal projects.
Check out their new tools for authoring base maps here.
At the MapBox home page login to your account if you aren't already. This will take you to your account home page:
We're going to use the simple MapBox Editor tool instead of the more complex MapBox Studio since we don't have the time to get that deep into it, you should definitely try out Studio to experience the amount of detail you can put into the design.
From your account home page, click on the Classic button in the left sidebar to open the classic tools:
Then click on the Editor projects tab:
Then you can click to create a new MapBox Editor project:
Choose from one of the standard base maps that they provide. You used to be able to do some slight customization in this interface, but they would like you to use one of their Studio products to make more custom base maps. For this workshop we'll settle for one of the out of the box themes.
You can add or create data that MapBox will publish for you as part of your layer here as well, but we're going to be doing that later on in the workshop so let's hold off on that for now.
Save your project and then go back to your account page by clicking the little profile icon at the upper left of the screen:
Your new project will be listed on the page along with a map ID, remember where this is because we'll be needing it in the next exercise.
Alright, let's start doing some coding! Exercise 4, A basic map