3. Local Development

For your first website, this checklist will help you to get oriented with the basics of local development using Airship CMS. Experienced developers might want to read more about Classic Rendering and SPA Rendering, or check out some example Starter Kits to see how Airship CMS can integrate with popular frontend frameworks such as Angular or ReactJS.


Create a local directory for your project.

Create a new empty directory for your project.

mkdir ~/MyFirstAirshipSite

If you use a source code management tool like Git, you can initialize this directory as a versioned project. Commit all files, including the hidden .airship directory.

airship login to access your project content.

Navigate to your project directory:

cd ~/MyFirstAirshipSite

Inside your project directory, run this command (replace "mysite" with your actual subdomain):

airship login mysite

Auth0 Popup

A browser window will pop up prompting you to login.

Auth0 Popup

Once you log in successfully, you can close the browser window. Your terminal should read:

Successful Authentication.

Auth0 Popup

airship land to retrieve files.

Inside of the ~/MyFirstAirshipSite directory, run this command to download the base set of files that were generated when you set layouts and templates for your pages and collections:

airship land

Auth0 Popup

Enter y to the prompt.

Auth0 Popup

Running airship land will generate a compartments directory containing very basic Airship files that are necessary for building out your project templates.

Auth0 Popup

Open your local files in a text editor.

Open your entire directory in a text editor. This Quickstart Guide uses SublimeText 3. Your local directory structure should look something like this:

.
├── .airship
│  └── name
└── compartments
   ├── airmail
   ├── assets
   ├── layouts
   │   └── application.html
   ├── partials
   └── templates
       └── root.html

In SublimeText 3 it looks like this:

Text Editor Initial

airship serve to run your site locally.

Start a local development server by using the Airship Launcher serve command.

airship serve

Text Editor Initial

Leave this terminal open during development in order to maintain an active connection to the airship server.

View your local site in a browser.

In a browser, navigate to localhost:9001. You will see actual site content, rendered with your local layouts, templates, and assets. It should look exactly the same as the content on the live site:

Browser Initial


Next: Editing Content in Airship CMS