Host Your Story Maps for Free with Surge
Surge is a static web publishing service geared toward front-end developers that enables you to get your story online in seconds. It’s ideal for standing up a development version of your Story Map to test on other computers or with beta users. It can also takes care of the basic needs for production stories. The free version includes: customs domains, CDN delivered content that is gzipped for performance, SSL (https) URLs, and some SEO optimization.
Essentials for Success
- Have a story ready to publish
- Basic knowledge of terminal (navigate directories)
- Have NodeJS installed
Installing
First, make sure you have NodeJS installed on your computer, then run the following command in your terminal to install Surge:
npm install --global surgeThe surge command should now be installed and available within any directory on your computer.
Publish Your Story
To publish your story, all you have to do is navigate to the story’s project folder from the terminal and type:
surgeThe first time you use this command, it will ask you to create a new account. This makes sure only you, or the contributors you add, can update the story. Add your credentials and press enter:
Welcome to Surge! (surge.sh)
Please login or create an account by entering your email and password:email: ...
password: ...
Next it will verify the directory to upload. Make sure this points to the deployable version of the app. In most cases this folder will only contain a single “index.html”, a “resource” folder, and a “app” folder. If you’ve the downloaded full source code, you should verify the “project path” points to the “deploy” or “dist” folder and not just the main app folder:
project path: /Users/username/../MapJournal/deployFinally, it will ask for the domain for where to publish your story. If you have configured a custom domain with your domain provider, you can use that domain here. Otherwise, you’ll need to use a domain that ends in surge.sh.
domain: your-story.surge.shHit enter, wait a couple seconds for it to upload, and open the domain in a browser to view your hosted story (https://your-story.surge.sh).
Update Your App
If you made changes to the app source code or downloaded a updated version of the code, you can update the hosted version by following the same steps above you used to publish your story. Just make sure to use the exact same domain as the one you used when you first published the story.
For more information or to learn about advanced configuration, check our Surge’s help center.
