Initializing a new Grow project

To start your first Grow project, the easiest thing to do is to use the grow init command. This command fetches a theme (which is like a scaffold) and clones it to your computer, ready for you to develop upon. Themes are Git repositories. They are just Grow projects with some special theme-related data.

But wait! You mentioned that Grow is all about configuration, not code, and now we're downloading scaffolding? Grow's default themes are primarily configuration scaffolds. When you run grow init, Grow creates a set of all the basic required config files. Pods require you to implement absolutely zero business logic code; Grow uses the config files to determine your web site's entire architecture.

Run the following command:

# Clones the "codelab" default theme to a directory "my-codelab" in the current directory.
$ grow init codelab ./my-codelab/
$ cd my-codelab/

You'll now have the "codelab" theme on your computer, ready to use with Grow. To understand what we mean by "configuration, not code," let's take a look at the structure of a Grow project.

Install dependencies

When first starting work with a grow site it is a good practice to run the install command to install and setup any dependencies for the project.

# Installs any dependencies such as node packages and extensions.
$ grow install

Pod structure

Grow projects (which we call pods) contain everything that Grow needs to build your site: content, structure, translations, static files, templates, etc. Again, you won't have to write any code to determine how your site is served or its architecture – configs take care of that for you. Because of this concept, if you need to change URLs later, or add or remove localizations (for example), it's simply a matter of changing the configs within your pod.

Let's now take a look at the structure of a pod. This is the "codelab" pod that was cloned to your computer.

/content/       # Content collections, blueprints, and documents.
/source/        # Source files for asset/media/JS/CSS generation.
/translations/  # Content and UI string translations.
/views/         # Frontend templates.
/podspec.yaml   # Pod specification file.