diff --git a/content/tutorials/installing-wireguard-ui-to-manage-your-wireguard-vpn-server/index.id.md b/content/tutorials/installing-wireguard-ui-to-manage-your-wireguard-vpn-server/index.id.md index 6b2340b..e540330 100644 --- a/content/tutorials/installing-wireguard-ui-to-manage-your-wireguard-vpn-server/index.id.md +++ b/content/tutorials/installing-wireguard-ui-to-manage-your-wireguard-vpn-server/index.id.md @@ -1,6 +1,7 @@ --- title: "Menginstall WireGuard-UI untuk Mengatur WireGuard Server Anda" description: "WireGuard-UI akan sangat mempermudah Anda dalam mengatur WireGuard peers. Artikel ini membahas langkah-langkah menginstall dan mengkonfigurasi WireGuard UI di VPS." +summary: "WireGuard-UI akan sangat mempermudah Anda dalam mengatur WireGuard peers. Artikel ini membahas langkah-langkah menginstall dan mengkonfigurasi WireGuard UI di VPS." # linkTitle: date: 2023-06-06T04:20:43+07:00 lastmod: @@ -13,70 +14,75 @@ nav_weight: 1000 # name: toggles # color: '#e24d0e' series: - - WireGuard VPN + - WireGuard VPN categories: - - Privasi - - SysAdmin - - Networking - - Self-Hosted + - Privasi + - SysAdmin + - Networking + - Self-Hosted tags: - - WireGuard - - WireGuard UI - - Nginx + - WireGuard + - WireGuard UI + - Nginx images: -# menu: -# main: -# weight: 100 -# params: -# icon: -# vendor: bs -# name: book -# color: '#e24d0e' authors: - - ditatompel - - vie + - ditatompel + - vie --- -WireGuard-UI akan sangat mempermudah Anda dalam mengatur **WireGuard** *peers* (*clients*). Artikel ini membahas langkah-langkah menginstall dan mengkonfigurasi WireGuard UI di VPS. +[Wireguard-UI][wireguard_ui_gh] adalah GUI berbasis website untu mmengatur +konfigurasi WireGuard server yang ditulis oleh [ngoduykhanh][ngoduykhanh] +menggunakan bahasa pemrograman **Go**. Ini bisa menjadi alternatif untuk +menginstall dan mempermudah pengatur VPN server WireGuard Anda. - ---- - -[Wireguard-UI](https://github.com/ngoduykhanh/wireguard-ui) adalah GUI berbasis website untu mmengatur konfigurasi WireGuard server yang ditulis oleh [ngoduykhanh](https://github.com/ngoduykhanh) menggunakan bahasa pemrograman **Go**. Ini bisa menjadi alternatif untuk menginstall dan mempermudah pengatur VPN server WireGuard Anda. - -{{< bs/alert info >}} -{{< bs/alert-heading "TLDR;" >}} -Jika Anda memiliki kesulitan teknis untuk melakukan setup VPN server WireGuard sendiri, {{< bs/alert-link "saya dapat membantu Anda untuk melakukannya" "https://www.fiverr.com/s/4vzPGR" >}} dengan imbalan sedikit uang (sudah termasuk installasi dan konfigurasi WireGuard UI, Nginx dan SSL). -{{< /bs/alert >}} - -Jika Anda lebih memilih untuk menginstall WireGuard server *"from scratch"* dan mengatur dan mengkonfigurasi secara manual, Anda bisa mengikuti artikel saya sebelumnya mengenai "[Cara Setup VPN Server WireGuard Sendiri]({{< ref "/tutorials/how-to-setup-your-own-wireguard-vpn-server/index.id.md" >}})" +Jika Anda lebih memilih untuk menginstall WireGuard server _"from scratch"_ dan +mengatur dan mengkonfigurasi secara manual, Anda bisa mengikuti artikel saya +sebelumnya mengenai +"[Cara Setup VPN Server WireGuard Sendiri]({{< ref "/tutorials/how-to-setup-your-own-wireguard-vpn-server/index.id.md" >}})" ## Prasyarat -- Sebuah **VPS** (**Ubuntu** `22.04 LTS`) dengan alamat IP publik dan **Nginx** *webserver* sudah terinstall di VPS tersebut. -- Nyaman dan terbiasa dengan Linux *command-line*. -- Paham dasar-dasar *subnetting* di **IPv4** (_jujur, saya tidak begitu paham dan berpengalaman untuk subnetting di **IPv6**, jadi artikel ini hanya untuk **IPv4**_). -- Mampu mengkonfigurasi **Nginx** *Virtual Host*. + +- Sebuah **VPS** (**Ubuntu** `22.04` atau `24.04`) dengan alamat IP + publik dan **Nginx** _webserver_ sudah terinstall di VPS tersebut. +- Nyaman dan terbiasa dengan Linux _command-line_. +- Paham dasar-dasar _subnetting_ di **IPv4** (_jujur, saya tidak begitu paham + dan berpengalaman untuk subnetting di **IPv6**, jadi artikel ini hanya + untuk **IPv4**_). +- Mampu mengkonfigurasi **Nginx** _Virtual Host_. Pada artikel ini, tujuan kita adalah: -- _**WireGuard** daemon_ berjalan di port `51822/UDP`. -- **WireGuard UI** berjalan dari `127.0.0.1` port `5000`. -- **Nginx** bertugas sebagai *reverse proxy* supaya **WireGuard UI** dan WireGuard UI dapat diakses melalui protokol **HTTPS**. + +- _**WireGuard** daemon_ berjalan di port `51822/UDP`. +- **WireGuard UI** berjalan dari `127.0.0.1` port `5000`. +- **Nginx** bertugas sebagai _reverse proxy_ supaya **WireGuard UI** dan + WireGuard UI dapat diakses melalui protokol **HTTPS**. ## Mempersiapkan Server Anda -Pertama, pastikan server sudah *up-to-date* dan WireGuard sudah terinstall di server Anda. + +Pertama, pastikan server sudah _up-to-date_ dan WireGuard sudah terinstall di +server Anda. + ```shell sudo apt update && sudo apt upgrade sudo apt install wireguard ``` -Edit `/etc/sysctl.conf` dan tambahkan konfigurasi `net.ipv4.ip_forward=1` di bagian akhir file tersebut, kemudian jalankan perintah `sudo sysctl -p`. +Edit `/etc/sysctl.conf` dan tambahkan konfigurasi `net.ipv4.ip_forward=1` di +bagian akhir file tersebut, kemudian jalankan perintah `sudo sysctl -p`. + ```shell sudo sysctl -p ``` -Hal tersebut perlu dilakukan supaya *kernel* mengijinkan melakukan **IP forwarding**. + +Hal tersebut perlu dilakukan supaya _kernel_ mengijinkan melakukan **IP +forwarding**. ### Mengkonfigrasi Firewall -Anda perlu untuk menambahkan _port_ yang akan digunakan oleh WireGuard _daemon_ ke _allow-list firewall_ Anda. Dari bawaan distro **Ubuntu**, **UFW** sudah terinstall dan dapat digunakan untuk mengkonfigurasi *firewall*. + +Anda perlu untuk menambahkan _port_ yang akan digunakan oleh WireGuard _daemon_ +ke _allow-list firewall_ Anda. Dari bawaan distro **Ubuntu**, **UFW** sudah +terinstall dan dapat digunakan untuk mengkonfigurasi _firewall_. + ```shell sudo ufw allow OpenSSH sudo ufw allow 80 comment "allow HTTP" # akan digunakan oleh Nginx @@ -84,31 +90,41 @@ sudo ufw allow 443 comment "allow HTTPS" # akan digunakan oleh Nginx sudo ufw allow proto udp to any port 443 comment "allow QUIC" # Jika konfigurasi Nginx Anda mensupport QUIC sudo ufw allow proto udp to any port 51822 comment "WireGuard listen port" ``` -> _Perhatikan bahwa saya juga menambahkan **OpenSSH** ke allow list untuk menghindari terputusnya koneksi SSH jika sebelumnya Anda belum mengkonfigurasi / mengaktifkan UFW._ -*Enable* / *restart* `ufw` menggunakan perintah berikut: +> _Perhatikan bahwa saya juga menambahkan **OpenSSH** ke allow list untuk +> menghindari terputusnya koneksi SSH jika sebelumnya Anda belum +> mengkonfigurasi atau mengaktifkan UFW._ + +_Enable_ / _restart_ `ufw` menggunakan perintah berikut: + ```shell sudo ufw enable # untuk enable firewall, atau sudo ufw reload # untuk reload firewall ``` - ## Mendownload & Mengkonfigurasi WireGuard-UI -Download [Wireguard-UI dari halaman _latest release_-nya](https://github.com/ngoduykhanh/wireguard-ui/releases) ke server Anda (pilih sesuai dengan sistem operasi dan arsitektur CPU server Anda). -*Extract* file `.tar.gz` yang baru saja Anda download: +Download [Wireguard-UI dari halaman _latest release_-nya][wireguard_ui_release] +ke server Anda (pilih sesuai dengan sistem operasi dan arsitektur CPU server +Anda). + +_Extract_ file `.tar.gz` yang baru saja Anda download: + ```shell tar -xvzf wireguard-ui-*.tar.gz ``` -Buat folder `/opt/wireguard-ui` dan pindahkan `wireguard-ui` *binary* (dari hasil *extract* file `.tar.gz`) ke `/opt/wireguard-ui`. +Buat folder `/opt/wireguard-ui` dan pindahkan `wireguard-ui` _binary_ (dari +hasil _extract_ file `.tar.gz`) ke `/opt/wireguard-ui`. ```shell mkdir /opt/wireguard-ui mv wireguard-ui /opt/wireguard-ui/ ``` -Buat *environment file* untuk WireGuard-UI. Environment file tersebut nantinya akan dibaca dari `EnvironmentFile` melalui `systemd`: +Buat _environment file_ untuk WireGuard-UI. Environment file tersebut nantinya +akan dibaca dari `EnvironmentFile` melalui `systemd`: + ```plain # /opt/wireguard-ui/.env SESSION_SECRET= @@ -116,42 +132,69 @@ WGUI_USERNAME= WGUI_PASSWORD= ``` -Jika Anda ingin mengaktifkan fitur email, Anda perlu menambahkan setting `SMTP_*` ke *environment variable* diatas. Baca [WireGuard UI Environment Variables details](https://github.com/ngoduykhanh/wireguard-ui#environment-variables) untuk informasi lebih lanjut. +Jika Anda ingin mengaktifkan fitur email, Anda perlu menambahkan setting +`SMTP_*` ke _environment variable_ diatas. Baca [WireGuard UI Environment +Variables details][wireguard_ui_env] untuk informasi lebih lanjut. ### Menemukan Default Interface Server -Kemudian, cari tahu *network interface* mana yang digunakan oleh server Anda sebagai *default route*-nya. Anda bisa menggunakan perintah `ip route list default` untuk itu. Sebagai contoh, *output* dari perintah `ip route list default` saya adalah: -```plain -default via 164.90.160.1 dev eth0 proto static -``` -Catat kata setelah *output* `dev` diatas, itu adalah *default network interface* server Anda. Kita membutuhkan informasi tersebut nanti. Jika dilihat dari contoh *output* diatas, *default network interface* saya `eth0`. -Buat file `/opt/wireguard-ui/postup.sh`, dan isi dengan contoh konfigurasi berikut: +Kemudian, cari tahu _network interface_ mana yang digunakan oleh server Anda +sebagai _default route_-nya. Anda bisa menggunakan perintah +`ip route list default` untuk itu. Sebagai contoh, _output_ dari perintah +`ip route list default` saya adalah: + +```plain +default via 172.xxx.xxx.201 dev eth0 proto static +``` + +Catat kata setelah _output_ `dev` diatas, itu adalah _default network +interface_ server Anda. Kita membutuhkan informasi tersebut nanti. Jika dilihat +dari contoh _output_ diatas, _default network interface_ saya `eth0`. + +Buat file `/opt/wireguard-ui/postup.sh`, dan isi dengan contoh konfigurasi +berikut: + ```bash #!/usr/bin/bash # /opt/wireguard-ui/postup.sh ufw route allow in on wg0 out on eth0 iptables -t nat -I POSTROUTING -o eth0 -j MASQUERADE ``` -*Bash script* `postup.sh` diatas akan dieksekusi saat *service* WireGuard **dijalankan (*started*)**. -Buat file `/opt/wireguard-ui/postdown.sh`. dan isi dengan contoh konfigurasi berikut: +_Bash script_ `postup.sh` diatas akan dieksekusi saat _service_ WireGuard +**dijalankan (_started_)**. + +Buat file `/opt/wireguard-ui/postdown.sh`. dan isi dengan contoh konfigurasi +berikut: + ```bash #!/usr/bin/bash # /opt/wireguard-ui/postdown.sh ufw route delete allow in on wg0 out on eth0 iptables -t nat -D POSTROUTING -o eth0 -j MASQUERADE ``` -*Bash script* `postdown.sh` diatas akan dieksekusi saat *service* WireGuard **diberhentikan (*stopped*)**. -Ubah `eth0` dari dua *bash script* diatas dengan *default network interface* Anda (*lihat pada sesi [Menemukan Default Interface Server](#menemukan-default-interface-server) diatas*). +_Bash script_ `postdown.sh` diatas akan dieksekusi saat _service_ WireGuard +**diberhentikan (_stopped_)**. + +Ubah `eth0` dari dua _bash script_ diatas dengan _default network interface_ +Anda (_lihat pada sesi [Menemukan Default Interface +Server](#menemukan-default-interface-server) diatas_). + +Kemudian, ubah _file permission_ kedua _bash script_ tersebut +(`/opt/wireguard-ui/postup.sh` and `/opt/wireguard-ui/postdown.sh`) supaya bisa +dieksekusi: -Kemudian, ubah *file permission* kedua *bash script* tersebut (`/opt/wireguard-ui/postup.sh` and `/opt/wireguard-ui/postdown.sh`) supaya bisa dieksekusi: ```shell chmod +x /opt/wireguard-ui/post*.sh ``` ### WireGuard-UI daemon SystemD -Untuk memanage **WireGuard-UI** daemon (Web UI) menggunakan `systemd`, buat `/etc/systemd/system/wireguard-ui-daemon.service` *systemd service* file, dan isi dengan konfigurasi berikut: + +Untuk memanage **WireGuard-UI** daemon (Web UI) menggunakan `systemd`, buat +`/etc/systemd/system/wireguard-ui-daemon.service` _systemd service_ file, dan +isi dengan konfigurasi berikut: + ```systemd [Unit] Description=WireGuard UI Daemon @@ -169,15 +212,21 @@ ExecStart=/opt/wireguard-ui/wireguard-ui -bind-address "127.0.0.1:5000" [Install] WantedBy=multi-user.target ``` -> WireGuard UI daemon akan *listen* ke `127.0.0.1:5000` dengan konfigurasi `systemd` service diatas. -Sekarang *reload* konfigurasi `systemd` *daemon* dan cobalah untuk menjalankan `wireguard-ui-daemon.service`. +> WireGuard UI daemon akan _listen_ ke `127.0.0.1:5000` dengan konfigurasi +> `systemd` service diatas. + +Sekarang _reload_ konfigurasi `systemd` _daemon_ dan cobalah untuk menjalankan +`wireguard-ui-daemon.service`. + ```shell sudo systemctl daemon-reload sudo systemctl start wireguard-ui-daemon.service ``` -Periksa dan pastikan `wireguard-ui-daemon.service` Anda berjalan dengan baik dengan menggunakan perintah `systemctl status wireguard-ui-daemon.service`: +Periksa dan pastikan `wireguard-ui-daemon.service` Anda berjalan dengan baik +dengan menggunakan perintah `systemctl status wireguard-ui-daemon.service`: + ```plain ● wireguard-ui-daemon.service - WireGuard UI Daemon Loaded: loaded (/etc/systemd/system/wireguard-ui-daemon.service; disabled; vendor preset: enabled) @@ -201,15 +250,27 @@ Jun 05 23:57:47 fra1-do1 wireguard-ui[4388]: Base path : / Jun 05 23:57:49 fra1-do1 wireguard-ui[4388]: ⇨ http server started on 127.0.0.1:5000 ``` -Jika semuanya berjalan dengan baik, Anda bisa melihat bahwa **WireGuard-UI** sudah *listen* ke `127.0.0.1:5000` (tapi, untuk saat ini, Anda tidak dapat mengakses web UI secara *remote* sampai Anda menelesaikan sesi "*[Mengkonfigurasi Nginx Untuk WireGuard-UI](#mengkonfigurasi-nginx-untuk-wireguard-ui)*" dibawah). +Jika semuanya berjalan dengan baik, Anda bisa melihat bahwa **WireGuard-UI** +sudah _listen_ ke `127.0.0.1:5000` (tapi, untuk saat ini, Anda tidak dapat +mengakses web UI secara _remote_ sampai Anda menelesaikan sesi +"_[Mengkonfigurasi Nginx Untuk +WireGuard-UI](#mengkonfigurasi-nginx-untuk-wireguard-ui)_" dibawah). + +Supaya `wireguard-ui-daemon.service` otomatis berjalan ketika server _restart_, +jalankan perintah berikut: -Supaya `wireguard-ui-daemon.service` otomatis berjalan ketika server *restart*, jalankan perintah berikut: ```shell sudo systemctl enable wireguard-ui-daemon.service ``` ### Auto Restart WireGuard Daemon -Karena **WireGuard-UI** hanya bertugas untuk *menggenerate* konfigurasi WireGuard, Anda perlu `systemd` *service* lainnya untuk mendeteksi adanya perubahan pada konfigurasi WireGuard dan melakukan *restart* WireGuard *service* itu sendiri. Buat `/etc/systemd/system/wgui.service` dan isi dengan contoh konfigurasi berikut: + +Karena **WireGuard-UI** hanya bertugas untuk _menggenerate_ konfigurasi +WireGuard, Anda perlu `systemd` _service_ lainnya untuk mendeteksi adanya +perubahan pada konfigurasi WireGuard dan melakukan _restart_ WireGuard +_service_ itu sendiri. Buat `/etc/systemd/system/wgui.service` dan isi dengan +contoh konfigurasi berikut: + ```systemd [Unit] Description=Restart WireGuard @@ -224,6 +285,7 @@ RequiredBy=wgui.path ``` Kemudian, buat `/etc/systemd/system/wgui.path`: + ```systemd [Unit] Description=Watch /etc/wireguard/wg0.conf for changes @@ -235,7 +297,8 @@ PathModified=/etc/wireguard/wg0.conf WantedBy=multi-user.target ``` -Reload `systemd` *daemon* dengan menjalankan perintah berikut: +Reload `systemd` _daemon_ dengan menjalankan perintah berikut: + ```shell systemctl daemon-reload systemctl enable wgui.{path,service} @@ -243,9 +306,14 @@ systemctl start wgui.{path,service} ``` ### Mengkonfigurasi Nginx Untuk WireGuard-UI -Jika **Nginx** belum terinstall di server Anda, Anda perlu menginstallnya terlebih dahulu. Anda bisa menginstall Nginx mengunakan **default repositori dari Ubuntu** atau menggunakan [official Nginx repositori untuk Ubuntu](https://nginx.org/en/linux_packages.html#Ubuntu). -Setelah Nginx terinstall, buat **Nginx virtual host server block** untuk WireGuard UI: +Jika **Nginx** belum terinstall di server Anda, Anda perlu menginstallnya +terlebih dahulu. Anda bisa menginstall Nginx mengunakan **default repositori +dari Ubuntu** atau menggunakan [official Nginx repositori untuk +Ubuntu][nginx_official_ubuntu]. + +Setelah Nginx terinstall, buat **Nginx virtual host server block** untuk +WireGuard UI: ```nginx server { @@ -277,39 +345,69 @@ server { } } ``` -- Ubah `wgui.example.com` dengan nama (sub)domain Anda. -- Ubah `ssl_certificate` dan `ssl_certificate_key` dengan *SSL certificate* Anda. -Setelah itu, *restart* Nginx menggunakan perintah `sudo systemctl restart nginx`. +- Ubah `wgui.example.com` dengan nama (sub)domain Anda. +- Ubah `ssl_certificate` dan `ssl_certificate_key` dengan _SSL certificate_ + Anda. -**Harap diperhatikan** bahwa konfigurasi Nginx *virtual server block* diatas adalah contoh yang **sangat _basic_**. Jika Anda memerlukan referensi konfigurasi SSL untuk Nginx, Anda bisa menggunakan [Mozilla SSL Configuration Generator](https://ssl-config.mozilla.org/). Jika Anda ingin menggunakan [Let's Encrypt](https://letsencrypt.org/), install `python3-certbot-nginx` dan lakukan lakukan request untuk *SSL certificate* Anda menggunakan perintah `certbot --nginx -d wgui.example.com`. +Setelah itu, _restart_ Nginx menggunakan perintah `sudo systemctl restart nginx`. + +**Harap diperhatikan** bahwa konfigurasi Nginx _virtual server block_ diatas +adalah contoh yang **sangat _basic_**. Jika Anda memerlukan referensi +konfigurasi SSL untuk Nginx, Anda bisa menggunakan [Mozilla SSL Configuration +Generator][mozilla_ssl_config]. Jika Anda ingin menggunakan [Let's +Encrypt][letsencrypt], install `python3-certbot-nginx` dan lakukan lakukan +request untuk _SSL certificate_ Anda menggunakan perintah +`certbot --nginx -d wgui.example.com`. ## Menggunakan WireGuard-UI -Sekarang, setelah semua yang dibutuhkan selesai dikonfigurasi, saatnya untuk **mengkonfigurasi WireGuard menggunakan WireGuard-UI**. Kunjungi (sub)domain WireGuard UI Anda dan login menggunakan username dan password yang sudah Anda konfigurasi sebelumnya di `/etc/wireguard-ui/.env`. -> _**CATATAN:** **Jangan** menekan **"Apply Config"** sebelum Anda selesai mengkonfigurasi setting WireGuard dari WireGuard UI._ +Sekarang, setelah semua yang dibutuhkan selesai dikonfigurasi, saatnya untuk +**mengkonfigurasi WireGuard menggunakan WireGuard-UI**. Kunjungi (sub)domain +WireGuard UI Anda dan login menggunakan username dan password yang sudah Anda +konfigurasi sebelumnya di `/etc/wireguard-ui/.env`. + +> _**CATATAN:** **Jangan** menekan **"Apply Config"** sebelum Anda selesai +> mengkonfigurasi setting WireGuard dari WireGuard UI._ Masuk ke halaman **"WireGuard Server"** dan atur konfigurasi WireGuard, contoh: -- **Server Interface Addresses**: `10.10.88.1/24` -- **Listen Port**: `51822` -- **Post Up Script**: `/opt/wireguard-ui/postup.sh` -- **Post Down Script**: `/opt/wireguard-ui/postdown.sh` + +- **Server Interface Addresses**: `10.10.88.1/24` +- **Listen Port**: `51822` +- **Post Up Script**: `/opt/wireguard-ui/postup.sh` +- **Post Down Script**: `/opt/wireguard-ui/postdown.sh` ![WireGuard- UI Server Settings](wg-ui-server-config.png#center) -Kemudian, masuk ke halaman **"Global Settings"** dan pastikan semua konfigurasi sudah benar (terutama **"Endpoint Address"** dan **"Wireguard Config File Path"**). +Kemudian, masuk ke halaman **"Global Settings"** dan pastikan semua konfigurasi +sudah benar (terutama **"Endpoint Address"** dan **"Wireguard Config File +Path"**). -Setelah itu, cobalah untuk menekan **Apply Config**. Periksa dan pastikan semuanya berjalan dengan baik (pengecekan dapat menggunakan perintah `wg show` atau `ss -ulnt` dari *command-line*). +Setelah itu, cobalah untuk menekan **Apply Config**. Periksa dan pastikan +semuanya berjalan dengan baik (pengecekan dapat menggunakan perintah `wg show` +atau `ss -ulnt` dari _command-line_). ### Membuat Peer (client) -Membuat *peers* menggunakan WireGuard UI sangat mudah, Anda hanya perlu menekan tombol **"+ New Client"** di sisi kanan atas dan isi informasi yang diperlukan (Minimal Anda hanya perlu mengisi *field* **"Name"**). -Setelah menambahkan *peers* (*clients*), tekan tombol **"Apply Config"** dan coba untuk melakukan koneksi ke WireGuard VPN server dari perangkat Anda. File konfigurasi untuk perangkat Anda dapat didownload dari **WireGuard UI**. Anda juga bisa dengan mudah mengimport konfigurasi untuk perangkat Anda menggunakan fitur *scan* **QR Code**. +Membuat _peers_ menggunakan WireGuard UI sangat mudah, Anda hanya perlu menekan +tombol **"+ New Client"** di sisi kanan atas dan isi informasi yang diperlukan +(Minimal Anda hanya perlu mengisi _field_ **"Name"**). + +Setelah menambahkan _peers_ (_clients_), tekan tombol **"Apply Config"** dan +coba untuk melakukan koneksi ke WireGuard VPN server dari perangkat Anda. File +konfigurasi untuk perangkat Anda dapat didownload dari **WireGuard UI**. Anda +juga bisa dengan mudah mengimport konfigurasi untuk perangkat Anda menggunakan +fitur _scan_ **QR Code**. ![WireGuard UI clients page](wg-ui-clients.png#center) -Apa langkah selanjutnya? Bagaimana dengan [Mengkonfigurasi WireGuard VPN Client]({{< ref "/tutorials/configure-wireguard-vpn-clients/index.id.md" >}})? +Apa langkah selanjutnya? Bagaimana dengan [Mengkonfigurasi WireGuard VPN +Client]({{< ref "/tutorials/configure-wireguard-vpn-clients/index.id.md" >}})? -## Catatan -- Jika Anda memiliki kesulitan teknis untuk melakukan *setup* VPN server WireGuard sendiri, saya dapat membantu Anda untuk melakukannya dengan imbalan sedikit uang (sudah termasuk installasi dan konfigurasi WireGuard UI, Nginx dan SSL). -- Untuk dapat menghubungi saya, silahkan kunjungi [https://www.ditatompel.com/pages/contact](https://www.ditatompel.com/pages/contact). +[wireguard_ui_gh]: https://github.com/ngoduykhanh/wireguard-ui "WireGuard-UI GitHub Repo" +[ngoduykhanh]: https://github.com/ngoduykhanh "ngoduykhanh GitHub profile" +[wireguard_ui_release]: https://github.com/ngoduykhanh/wireguard-ui/releases "WireGuard UI release page" +[wireguard_ui_env]: https://github.com/ngoduykhanh/wireguard-ui#environment-variables "WireGuard UI environment variable" +[nginx_official_ubuntu]: https://nginx.org/en/linux_packages.html#Ubuntu "Nginx official repository for Ubuntu" +[mozilla_ssl_config]: https://ssl-config.mozilla.org/ "Mozilla SSL config" +[letsencrypt]: https://letsencrypt.org/ "LetsEncrypt Website" diff --git a/content/tutorials/installing-wireguard-ui-to-manage-your-wireguard-vpn-server/index.md b/content/tutorials/installing-wireguard-ui-to-manage-your-wireguard-vpn-server/index.md index 1f1ab84..ac18da7 100644 --- a/content/tutorials/installing-wireguard-ui-to-manage-your-wireguard-vpn-server/index.md +++ b/content/tutorials/installing-wireguard-ui-to-manage-your-wireguard-vpn-server/index.md @@ -1,6 +1,7 @@ --- title: "Installing WireGuard-UI to Manage Your WireGuard VPN Server" description: "To manage WireGuard peers (client) on a single server easily, you can use WireGuard-UI, a web-based user interface to manage your WireGuard setup written in Go." +summary: "To manage WireGuard peers (client) on a single server easily, you can use WireGuard-UI, a web-based user interface to manage your WireGuard setup written in Go." # linkTitle: date: 2023-06-06T04:20:43+07:00 lastmod: @@ -13,69 +14,74 @@ nav_weight: 1000 # name: toggles # color: '#e24d0e' series: - - WireGuard VPN + - WireGuard VPN categories: - - Privacy - - SysAdmin - - Networking - - Self-Hosted + - Privacy + - SysAdmin + - Networking + - Self-Hosted tags: - - WireGuard - - WireGuard UI - - Nginx + - WireGuard + - WireGuard UI + - Nginx images: -# menu: -# main: -# weight: 100 -# params: -# icon: -# vendor: bs -# name: book -# color: '#e24d0e' authors: - - ditatompel + - ditatompel --- -To manage **WireGuard** *peers* (client) on a single server easily, you can use **WireGuard-UI**, a web-based user interface to manage your WireGuard setup written in **Go**. +[Wireguard-UI][wireguard_ui_gh] is a _web-based_ user interface to manage your +**WireGuard** server setup written by [ngoduykhanh][ngoduykhanh] using **Go** +programming language. This is an alternative way to install and easily manage +your WireGuard VPN server. - ---- - -[Wireguard-UI](https://github.com/ngoduykhanh/wireguard-ui) is a *web-based* user interface to manage your **WireGuard** server setup written by [ngoduykhanh](https://github.com/ngoduykhanh) using **Go** programming language. This is an alternative way to install and easily manage your WireGuard VPN server. - -{{< bs/alert info >}} -{{< bs/alert-heading "TLDR;" >}} -If you have some technical difficulties setting up your own WireGuard server, {{< bs/alert-link "I can help you to setup WireGuard VPN server" "https://www.fiverr.com/s/4vzPGR" >}} including configuring Nginx, and SSL for WireGuard UI for small amount of money. -{{< /bs/alert >}} - -If you prefer to install WireGuard server *"from scratch"* and manage it manually, you can follow my previous article about "[How to Set up Your Own WireGuard VPN Server]({{< ref "/tutorials/how-to-setup-your-own-wireguard-vpn-server/index.md" >}})". +If you prefer to install WireGuard server _"from scratch"_ and manage it +manually, you can follow my previous article about +"[How to Set up Your Own WireGuard VPN Server]({{< ref "/tutorials/how-to-setup-your-own-wireguard-vpn-server/index.md" >}})". ## Prerequisites -- A **VPS** (**Ubuntu** `22.04 LTS`) with Public IP address and **Nginx** installed. -- Comfortable with Linux *command-line*. -- Basic knowledge of _**IPv4** subnetting_ (_to be honest, I'm not familiar with IPv6 subnetting, so this article is for **IPv4** only_). -- Able to configure **Nginx** *Virtual Host*. + +- A **VPS** (**Ubuntu** `22.04` or `24.04`) with Public IP address +- Comfortable with Linux _command-line_. +- Basic knowledge of _**IPv4** subnetting_ (_to be honest, I'm not familiar + with IPv6 subnetting, so this article is for **IPv4** only_). +- Able to configure **Nginx** _Virtual Host_. In this guide, our goals: -- Server run _**WireGuard** daemon_ listen on port `51822/UDP`. -- **WireGuard UI** run from `127.0.0.1` on port `5000`. -- **Nginx** acts as *reverse proxy* and serve **WireGuard UI** service using **HTTPS**. + +- Server run _**WireGuard** daemon_ listen on port `51822/UDP`. +- **WireGuard UI** run from `127.0.0.1` on port `5000`. +- **Nginx** acts as _reverse proxy_ and serve **WireGuard UI** service using + **HTTPS**. + +{{< youtube o_JcLMjYI1A >}} + +> Note: The YouTube videos above are not in the order of this article. They +> also use different IPs & subnets, so adjust them to your needs. ## Prepare Your Server -First, make sure your system is *up-to-date* and **WireGuard is installed** on your server. + +First, make sure your system is _up-to-date_ and **WireGuard is installed** +on your server. + ```shell sudo apt update && sudo apt upgrade sudo apt install wireguard ``` -Edit `/etc/sysctl.conf` and add `net.ipv4.ip_forward=1` to the end of the file, then run `sudo sysctl -p` to load the new `/etc/sysctl.conf` values. +Edit `/etc/sysctl.conf` and add `net.ipv4.ip_forward=1` to the end of the file, +then run `sudo sysctl -p` to load the new `/etc/sysctl.conf` values. + ```shell sudo sysctl -p ``` -This is required to allow **IP forwarding** on your server. + +This is required to allow **packet forwarding** on your server. ### Setting up Firewall -By default, **Ubuntu** system use comes with **UFW** to manage system *firewall*. You need to **add WireGuard listen port to firewall allow list**. + +By default, **Ubuntu** system use comes with **UFW** to manage system +_firewall_. You need to **add WireGuard listen port to firewall allow list**. + ```shell sudo ufw allow OpenSSH sudo ufw allow 80 comment "allow HTTP" # will be used by Nginx @@ -83,31 +89,40 @@ sudo ufw allow 443 comment "allow HTTPS" # will be used by Nginx sudo ufw allow proto udp to any port 443 comment "allow QUIC" # If your Nginx support QUIC sudo ufw allow proto udp to any port 51822 comment "WireGuard listen port" ``` -> _Note that I also add **OpenSSH** to allow list to avoid losing connection to SSH if you didn't configure / activate it before._ + +> _Note that I also add **OpenSSH** to allow list to avoid losing connection to +> SSH if you didn't configure / activate it before._ Enable / restart your `ufw` service using: + ```shell sudo ufw enable # to enable firewall, or sudo ufw reload # to reload firewall ``` - ## Download & Configure WireGuard-UI -Download [Wireguard-UI from its latest release page](https://github.com/ngoduykhanh/wireguard-ui/releases) to your server. Choose the one that match with your **server OS** and **CPU architecture**. + +Download [Wireguard-UI from its latest release page][wireguard_ui_release] to +your server. Choose the one that match with your **server OS** and **CPU +architecture**. Extract downloaded `.tar.gz` file: + ```shell tar -xvzf wireguard-ui-*.tar.gz ``` -Create new directory `/opt/wireguard-ui` and move the `wireguard-ui` *binary* (from extracted `.tar.gz` file) to `/opt/wireguard-ui`. +Create new directory `/opt/wireguard-ui` and move the `wireguard-ui` _binary_ +(from extracted `.tar.gz` file) to `/opt/wireguard-ui`. ```shell mkdir /opt/wireguard-ui mv wireguard-ui /opt/wireguard-ui/ ``` -Create environment file for WireGuard-UI (This will be loaded using `EnvironmentFile` from `systemd` unit file later): +Create environment file for WireGuard-UI (This will be loaded using +`EnvironmentFile` from `systemd` unit file later): + ```plain # /opt/wireguard-ui/.env SESSION_SECRET= @@ -115,42 +130,65 @@ WGUI_USERNAME= WGUI_PASSWORD= ``` -If you want to enable email feature, you need to set up your `SMTP_*` environment variable. See [WireGuard UI Environment Variables details](https://github.com/ngoduykhanh/wireguard-ui#environment-variables) for more information. +If you want to enable email feature, you need to set up your `SMTP_*` +environment variable. See [WireGuard UI Environment Variables +details][wireguard_ui_env] for more information. ### Finding Server Default Interface -Then, find out which network interface used by your server as its *default route*. You can use `ip route list default` to see that. Example output of my `ip route list default` command: + +Then, find out which network interface used by your server as its _default +route_. You can use `ip route list default` to see that. Example output of my +`ip route list default` command: + ```plain -default via 164.90.160.1 dev eth0 proto static +default via 172.xxx.xxx.201 dev eth0 proto static ``` -Write down the word after `dev` output, that's your default network interface. We will need that information later. In this example, my default network interface is `eth0`. + +Write down the word after `dev` output, that's your default network interface. +We will need that information later. In this example, my default network +interface is `eth0`. Create `/opt/wireguard-ui/postup.sh`, and fill with this example config: + ```bash #!/usr/bin/bash # /opt/wireguard-ui/postup.sh ufw route allow in on wg0 out on eth0 iptables -t nat -I POSTROUTING -o eth0 -j MASQUERADE ``` -The `postup.sh` bash script above will be executed when WireGuard service is **started**. + +The `postup.sh` bash script above will be executed when WireGuard service is +**started**. Create `/opt/wireguard-ui/postdown.sh`, and fill with this example config: + ```bash #!/usr/bin/bash # /opt/wireguard-ui/postdown.sh ufw route delete allow in on wg0 out on eth0 iptables -t nat -D POSTROUTING -o eth0 -j MASQUERADE ``` -The `postdown.sh` bash script above will be executed when WireGuard service is **stopped**. -Replace `eth0` value from those two bash script above with your default network interface (*see [Finding Server Default Interface section](#finding-server-default-interface) above*). +The `postdown.sh` bash script above will be executed when WireGuard service is +**stopped**. + +Replace `eth0` value from those two bash script above with your default network +interface (_see [Finding Server Default Interface +section](#finding-server-default-interface) above_). + +Then, make those two bash script (`/opt/wireguard-ui/postup.sh` and +`/opt/wireguard-ui/postdown.sh`) executable: -Then, make those two bash script (`/opt/wireguard-ui/postup.sh` and `/opt/wireguard-ui/postdown.sh`) executable: ```shell chmod +x /opt/wireguard-ui/post*.sh ``` ### WireGuard-UI daemon SystemD -To manage **WireGuard-UI** daemon (Web UI) using `systemd`, create `/etc/systemd/system/wireguard-ui-daemon.service` systemd file, and fill with this following configuration: + +To manage **WireGuard-UI** daemon (Web UI) using `systemd`, create +`/etc/systemd/system/wireguard-ui-daemon.service` systemd file, and fill with +this following configuration: + ```systemd [Unit] Description=WireGuard UI Daemon @@ -168,15 +206,20 @@ ExecStart=/opt/wireguard-ui/wireguard-ui -bind-address "127.0.0.1:5000" [Install] WantedBy=multi-user.target ``` + The `systemd` configuration will run WireGuard UI daemon on `127.0.0.1:5000`. -Now reload your `systemd` daemon configuration and try to start `wireguard-ui-daemon.service`. +Now reload your `systemd` daemon configuration and try to start +`wireguard-ui-daemon.service`. + ```shell sudo systemctl daemon-reload sudo systemctl start wireguard-ui-daemon.service ``` -Verify your `wireguard-ui-daemon.service` is running properly by using `systemctl status wireguard-ui-daemon.service`: +Verify your `wireguard-ui-daemon.service` is running properly by using +`systemctl status wireguard-ui-daemon.service`: + ```plain ● wireguard-ui-daemon.service - WireGuard UI Daemon Loaded: loaded (/etc/systemd/system/wireguard-ui-daemon.service; disabled; vendor preset: enabled) @@ -200,16 +243,24 @@ Jun 05 23:57:47 fra1-do1 wireguard-ui[4388]: Base path : / Jun 05 23:57:49 fra1-do1 wireguard-ui[4388]: ⇨ http server started on 127.0.0.1:5000 ``` -If everything works well, you can see that **WireGuard-UI** is listening on `127.0.0.1:5000` (but, for now, you cannot access the web UI from remote machine until you finished the *[Configuring Nginx for WireGuard-UI section](#configuring-nginx-for-wireguard-ui)* below). +If everything works well, you can see that **WireGuard-UI** is listening on +`127.0.0.1:5000` (but, for now, you cannot access the web UI from remote +machine until you finished the _[Configuring Nginx for WireGuard-UI +section](#configuring-nginx-for-wireguard-ui)_ below). Make `wireguard-ui-daemon.service` run at start up: + ```shell sudo systemctl enable wireguard-ui-daemon.service ``` - ### Auto Restart WireGuard Daemon -Because **WireGuard-UI** only takes care of WireGuard configuration generation, another `systemd` is required to watch for the changes and restart the **WireGuard** service. Create `/etc/systemd/system/wgui.service` and fill with this following example: + +Because **WireGuard-UI** only takes care of WireGuard configuration generation, +another `systemd` is required to watch for the changes and restart the +**WireGuard** service. Create `/etc/systemd/system/wgui.service` and fill with +this following example: + ```systemd [Unit] Description=Restart WireGuard @@ -224,6 +275,7 @@ RequiredBy=wgui.path ``` Then, create `/etc/systemd/system/wgui.path`: + ```systemd [Unit] Description=Watch /etc/wireguard/wg0.conf for changes @@ -236,6 +288,7 @@ WantedBy=multi-user.target ``` Apply `systemd` configurations changes by issuing this following commands: + ```shell systemctl daemon-reload systemctl enable wgui.{path,service} @@ -243,9 +296,13 @@ systemctl start wgui.{path,service} ``` ### Configuring Nginx for WireGuard-UI -If **Nginx** not installed on your server, you need to install it first. You can use Nginx from **Ubuntu default repository** or using [Nginx official repository for Ubuntu](https://nginx.org/en/linux_packages.html#Ubuntu). -After Nginx installed, create **Nginx virtual host server block** for WireGuard UI: +If **Nginx** not installed on your server, you need to install it first. You +can use Nginx from **Ubuntu default repository** or using [Nginx official +repository for Ubuntu][nginx_official_ubuntu]. + +After Nginx installed, create **Nginx virtual host server block** for +WireGuard UI: ```nginx server { @@ -277,41 +334,65 @@ server { } } ``` -- Replace `wgui.example.com` with your (sub)domain name. -- Replace `ssl_certificate` and `ssl_certificate_key` with your certificate files. + +- Replace `wgui.example.com` with your (sub)domain name. +- Replace `ssl_certificate` and `ssl_certificate_key` with your certificate + files. Now restart your nginx configuration `sudo systemctl restart nginx`. -**Please note** that Nginx server block configuration above is **very basic config**. If you need recommended SSL configuration for Nginx, follow this [Mozilla SSL Configuration Generator](https://ssl-config.mozilla.org/). If you want to use [Let's Encrypt](https://letsencrypt.org/) certificate, install `python3-certbot-nginx` and request your certificate using `certbot --nginx -d wgui.example.com`. +**Please note** that Nginx server block configuration above is **very basic +config**. If you need recommended SSL configuration for Nginx, follow this +[Mozilla SSL Configuration Generator][mozilla_ssl_config]. If you want to use +[Let's Encrypt][letsencrypt] certificate, install `python3-certbot-nginx` and +request your certificate using `certbot --nginx -d wgui.example.com`. ## Using WireGuard-UI -Now after configuring all those required services, it's time to **configure our WireGuard config using WireGuard-UI**. Go to your WireGuard-UI (sub)domain and login with username and password you've configured before from `/etc/wireguard-ui/.env`. -> _**Do not** press **"Apply Config"** before you finished configuring your WireGuard setting from WireGuard UI._ +Now after configuring all those required services, it's time to **configure our +WireGuard config using WireGuard-UI**. Go to your WireGuard-UI (sub)domain and +login with username and password you've configured before from +`/etc/wireguard-ui/.env`. + +> _**Do not** press **"Apply Config"** before you finished configuring your +> WireGuard setting from WireGuard UI._ Go to **"WireGuard Server"** page and configure WireGuard config: -- **Server Interface Addresses**: `10.10.88.1/24` -- **Listen Port**: `51822` -- **Post Up Script**: `/opt/wireguard-ui/postup.sh` -- **Post Down Script**: `/opt/wireguard-ui/postdown.sh` + +- **Server Interface Addresses**: `10.10.88.1/24` +- **Listen Port**: `51822` +- **Post Up Script**: `/opt/wireguard-ui/postup.sh` +- **Post Down Script**: `/opt/wireguard-ui/postdown.sh` ![WireGuard-UI Server Settings](wg-ui-server-config.png#center) -Then go to **"Global Settings"**, verify that all your config is correct (especially for **"Endpoint Address"** and **"WireGuard Config File Path"**). +Then go to **"Global Settings"**, verify that all your config is correct +(especially for **"Endpoint Address"** and **"WireGuard Config File Path"**). After that, try to **Apply** your configuration. -Verify that everything is running (try to check using `wg show` or `ss -ulnt` from *command-line*). +Verify that everything is running (try to check using `wg show` or `ss -ulnt` +from _command-line_). ### Creating Peer (client) -Creating peers using WireGuard UI is pretty simple, all you need to do is press **"+ New Client"** button from the top right of the page and fill required information. You only need to fill **"Name"** field for most use case. -After adding your peers (clients), press **"Apply Config"** and try to connect to your WireGuard VPN server from your devices. The configuration file for your devices can be downloaded from **WireGuard UI**. You can also easily scan configuration for your mobile devices by scanning configuration **QR code**. +Creating peers using WireGuard UI is pretty simple, all you need to do is press +**"+ New Client"** button from the top right of the page and fill required +information. You only need to fill **"Name"** field for most use case. + +After adding your peers (clients), press **"Apply Config"** and try to connect +to your WireGuard VPN server from your devices. The configuration file for your +devices can be downloaded from **WireGuard UI**. You can also easily scan +configuration for your mobile devices by scanning configuration **QR code**. ![WireGuard UI clients page](wg-ui-clients.png#center) What next? How about [Configure WireGuard VPN Clients]({{< ref "/tutorials/configure-wireguard-vpn-clients/index.md" >}})? -### Notes -- If you have some technical difficulties setting up your own WireGuard server, [I can help you to setup WireGuard VPN server](https://www.fiverr.com/s/4vzPGR) for small amount of money. -- To find out how to contact me, please visit [https://www.ditatompel.com/pages/contact](https://www.ditatompel.com/pages/contact). +[wireguard_ui_gh]: https://github.com/ngoduykhanh/wireguard-ui "WireGuard-UI GitHub Repo" +[ngoduykhanh]: https://github.com/ngoduykhanh "ngoduykhanh GitHub profile" +[wireguard_ui_release]: https://github.com/ngoduykhanh/wireguard-ui/releases "WireGuard UI release page" +[wireguard_ui_env]: https://github.com/ngoduykhanh/wireguard-ui#environment-variables "WireGuard UI environment variable" +[nginx_official_ubuntu]: https://nginx.org/en/linux_packages.html#Ubuntu "Nginx official repository for Ubuntu" +[mozilla_ssl_config]: https://ssl-config.mozilla.org/ "Mozilla SSL config" +[letsencrypt]: https://letsencrypt.org/ "LetsEncrypt Website" diff --git a/go.sum b/go.sum index 95b6596..6523c9d 100644 --- a/go.sum +++ b/go.sum @@ -40,11 +40,9 @@ github.com/hbstack/carousel v0.2.7 h1:CeAYTFjFfVd8NSU0/iWLwmRwAnZBuzWn+2Own1eKkp github.com/hbstack/carousel v0.2.7/go.mod h1:jjsMHn99vOq5Vbu9WVyPOq9vm+0NBgWuGaNW6vjumZE= github.com/hbstack/code-block-panel v0.1.2 h1:7ZW54ZA7tBNr5oQSWrBrAvEyXfm0Usk9+Nsp7X7Xhko= github.com/hbstack/code-block-panel v0.1.2/go.mod h1:VK2kn+hD3pr5HPz8izFAUyFG0lB/nXybe8ix5uc/LLs= -github.com/hbstack/content-panel v0.10.1 h1:DB0sg3nNWD4oy7RMCxe3xXYjAzhy3G58r6QlM324bEA= -github.com/hbstack/content-panel v0.10.1/go.mod h1:lEyMXJYCNHL6fkT260oX2FnXF6gD5Vd3EytifVuz3iQ= +github.com/hbstack/content-panel v0.10.2 h1:rga9bbr2hiFd0Lzuq36cZQ43yvTWr2s9+VyG/B1mCrw= github.com/hbstack/content-panel v0.10.2/go.mod h1:KwqGZkheSR7BfSBzuP13oAurMSaIh2atCeweNRFUUqA= -github.com/hbstack/docs v0.19.0 h1:cnIbIpLtfWIEfCov6KyJzKG0SnCXOYuTThHlfLRRfow= -github.com/hbstack/docs v0.19.0/go.mod h1:C58ZH20u3yjzwcZL4emE+HIYrudHPAd94/c/xZdqp1w= +github.com/hbstack/docs v0.20.1 h1:v/ByBrh8lvHpZ2q5hYPt30SUwEGSHT9W64fsLs4irJQ= github.com/hbstack/docs v0.20.1/go.mod h1:34Lnp91olEaYg2Ipbgx667U2EXz+aNRcPq7VUyYNook= github.com/hbstack/docs/modules/breadcrumb v0.1.10 h1:Ryp68WkRdOxL2UlGNYtN5ZJUxbbHv7bWe0NdzDt2Obg= github.com/hbstack/docs/modules/breadcrumb v0.1.10/go.mod h1:pTh43gl04dPERZZVDQ70KVU0j0Z4hmPK7GrxUfLw15s= @@ -102,8 +100,7 @@ github.com/hbstack/slide v0.4.0 h1:rWrbEmL1bKW1VF1coMtMblDUwzMvVcm1MgvauFX6vMg= github.com/hbstack/slide v0.4.0/go.mod h1:5LOWGyawNzSWFlW+3kuUBSrK15kottNvolEc7FVcYVg= github.com/hbstack/snackbar v0.1.2 h1:/9R2CdWnLcOBobxzdpe30cgM1gcKJAXtbVbZtp2pgmY= github.com/hbstack/snackbar v0.1.2/go.mod h1:4uZSGpI9ZtR9by0bA8yJW2y61sRks2W4a8VvyMluXuo= -github.com/hbstack/socials v0.16.0 h1:gR7NL/EBLQzqO31Tp/ITU7jtDuyDXfNskJyLtnpU0VM= -github.com/hbstack/socials v0.16.0/go.mod h1:9pfExMNoBMnQ0JV2ODURqUQsEC/HlgUo9b3jXdrHNM4= +github.com/hbstack/socials v0.17.0 h1:xa4CRhQNmN9QJzE3wVbeA2HZix4TYa8TE5FGxQT+8Zw= github.com/hbstack/socials v0.17.0/go.mod h1:bGfRrGxVWfvwseOzJ+13vHhHpZ+e+f2z8k4ypPBhH10= github.com/hbstack/syntax-highlighting v0.2.0 h1:BP5SR/AbVlJyAFtVdgYjeqVZKmncEmuplTR5R2AUbw8= github.com/hbstack/syntax-highlighting v0.2.0/go.mod h1:6IoaM+tSIkKZblIrT1i5L3zVH68nt4UScU9JB30FQsc= @@ -171,11 +168,9 @@ github.com/hugomods/seo/modules/translations v0.1.1 h1:FFgOHA5qtkHt1YuyYoLnicrka github.com/hugomods/seo/modules/translations v0.1.1/go.mod h1:ARboWQ31UeIwpB2AiN/efWLfplTTjarZRGEgKkkg3CA= github.com/hugomods/seo/modules/twitter-cards v0.1.1 h1:1cxNnftQ8MdajH48tB46DQ6eoCzrV1dQuVKLiKGFWwM= github.com/hugomods/seo/modules/twitter-cards v0.1.1/go.mod h1:KA6MA3GbyQZdd3vloDgcTFBoztmqEJI8R59whcSxpf4= -github.com/hugomods/shortcodes v0.22.0 h1:Qx8vNYgMyc/kAtuAJkJVazidBRZhBN3NEngJ/OEUWd4= -github.com/hugomods/shortcodes v0.22.0/go.mod h1:EnVopbZMNI/HeteM3Lp3phBTCRLvPSe7l142qhRFFPY= +github.com/hugomods/shortcodes v0.23.0 h1:ZB7bY7vvx917IkXg+ab08QD5H4biKzAsLKDMrWeoziI= github.com/hugomods/shortcodes v0.23.0/go.mod h1:EnVopbZMNI/HeteM3Lp3phBTCRLvPSe7l142qhRFFPY= -github.com/hugomods/simple-icons v13.13.0+incompatible h1:C5lhhP1BJb+b15uod07ykbeoCO46ssj2//gu0X5N0cs= -github.com/hugomods/simple-icons v13.13.0+incompatible/go.mod h1:1Lvymol7AMVY7ji/o88jMoDHHZIJ5Wc+WwNe5hjmk+U= +github.com/hugomods/simple-icons v13.14.0+incompatible h1:e9sqmoq9kUVYta3mmBsnu8+Adrtm19QNSnC0q1RIs+o= github.com/hugomods/simple-icons v13.14.0+incompatible/go.mod h1:1Lvymol7AMVY7ji/o88jMoDHHZIJ5Wc+WwNe5hjmk+U= github.com/hugomods/snackbar v0.1.2 h1:SLpfH9jlYwf81epH7DvM2XTZHo+3fXXpk6XKtxmo964= github.com/hugomods/snackbar v0.1.2/go.mod h1:ykFm0IFibeQPuPAm8Gaa27xJS/bNZcSez4omVSl2gQ0=