There are a lot of template engines for static websites and dynamic websites. It takes time to learn a new template engine, especially for junior developers.
I wanted to standardize using the same template engine picked from Pug, EJS, Liquid, and so on in the project team to solve the issue.
It's been increased to build e-commerce sites with Shopify recently in my team. Shopify adopts Liquid as a template engine for theme development and introduces it to third-party developers.
Liquid is a template language created by Shopify, but you actually can leverage it to develop other products than Shopify.
For example, it might be more productive that you could develop a static website with Liquid if you usually build e-commerce sites with Shopify.
I made a starter kit for static websites and Jamstack with the liquid template from the above point of view.
Pure Liquid
The name of starter kit is "Pure Liquid".
Pure Liquid enables you to develop a website more effectively than before if you are a theme developer for Shopify.
You can also choose the Jamstack pattern in this kit.
Features
- Built-in static site generator
- Breaking HTML smaller files with Liquid
- HTML Validation with HTML-validate
- Lint TS files with ESLint
- Lint SCSS files with Stylelint
- Format code with prettier
- Compress images
- Creating SVG sprites
- Built-in test runner with Jest and Playwright
Requirements
You need to follow these requirements below. I recommend you to use Yarn as a package manager.
Quick overview
You can set up a static website by running one command.
Please replace <YOUR-PROJECT-NAME> with your own.
yarn create pure-liquid <YOUR-PROJECT-NAME>
You are ready to develop, so follow the below commands to start.
cd <YOUR-PROJECT-NAME> && yarn build && yarn start
You'll see a default page when you access http://localhost:8080.
Thank you!
I appreciate you for reading this article through to the end.
I'll be trying to keep this starter kit as up-to-date as possible. Cheers!
Top comments (0)