Scully
Scully is the Angular answer for Jamstack. Created by experts at HeroDevs it is probably the only static site generator based on Google's JS framework, opening the possibilities of Jamstack for all Angular projects.
Daniel Woloszyn
- JS framework: Angular
- Core Maintainer: HeroDevs. LLC
- Website: scully.io
- Founded: 2015
- Github Stars:
Last update: October 28, 2020
Scully is quite a fresh solution - the first commit, created by Jorge Cano, was on 12 December 2019. After a few months of work, there is a stable 1.0.0 release, which means it is production-ready for real-world projects.
Angular integration
Scully integrates with any existing Angular project - you only need to run one setup command. This approach makes it trivial to turn your website static.
An interesting feature of Scully is the implementation of machine-learning - it uses Guess.js to find all routes of your site and pre-render each page to plain HTML and CSS.
File structure
├── ... Angular application files
├── dist
├── .scully
│ └── settings.yml
├── scully
│ ├── plugins
│ │ └── plugin.ts
│ └── ts.config.json
└── scully.[your-project-name].config.ts
Running Scully in your project creates only a few elements and all of them are simple configuration files where you can change the project’s settings, add plugins, and customize the tool’s behavior.
Ecosystem
Despite Scully being quite young it already provides a way of creating custom plugins, integration with API, and 3rd-party scripts. There is a small library of plugins with an in-depth description of the installation and setup of each one.
Showcase
How to get started?
If you already have an Angular application created, run just one command:
ng add @scullyio/init.
Alternatively, for non-Angular workspaces, install Scully package with
npm install @scullyio/init
and then create a project using
nx g @scullyio/init:install -- --project=<projectName> command.
To build the project, run:
ng build --prod
After the project is built you can run Scully using npm run scully. That’s it. A more in-depth description of the process, along with solutions to potential problems, you’ll find in Scully’s documentation.
Conclusion
For now, Scully is the only static site generator made specifically for Angular. It is a great choice if you want to turn an existing project into a static website or you just want to try out the Jamstack approach in Angular enviroment.
- A flexible and extensible plugin system to bake your own functionality into Scully's processes.
- Use of machine learning to find routes of your website and create plain HTML and CSS.
- Easy setup and integration with existing Angular projects.
- Existing Angular projects.