From 70154435acd54f8c4cec8ad38ae1923a5d7e29ef Mon Sep 17 00:00:00 2001 From: Aldo Funes Date: Wed, 12 Mar 2025 18:04:58 +0000 Subject: [PATCH] feat: self-hosting blog post --- config.toml | 7 +- content/_index.md | 4 +- .../2025-03-12-self-hosting-a-blog-in-2025.md | 163 ++++++++++++++++-- 3 files changed, 156 insertions(+), 18 deletions(-) diff --git a/config.toml b/config.toml index 826669c..ae8855e 100644 --- a/config.toml +++ b/config.toml @@ -106,7 +106,7 @@ external_links_class = "external" # Whether external links are to be opened in a new tab # If this is true, a `rel="noopener"` will always automatically be added for security reasons -external_links_target_blank = false +external_links_target_blank = true # Whether to set rel="nofollow" for all external links external_links_no_follow = false @@ -337,7 +337,7 @@ serve_local_mermaid = true # Show links to previous and next articles at the bottom of posts. # Can be set at page or section levels, following the hierarchy: page > section > config. See: https://welpo.github.io/tabi/blog/mastering-tabi-settings/#settings-hierarchy -show_previous_next_article_links = false +show_previous_next_article_links = true # Invert order of the links to previous and next articles at the bottom of posts. # By default, next articles are on the left side of the page and previous articles are on the right side. @@ -403,9 +403,11 @@ favicon_emoji = "👾" # social_media_card = "" menu = [ + { name = "about", url = "about", trailing_slash = true }, { name = "blog", url = "blog", trailing_slash = true }, { name = "archive", url = "archive", trailing_slash = true }, { name = "tags", url = "tags", trailing_slash = true }, + { name = "categories", url = "categories", trailing_slash = true }, { name = "projects", url = "projects", trailing_slash = true }, ] @@ -443,7 +445,6 @@ fediverse_creator = { handle = "aldofunes", domain = "techhub.social" } # Extra menu to show on the footer, below socials section. footer_menu = [ { url = "https://cal.com/aldofunes", name = "calendar", trailing_slash = false }, - { url = "about", name = "about", trailing_slash = false }, { url = "sitemap.xml", name = "sitemap", trailing_slash = false }, ] diff --git a/content/_index.md b/content/_index.md index 1bc763d..4bc5dc4 100644 --- a/content/_index.md +++ b/content/_index.md @@ -5,8 +5,8 @@ title = "Home" [extra] header = { title = "Welcome to my blog!", img = "img/profile.jpg", img_alt = "Aldo Funes, the blog's author" } -#section_path = "blog/_index.md" # Where to find your posts. -#max_posts = 5 # Show 5 posts on the home page. +section_path = "blog/_index.md" # Where to find your posts. +max_posts = 5 # Show 5 posts on the home page. +++ # Welcome to my blog! diff --git a/content/blog/2025-03-12-self-hosting-a-blog-in-2025.md b/content/blog/2025-03-12-self-hosting-a-blog-in-2025.md index 8403daf..28f9f9f 100644 --- a/content/blog/2025-03-12-self-hosting-a-blog-in-2025.md +++ b/content/blog/2025-03-12-self-hosting-a-blog-in-2025.md @@ -1,33 +1,34 @@ +++ -title = "Self-hosting a website in 2025" -description = "" +title = "Self-Hosting a Website in 2025" +description = "A step-by-step guide to hosting your own website using Zola, Caddy, and Gitea." date = 2025-03-12 updated = 2025-03-12 -tags = ["Self-Hosting", "Ci/CD", "Linux", "Caddy", "Zola"] +tags = ["Self-Hosting", "CI/CD", "Linux", "Caddy", "Zola"] draft = false +++ ## Introduction -[Zola](https://www.getzola.org/) is a static site generator written in Rust. It is fast, simple, and easy to use. This blog is built using -Zola and hosted on a Linux server using [Caddy](https://caddyserver.com/). +[Zola](https://www.getzola.org/) is a static site generator written in Rust that is fast, simple, and easy to use. This blog is built using +Zola and hosted on a Linux server with [Caddy](https://caddyserver.com/) as the web server. -This guide will walk you through setting up Zola and Caddy to host your website. +This guide will walk you through setting up Zola and Caddy to self-host your website efficiently. ## Prerequisites -Before we start, ensure you have the following: +Before starting, ensure you have the following: -1. **A Linux server** - I am using [Pop!_OS 24.04 LTS alpha](https://system76.com/cosmic/). -2. **A domain name** pointing to your server - I am using [Cloudflare](https://www.cloudflare.com/). -3. **A reverse proxy** - I am using [Caddy](https://caddyserver.com/). -4. **A CI/CD platform** - I am using [Gitea](/blog/gitea-open-source-github-alternative) +1. **A Linux server** – I am using [Pop!_OS 24.04 LTS alpha](https://system76.com/cosmic/). +2. **A domain name** pointing to your server – I use [Cloudflare](https://www.cloudflare.com/). +3. **A reverse proxy** – [Caddy](https://caddyserver.com/) handles this role. +4. **A CI/CD platform** – I use [Gitea](/blog/gitea-open-source-github-alternative) for automated deployments. +5. **A privacy-focused analytics tool** – I use [Plausible](https://plausible.io/). ## Installation ### Step 1: Install Zola -We will install Zola from source because there is no available package for Pop!_OS 24.04 LTS alpha: +Since there is no precompiled package for Pop!_OS 24.04 LTS alpha, we will install Zola from source: ```bash git clone https://github.com/getzola/zola.git @@ -38,7 +39,7 @@ zola --version ### Step 2: Create a New Site -Create a new site using Zola: +Initialize a new Zola site: ```bash zola init blog @@ -46,3 +47,139 @@ cd blog git init echo "public" > .gitignore ``` + +### Step 3: Install a Zola Theme + +I use the [tabi](https://github.com/welpo/tabi.git) theme. To install it: + +```bash +git submodule add https://github.com/welpo/tabi.git themes/tabi +``` + +### Step 4: Configure Zola & Tabi + +Zola uses a `config.toml` file for configuration. Below is a sample configuration: + +```toml +base_url = "https://www.aldofunes.com" +title = "Aldo Funes" +description = "Human being in the making" +default_language = "en" +theme = "tabi" +compile_sass = false +minify_html = true +author = "Aldo Funes" +taxonomies = [{ name = "tags" }, { name = "categories" }] +build_search_index = true + +[markdown] +highlight_code = true +highlight_theme = "css" +highlight_themes_css = [{ theme = "dracula", filename = "css/syntax.css" }] +render_emoji = true +external_links_class = "external" +external_links_target_blank = true +smart_punctuation = true + +[search] +index_format = "elasticlunr_json" + +[extra] +stylesheets = ["css/syntax.css"] +remote_repository_url = "https://gitea.funes.me/aldo/blog" +remote_repository_git_platform = "gitea" +mermaid = true +show_previous_next_article_links = true +toc = true +favicon_emoji = "👾" +``` + +### Step 5: Add Content + +Zola uses Markdown for content creation, and its directory structure is intuitive. Use your favorite text editor to start writing articles. + +### Step 6: Deploy Your Site + +To serve the site with Caddy, place the generated files in `/www/blog` and configure Caddy with the following `Caddyfile`: + +```Caddyfile +aldofunes.com, www.aldofunes.com { + tls { + dns cloudflare __CLOUDFLARE_TOKEN__ + resolvers 1.1.1.1 + } + root * /www/blog + file_server + handle_errors { + rewrite * /{err.status_code}.html + file_server + } + header Cache-Control max-age=3600 + header /static/* Cache-Control max-age=31536000 +} +``` + +### Step 7 (Optional): Set Up a CDN + +Using Cloudflare as a CDN improves performance and security. Configure a DNS record and enable Cloudflare proxying to benefit from caching +and DDoS protection. + +### Step 8: Automate Deployment with CI/CD + +To automate deployments with Gitea, create `.gitea/workflows/deploy.yaml`: + +```yaml +name: Deploy +on: + push: + branches: + - main + +jobs: + build-and-test: + runs-on: ubuntu-latest + steps: + - name: Check out repository code + uses: actions/checkout@v4 + with: + submodules: true + + - name: Check 🔍 + uses: zolacti/on@check + with: + drafts: true + + - name: Build 🛠 + uses: zolacti/on@build + + - name: Deploy 🚀 + uses: appleboy/scp-action@v0.1.7 + with: + host: ${{ vars.ATLAS_SSH_HOST }} + username: ${{ vars.ATLAS_SSH_USERNAME }} + key: ${{ secrets.ATLAS_SSH_KEY }} + port: ${{ vars.ATLAS_SSH_PORT }} + source: public + target: /www/blog + rm: true + overwrite: true + strip_components: 1 +``` + +Set these environment variables in Gitea Actions: + +- `ATLAS_SSH_HOST` +- `ATLAS_SSH_USERNAME` +- `ATLAS_SSH_PORT` + +And add the secret key: + +- `ATLAS_SSH_KEY` + +These credentials enable secure deployment via SCP. + +## Conclusion + +You now have a fully self-hosted website powered by Zola and Caddy. With automated CI/CD using Gitea, you can focus on writing content while +Gitea handles deployment. Enjoy your self-hosted blog! +