If you’ve ever wanted to help build the OpenStreetMap website but found our codebase intimidating, you’re in luck. With the recent addition of Jamie Alessio’s Docker support in pull request #2409, it’s now easier to contribute well-tested changes to the OSM site. I’ve never been comfortable with Rails, Chef, or other Ruby code like the kind we use to build OSM.org. Many helpful changes to the site can be made with small front-end tweaks in just HTML or CSS. The new support for Docker provides a quick way to install a working version of the OSM site on your local computer and preview changes before you contribute.
Here’s a recent change I made to implement Andy Allan’s suggestion for improved inbox/outbox navigation, using Bootstrap navigation tabs in place of plain links. This small design tweak is now live on OSM.org My Messages:
Contrast this with the old look, with simple HTML links in the page header that don’t quite look like usable navigation:
This change took just a few minutes, but I would not have been able to test and contribute without a way to easily run OSM.org locally.
Follow Along
Follow the directions in DOCKER.md to set up a running local version of OSM.org on your computer. It takes about 5-10min to get everything working on my Macbook Pro laptop. When you’re done you can navigate to http://0.0.0.0:3000
to see your local version running (give it about 30 seconds on first load; Rails seems to require some boot time to be ready).
To test features that require a logged-in user, navigate to http://0.0.0.0:3000/user/new
and create your account:
The next screen mentions a confirmation email, which you will not receive because you don’t have email configured. Fortunately, there’s a workaround:
The link that would be in the email is also printed to your docker-compose logs -f
terminal output. Copy the part starting with “/user” after “openstreetmap.example.com”, add it after “http://0.0.0.0:3000” in your browser, and you’ll have a working user account:
That’s it! When you submit your contribution as a pull request, you can include screen shots showing the results of your work so it’s easier for community members and site maintainers to understand your proposal. A full code test suite will be run automatically as you update Github with your changes, so you’ll know ahead of time if your changes are safe.