Deploying to Netlify is the quickest way to get started with Sergey. Give the button below a click, and an example website will be instantly deployed for you to play around with! It'll look a bit like this.
This is the tldr; for those au fait with
npm packages. There's step-by-step walkthrough a little further down the page.
$ npm install sergey
sergey to your start and
sergey --watch to your dev scripts in
_imports folder, and place a
header.html file inside.
Import it into your other files with
<sergey-import src="header" />
$ npm run dev
Sergey will start a dev server and watch for any changes.
$ npm start
Sergey will create a
public folder ready to deploy.
What is Sergey
They're all fantastic in their own ways, but also pretty large and in charge. Often when I'm prototyping a website, I don't know if I'll need half the features they offer, nor do I want to spend hours configuring them or reading docs. I just want to get my hands dirty with HTML.
Will it do more in the future? Who knows! Perhaps, but if you need to do more, that's probably a good time to look at some of the illustrious SSG's listed above. Feel free to use Sergey as a springboard, a prototyping tool, or a full-blown production generator. It's up to you!
The Hello, World example
Our starting point is an
This is lovely, clean HTML. But it becomes problematic when we add a few more pages and need to update the header on each page.
Let’s move the header into it’s own file:
Then we can import it in to our original file with the
<sergey-import src=“header” /> tag.
If you’ve already got a
package.json file, feel free to ignore this point!
You’ll need to have Node.js installed to use Sergey. Once that’s done, open terminal/command line and cd into your
website directory. Then, run the following command:
npm init -y
It’s time to install Sergey! Run the command:
npm install sergey
Now we need to add the build and dev commands to the
scripts section of the
package.json file. All in all, it should
look a bit like this:
Wonderful! Let’s run Sergey with the command:
npm run start. If it’s all gone well, you should have a new
in your website directory! It should include an index.html file with the original header in place of the
When you're ready to create a new page, create new folder (say 'about') and place copy of the
index.html file in there. That'll become available at