Getting Started
To use Surfgreen, you'll need a Mac or Unix-based computer [^unix_only] onto which you can install Node.js. Surfgreen uses it under the hood, and you'll interact with it using your computer's command line.
[^unix_only]: Surfgreen doesn't support Windows yet, which is not ideal. Support is coming: stay tuned.
This guide assumes some familiarity with HTML and CSS. [^html_css] It does not assume any familiarity with programming languages, Node, or any other web deployment practices.
[^html_css]: Don't know HTML or CSS? If you're just looking for an easy way to build a website, you may be happier using a website building platform, like Squarespace or Wix. They're great! But if you're interested in learning more about web development, Surfgreen's starter kit could be a great introduction for you.
Downloading Surfgreen
First, download the Surfgreen starter, and install Node.js, if you haven't already. Then, open your command line, and navigate to the folder containing your Surfgreen website. [^unix_navigate]
[^unix_navigate]: cd /yourSiteFolder
. If you're on a Mac, you can also drag your site folder into Terminal after typing cd
.
Then, run the command:
npm install
This will download Surfgreen and the other scripts ("packages") it uses.
Once you've done that, you can launch a site locally on your computer by typing:
npm start
Setting up Git (recommended)
These days, it's common for web projects to be hosted in a Git repository. [^about_git] You'll find it useful to manage your Surfgreen site this way, especially as we get into publishing your site.
Never used Git before? The simplest way to get started is to use GitHub, which can host your git repository for free. Here's how to get started:
- Sign up for a free GitHub account, and download GitHub Desktop.
- Open GitHub Desktop and sign in.
- Drag your Surfgreen site folder into GitHub Desktop to create a new repository ("repo").
- Publish your repo to begin managing it through your GitHub account.
[^about_git]: A way of tracking changes to a software project. This is called a version control system. There are many different kinds, but Git is one of the most popular and best-known.
A repository is really just a folder on your computer containing your project. That folder gets uploaded to a Git host (like GitHub) and stays in sync with the copy on your computer.
You've completed the tedious part: installing all of the software. Now, let's get to the fun part: diving into the basics of Surfgreen.