How-to: How to auto-deploy my website with GitHub Action?
How to auto-deploy my website with GitHub Action?
It is not always necessary to build the site manually and push it to a GitHub repository.
We can ask GitHub to build and deploy when an update appears in the source.
Step 1
On GitHub, create a new public repository named username.github.io
where username is your username on GitHub.
Then go to Settings > Pages and select "GitHub Actions" in the "Build and deployment" section.
Step 2
From Stapy root directory, we add a deployment workflow file (static.yml
) in a .github/workflows
directory:
.github
+------ workflows
+-------- static.yml
name: Deploy static content to Pages
on:
push:
# Update with the live branch name (main, master...)
branches: ["main"]
workflow_dispatch:
permissions:
contents: read
pages: write
id-token: write
concurrency:
group: "pages"
cancel-in-progress: true
jobs:
build:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v3
- name: Setup Pages
uses: actions/configure-pages@v2
- name: Setup Python
uses: actions/setup-python@v4
with:
python-version: "3.10"
- name: Install Python dependencies
# Update with necessary dependencies in plugins
run: pip3 install Markdown pymdown-extensions
- name: Create environment directory
run: mkdir -p './web/prod'
- name: Build
run: python3 stapy.py build
- name: Upload artifact
uses: actions/upload-pages-artifact@v1
with:
path: './web/prod'
deploy:
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
runs-on: ubuntu-latest
needs: build
steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v1
- Update the main branch name with your live branch. When a commit is pushed the build will be executed.
- Update the Python dependencies step, or remove it if you don't need it.
Step 3
Remove the web
directory. We only need the following Stapy files and directories:
.github
plugins
source
stapy.py
Configure Stapy with the full host as the base URL for the prod environment:
source
+----- layout
+----- common.json
{
"url.local": "http://127.0.0.1:1985/",
"url.prod": "https://username.github.io/"
}
Step 4
We initialize the repository, commit and push:
git init
git remote add origin https://github.com/username/username.github.io.git
git add -A
git push
Step 5
Wait a few minutes and go to https://username.github.io
.
You can follow the deployment process in the Actions tab of your GitHub repository.
Next
- How to add a new block?
- How to add a new blog post?
- How to build reusable HTML components?
- How to implement a custom plugin?
- How to display a list of items?
- How to display a list of links?
- How to add dynamic data to a page with a plugin?
- How to use Stapy on Windows?
- How to host my static website for free?
- ✓ How to auto-deploy my website with GitHub Action?
- How to write content in Markdown?
- How to add a JSON feed?
- How to use Stapy with Apache HTTP Server?
- How to update Stapy?