Installation

System Requirements

To use Jigsaw, you need to have PHP (minimum version 8.2) and Composer installed on your machine. You’ll also optionally need Node.js and NPM installed if you want to use Vite to compile your CSS and Javascript.

1. Create the Project Directory

First, create a new directory for your site:

mkdir my-site

2. Install Jigsaw via Composer

Next, navigate to your new project directory and install Jigsaw using Composer:

cd my-site
composer require tightenco/jigsaw

3. Initialize your Project

Finally, from your project directory, run Jigsaw’s init command to scaffold the default directory structure:

vendor/bin/jigsaw init

Alternatively, get up and running quickly by using a starter template, which starts you off with a fully-configured, professionally-designed site, ready for you to customize with your content. You can use one of Jigsaw’s built-in templates for a blog or an open source documentation site, or use a third-party template.

vendor/bin/jigsaw init blog

or

vendor/bin/jigsaw init docs

Directory Structure

By default, Jigsaw gives you the following directory structure:

source
_assets
css
main.css
js
main.js
_layouts
main.blade.php
assets
images
jigsaw.png
index.blade.php
vendor
bootstrap.php
composer.json
composer.lock
config.php
config.production.php
package-lock.json
package.json
vite.config.js

The /source directory contains the actual contents of your site. This is where all of your site’s pages, CSS, Javascript, images, etc. will be kept.

At the root of the directory, Jigsaw provides a config.php file where you can specify configuration settings for your site, along with vite.config.js for settings related to compiling your assets.

Next, learn about local development.

Why are there two assets directories in /source, one prefixed with an underscore? Find out in the Compiling Assets section.