How to use the command 'jigsaw' (with examples)
Jigsaw is a Laravel-based static site builder for PHP. It allows developers to easily create static websites using the Laravel framework. In this article, we will explore various use cases of the jigsaw command and provide examples for each.
Use case 1: Initialize a project
Code:
jigsaw init
Motivation:
Initializing a project with Jigsaw sets up the basic file structure and configuration for the site. This is the first step before starting to build your static website.
Explanation:
The jigsaw init command initializes a new Jigsaw project in the current directory. It creates the necessary directories (source, source/_layouts, source/_partials, etc.) and creates a default config.php file with basic configuration.
Example output:
✔ Jigsaw init successful.
✔ Your new Jigsaw site was created in the current directory.
Now, start building your site by running:
cd ./source
jigsaw build
Use case 2: Initialize a project using a starter template
Code:
jigsaw init template_name
Motivation:
Using a starter template can save time and provide a starting point for building a static website. It allows developers to quickly get started without having to set up the project from scratch.
Explanation:
The jigsaw init command can be extended by specifying a template name. Jigsaw provides various starter templates that can be used to bootstrap a new project. By passing a template name as an argument, the command initializes the project using that specific template.
Example output:
✔ Jigsaw init successful.
✔ Your new Jigsaw site was created in the current directory.
Now, start building your site by running:
cd ./source
jigsaw build
Use case 3: Build the site for development
Code:
jigsaw build
Motivation:
Building the site for development is an essential step in the Jigsaw workflow. It compiles the source files and generates the static website that can be viewed locally.
Explanation:
The jigsaw build command compiles the source files located in the source directory and generates the static website in the build_local directory. This command is typically run after making changes to the source files and before previewing the site.
Example output:
✔ Jigsaw build successful.
Site built in [path-to-project]/build_local
Use case 4: Preview the site from the “build_local” directory
Code:
jigsaw serve
Motivation:
Previewing the site locally allows developers to see the changes they have made without having to deploy the website to a live server. This enables them to quickly iterate and make adjustments as needed.
Explanation:
The jigsaw serve command starts a local development server and serves the static website from the build_local directory. It allows developers to preview the website in their browser by visiting http://localhost:8000. This command is typically used after building the site for development.
Example output:
✔ Jigsaw serve successful.
Server started and available at http://localhost:8000
Use case 5: Build the site for production
Code:
jigsaw build production
Motivation:
Building the site for production ensures that the final version of the website is optimized for performance and ready to be deployed to a live server. This command prepares the website for deployment.
Explanation:
The jigsaw build production command compiles the source files located in the source directory and generates the optimized static website in the build_production directory. The production argument triggers optimizations such as minification and asset versioning.
Example output:
✔ Jigsaw build successful.
Site built in [path-to-project]/build_production
Use case 6: Preview the site from the “build_production” directory
Code:
jigsaw serve build_production
Motivation:
Previewing the site from the build_production directory allows developers to see how the optimized version of the website will look and perform before deploying it to a live server. This helps in identifying any issues or inconsistencies.
Explanation:
The jigsaw serve build_production command starts a local development server and serves the optimized static website from the build_production directory. It allows developers to preview the final version of the website in their browser by visiting http://localhost:8000. This command is typically used after building the site for production.
Example output:
✔ Jigsaw serve successful.
Server started and available at http://localhost:8000
Conclusion
The jigsaw command provides various use cases for managing a Jigsaw project. From initializing a project to building and previewing the website, these commands facilitate the development and deployment process. Whether you are just starting out or working on a production-ready website, Jigsaw offers the necessary tools to build static sites using the power of Laravel.
