Static websites built using Jamstack architecture offer a way to create a modern website with incredible performance, cheap to host, and easy to maintain.
Things you will need:
Open your Terminal and install squido globally:
# npm i -g https://github.com/mrvautin/squido
Speed things up by cloning the example blog Git repository:
# git clone https://github.com/mrvautin/squido-blog-example my-blog
Enter your new blog directory:
# cd my-blog
Build your blog:
command creates a local webserver to view your new blog. The
flag is to build, the
is to watch for changes and rebuild if needed and the
flag is to clean old files.
# squido serve -b -w -c
You can now view your blog by opening the following URL in a browser:
You should see:
If you open up your new blog directory in a text editor, you should see:
Let's clear out the old
example markdown files from the
folder by selecting, right-clicking and
Then create a new file called
folder with the following text:
--- title: Hello world permalink: hello-world description: Hello world date: '2021-06-16 19:17:00' tags: - hello - world --- ## Hello world
Your blog will automatically rebuild and refreshing your browser will look like this:
You can now edit the templates with your custom layout, change the logo, add your CSS colors later.
Back in your terminal, initialize your local Git repository:
# git init
Create a new Github repository to make deploying your blog even easier: Visit Github.
Jump back into your Terminal and link your new Github repository to your local one.
First, run a Git status:
# git status
You will see this:
This shows all our deletions and our new
Add the changes:
# git add .
Create your first Commit:
# git commit -m "Init"
Change the branch to
# git branch -M main
Add your remote Github repository:
# git remote add origin [email protected]:<username>/my-blog.git
Push your changes:
# git push -u origin main
Netlify is a specialty static website host which will allow you to host your blog for free in a matter of minutes. There is no server management or complicated setup.
After you have created a Netlify account, click the
New site from Git
from the Continuous deployment section. Authorize Github, and select your
repository. Change the
and set a new variable
. Finally, click the
The result should look like this:
You will have to wait a few seconds to a minute for your blog to deploy. You can then view your blog by clicking the link:
You can finish here. However, by clicking "Domain settings" you can set up your own custom domain you have purchased from a domain register.
and follow the steps to set up your DNS records to point to your new Netlify blog.
Add custom domain
Create your free account to unlock your custom reading experience.