Preview, Build, and Publish

To preview your site or get it ready to launch, open your command line, navigate to your site folder, 1 then refer to one of the instructions below.

Previewing your site

Out of the box, Surfgreen comes with a local development server you can use to view your site before you publish it. When you open the site in your browser, pages will auto-update as you edit your site’s files.

Type npm start. When you launch, you’ll see a message:

Surf's up! Your site is ready for local preview:

[Preview URL]

Open that preview url in your web browser. As you edit your site, it will automatically update with your latest changes.

Building your site

Type npm run build to generate a build 2 of your site.

Assuming it’s successful, you’ll see the following message:

Hang ten! Your site has completed building, and can be found in your site's /build folder.

If you're deploying this site from a hosting service, make sure the public root is also set to /build.

Happy surfing!

Publishing your site

Once you’ve built your site, you’ll have to publish it to make it viewable to the world. Surfgreen has no server back-end, which means you can publish it to just about any web server in the world. This is called a static site.

Many services exist that let you publish a static site hosted in a Git repository for free. Our favorite platform is Netlify.

First, make sure your Surfgreen site is hosted in a publicly accessible Git repository. (You can find instructions for setting up GitHub in Getting Started.) Then:

Make sure your site is up to date and published in your repo.
Sign up for a free Netlify account.
Follow Netlify’s instructions for deploying (publishing) your site.
- Be sure to set the publish directory to /build.