Hello Coders,
In this article, I will present a curated list with open-source JAMStack apps built using automation tools on top of some well-known designs provided by HTML5Up and Creative-Tim agencies.
Thanks for reading! - Content provided by App Generator.
The automation process executes in a loop a few steps, listed below:
- The flat HTML design is parsed and normalized to be compatible with an existing JAMstack boilerplate (this phase is detailed in a separate article - HTML Parser )
- inject the processed design into the JAMstack boilerplate, already equipped with scrips and builders (gulp, sass processing .. etc)
- start the app and repeat the previous steps in a loop if something is wrong (wrong paths, missing images)
Using this simple workflow, I'm able to skip over the manual work when I start a new project using a new design requested by the customer.
Why JAMstack
After using for years Php and Python frameworks, I decided to switch on JAMstack pattern for simple apps and one-page websites based on facts:
- most of the times, I don't need a database
- speed matters
- any design can be easily integrated into a JAMstack boilerplate code
- the deployment is automatized
- the apps are 100% secure because is generated in plain HTML
JAMStack Paper Kit
This application is built on top of a beautiful UI kit provided by Creative-Tim. The boilerplate comes with sample pages (landing, login, and register) and the license is MIT.
App Links
Build from Sources
$ git clone https://github.com/app-generator/jamstack-paper-kit.git
$ cd jamstack-paper-kit
$ yarn
$ yarn start
$ yarn build
JAMStack Argon Design
Argon Design design is another free UI Kit released under the MIT license by Creative-Tim.
App Links
Build from Sources
$ git clone https://github.com/app-generator/jamstack-argon-design-system.git
$ cd jamstack-argon-design-system
$ yarn
$ yarn start
$ yarn build
JAMStack Fractal
Open-Source app with HTML5Up Fractal design - CCA 3.0 License (inherited from Html5up)
App Links
Build from Sources
$ git clone https://github.com/app-generator/jamstack-fractal.git
$ cd jamstack-fractal
$ yarn
$ yarn start
$ yarn build
JAMStack Big Picture
Open-Source app with HTML5Up BigPicture design - CCA 3.0 License (inherited from Html5up).
App Links
Build from Sources
$ git clone https://github.com/app-generator/jamstack-big-picture.git
$ cd jamstack-big-picture
$ yarn
$ yarn start
$ yarn build
JAMStack Landed
Open-Source app with HTML5Up Landed design - CCA 3.0 License.
App Links
Build from Sources
$ git clone https://github.com/app-generator/jamstack-landed.git
$ cd jamstack-landed
$ yarn
$ yarn start
$ yarn build
JAMStack Now UI Kit
Blazing fast application coded in JAMstack pattern on top of Now UI design - MIT License.
App Links
Build from Sources
$ git clone https://github.com/app-generator/jamstack-now-ui-kit.git
$ cd jamstack-now-ui-kit
$ yarn
$ yarn start
$ yarn build
JAMStack Material Kit
Blazing fast application coded in JAMstack pattern on top of Material Kit design - MIT License.
App Links
Build from Sources
$ git clone git clone https://github.com/app-generator/jamstack-material-kit.git
$ cd jamstack-material-kit
$ yarn
$ yarn start
$ yarn build
More JAMstack Apps
- BulmaLanding - MIT License
- BulmaPlay - MIT License
Other JAMstack resources
- JAMstack - the official webiste
- WTF is JAMstack - JAMstack related website
- JAMstack apps - index provided by AppSeed
Thank You!
Top comments (0)