New post: Self-Hosted VPN with Shadowsocks vmess and proxying via CDN

Add: Comments to posts
Modified: color scheme
Add: OpenGraph
Add: New category (Docker)

archetypes/default.md

@@ -1,5 +1,8 @@
-+++
+---
-title = '{{ replace .File.ContentBaseName "-" " " | title }}'
+draft: true
-date = {{ .Date }}
+title: '{{ replace .File.ContentBaseName "-" " " | title }}'
-draft = true
+date: '{{ .Date }}'
-+++
+tags: [ "tag"]
+categories:
+  - Category
+---

assets/scss/variables.scss

@@ -0,0 +1,167 @@
+$defaultTagBackgrounds: #8ea885, #df7988, #0177b8, #ffb900, #6b69d6;
+$defaultTagColors: #fff, #fff, #fff, #fff, #fff;
+
+/*
+*   Global style
+*/
+:root {
+    --main-top-padding: 35px;
+
+    @include respond(xl) {
+        --main-top-padding: 50px;
+    }
+
+    --body-background: #fffff0;
+
+    --accent-color: #34495e;
+    --accent-color-darker: #2c3e50;
+    --accent-color-text: #fff;
+    --body-text-color: #707070;
+
+    --tag-border-radius: 4px;
+
+    --section-separation: 40px;
+
+    --scrollbar-thumb: hsl(0, 0%, 85%);
+    --scrollbar-track: var(--body-background);
+
+    &[data-scheme="dark"] {
+        --body-background: #202020;
+        --accent-color: #ecf0f1;
+        --accent-color-darker: #bdc3c7;
+        --accent-color-text: #000;
+        --body-text-color: rgba(255, 255, 255, 0.7);
+        --scrollbar-thumb: hsl(0, 0%, 40%);
+        --scrollbar-track: var(--body-background);
+    }
+}
+
+/**
+*   Global font family
+*/
+:root {
+    --sys-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Droid Sans", "Helvetica Neue";
+    --zh-font-family: "PingFang SC", "Hiragino Sans GB", "Droid Sans Fallback", "Microsoft YaHei";
+
+    --base-font-family: "Lato", var(--sys-font-family), var(--zh-font-family), sans-serif;
+    --code-font-family: Menlo, Monaco, Consolas, "Courier New", var(--zh-font-family), monospace;
+}
+
+/*
+*   Card style
+*/
+:root {
+    --card-background: #fff;
+    --card-background-selected: #eaeaea;
+
+    --card-text-color-main: #000;
+    --card-text-color-secondary: #747474;
+    --card-text-color-tertiary: #767676;
+    --card-separator-color: rgba(218, 218, 218, 0.5);
+
+    --card-border-radius: 10px;
+
+    --card-padding: 20px;
+
+    @include respond(md) {
+        --card-padding: 25px;
+    }
+
+    @include respond(xl) {
+        --card-padding: 30px;
+    }
+
+    --small-card-padding: 25px 20px;
+
+    @include respond(md) {
+        --small-card-padding: 25px;
+    }
+
+    &[data-scheme="dark"] {
+        --card-background: #424242;
+        --card-background-selected: rgba(255, 255, 255, 0.16);
+        --card-text-color-main: rgba(255, 255, 255, 0.9);
+        --card-text-color-secondary: rgba(255, 255, 255, 0.7);
+        --card-text-color-tertiary: rgba(255, 255, 255, 0.5);
+        --card-separator-color: rgba(255, 255, 255, 0.12);
+    }
+}
+
+/**
+*   Article content font settings
+*/
+:root {
+    --article-font-family: var(--base-font-family);
+    --article-font-size: 1.6rem;
+
+    @include respond(md) {
+        --article-font-size: 1.7rem;
+    }
+
+    --article-line-height: 1.85;
+}
+
+/*
+*   Article content style
+*/
+:root {
+    --blockquote-border-size: 4px;
+    --blockquote-background-color: rgb(248 248 248);
+
+    --heading-border-size: 4px;
+
+    --link-background-color: 189, 195, 199;
+    --link-background-opacity: 0.5;
+    --link-background-opacity-hover: 0.7;
+
+    --pre-background-color: #272822;
+    --pre-text-color: #f8f8f2;
+
+    --code-background-color: rgba(0, 0, 0, 0.12);
+    --code-text-color: #808080;
+
+    --table-border-color: #dadada;
+    --tr-even-background-color: #efefee;
+
+    --kbd-border-color: #dadada;
+
+    &[data-scheme="dark"] {
+        --code-background-color: #272822;
+        --code-text-color: rgba(255, 255, 255, 0.9);
+
+        --table-border-color: #717171;
+        --tr-even-background-color: #545454;
+
+        --blockquote-background-color: rgb(75 75 75);
+    }
+}
+
+/*
+*   Shadow style
+*   Thanks to https://www.figma.com/community/plugin/744987207861965946/Shadow-picker
+*/
+:root {
+    --shadow-l1: 0px 4px 8px rgba(0, 0, 0, 0.04), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 0px 1px rgba(0, 0, 0, 0.04);
+    --shadow-l2: 0px 10px 20px rgba(0, 0, 0, 0.04), 0px 2px 6px rgba(0, 0, 0, 0.04), 0px 0px 1px rgba(0, 0, 0, 0.04);
+    --shadow-l3: 0px 10px 20px rgba(0, 0, 0, 0.04), 0px 2px 6px rgba(0, 0, 0, 0.04), 0px 0px 1px rgba(0, 0, 0, 0.04);
+    --shadow-l4: 0px 24px 32px rgba(0, 0, 0, 0.04), 0px 16px 24px rgba(0, 0, 0, 0.04), 0px 4px 8px rgba(0, 0, 0, 0.04),
+        0px 0px 1px rgba(0, 0, 0, 0.04);
+}
+
+[data-scheme="light"] {
+    --pre-text-color: #272822;
+    --pre-background-color: #fafafa;
+    @import "partials/highlight/light.scss";
+}
+
+[data-scheme="dark"] {
+    --pre-text-color: #f8f8f2;
+    --pre-background-color: #272822;
+    @import "partials/highlight/dark.scss";
+}
+
+:root {
+    --menu-icon-separation: 40px;
+    --container-padding: 15px;
+    --widget-separation: var(--section-separation);
+}

config.yml

@@ -37,11 +37,21 @@ menu:
         newTab: true
 
 permalinks:
-  post: /p/:slug/
+  post: /post/:slug/
   page: /:slug/
 
 params:
   favicon: /favicon.ico
+  defaultImage:
+    opengraph:
+      enabled: true
+      local: true
+      src: "img/opengraph_default.png"
+  imageProcessing:
+      cover:
+          enabled: true
+      content:
+          enabled: true
   mainSections:
         - post
   featuredImageField: image
@@ -70,3 +80,16 @@ params:
           limit: 10
     page:
       - type: toc
+  comments:
+    enabled: true
+    provider: giscus
+    giscus:
+      repo: "radiquum/blog"
+      repoID: "R_kgDOLcLtlA"
+      category: "Announcements"
+      categoryID: "DIC_kwDOLcLtlM4Cdw10"
+      mapping: "title"
+      lightTheme: "light"
+      darkTheme: "dark_dimmed"
+      reactionsEnabled: 1
+      emitMetadata: 0

content/categories/Docker/_index.md

@@ -0,0 +1,9 @@
+---
+title: "Docker"
+description: "docker"
+slug: "docker"
+image: "docker.svg"
+style:
+    background: "#066da5"
+    color: "#fff"
+---

content/categories/Docker/docker.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg xmlns="http://www.w3.org/2000/svg"
+aria-label="Docker" role="img"
+viewBox="0 0 512 512"><rect
+width="512" height="512"
+rx="15%"
+fill="#ffffff"/><path stroke="#066da5" stroke-width="38" d="M296 226h42m-92 0h42m-91 0h42m-91 0h41m-91 0h42m8-46h41m8 0h42m7 0h42m-42-46h42"/><path fill="#066da5" d="m472 228s-18-17-55-11c-4-29-35-46-35-46s-29 35-8 74c-6 3-16 7-31 7H68c-5 19-5 145 133 145 99 0 173-46 208-130 52 4 63-39 63-39"/></svg>

content/post/self-hosted_VPN_with_Shadowsocks_VLess_and_proxying_via_cloudflare.md

@@ -0,0 +1,118 @@
+---
+draft: false
+title: 'Self-Hosted VPN with Shadowsocks vmess and proxying via CDN'
+date: '2024-03-06T02:05:18+05:00'
+tags: ["guide"]
+categories:
+  - Docker
+---
+
+This post will be a simple instruction how to install ShadowSocks Proxy via docker and use it with vmess, also proxing it through CDN network via websockets.
+
+## how it works
+
+```md
+(Client) <-> [ CDN Service ] <-> [ Upstream Server ] <-> (Internet)
+```
+
+## what we will use
+
+- [v2ray docker compose](https://github.com/miladrahimi/v2ray-docker-compose)
+- [caddy docker proxy](https://github.com/lucaslorentz/caddy-docker-proxy)
+- CDN Service: A Content delivery network like [Cloudflare](https://cloudflare.com/), [ArvanCloud](https://arvancloud.ir/) or [DerakCloud](https://derak.cloud/).
+
+check the CDN [free plans](https://github.com/miladrahimi/v2ray-docker-compose/discussions/89), and choose suitable for you.
+
+This guide assumes you are using CloudFlare as your domain CDN and DNS managment. It will allow to auto provision ssl without any setup and cloudflare have more servers in its infrastructure.
+
+## Requirements
+
+- Linux VPS or any other server with linux and dedicated IP.
+- Installed git, docker and docker compose plugin.
+- Domain name connected to CDN.
+- Python 3
+
+## Preparations
+
+1. In your CDN, create an `A` record pointing to your server IP with the proxy option turned off.
+
+2. Clone v2ray-docker-compose repo to your server.
+
+   ```sh
+    git clone https://github.com/lucaslorentz/caddy-docker-proxy
+    ```
+
+3. Run `v2ray-docker-compose/utils/bbr.sh` to speed up server network.
+
+4. copy `v2ray` folder and `vmess.py` file to desired folder from `v2ray-docker-compose/v2ray-caddy-cdn/`.
+
+5. Generate a UUID via
+
+    ```sh
+    cat /proc/sys/kernel/random/uuid
+    ```
+
+6. Replace `<UPSTREAM-UUID>` in `v2ray/config/config.json` with the generated UUID.
+
+7. replace `domain = caddy[:caddy.find(' {')]` in `vmess.py` to `domain = <YOUR-DOMAIN>`.
+
+## ShadowSocks vmess installation
+
+1. create a `docker-compose.yml` file, open with text editor and paste the following:
+
+    ```yml
+    version: '3.3'
+    networks:
+      default:
+        name: 'proxy_network'
+    services:
+      caddy:
+        image: "lucaslorentz/caddy-docker-proxy:ci-alpine"
+        ports:
+          - "80:80"
+          - "80:80/udp"
+          - "443:443"
+          - "443:443/udp"
+        volumes:
+          - /var/run/docker.sock:/var/run/docker.sock:ro
+          - /srv/caddy/:/data
+        restart: unless-stopped
+        environment:
+          - CADDY_INGRESS_NETWORKS=proxy_network
+      v2ray:
+        image: ghcr.io/getimages/v2fly-core:v4.45.2
+        restart: always
+        environment:
+          - v2ray.vmess.aead.forced=false
+        volumes:
+          - ./v2ray/config/:/etc/v2ray/
+          - ./v2ray/logs:/var/log/v2ray/
+        ports:
+          - "127.0.0.1:1310:1310"
+          - "127.0.0.1:1310:1310/udp"
+        labels:
+          caddy: http://<YOUR-DOMAIN>
+          caddy.reverse_proxy: "http://v2ray:1310"
+    ```
+
+2. Run `docker-compose up -d`.
+
+3. In your CDN, turn the proxy option on for the record.
+
+4. Run `python3 ./vmess.py` to generate client configuration (link).
+
+you may want to allow ports 80 (tcp + udp) and 443 (tcp + udp) in your server firewall.
+
+## How to connect
+
+copy the generated link and import it as a configuration url in the client application.
+
+### Client Applications
+
+This is the list of recommended applications to use the VMESS protocol:
+
+- [Nekoray](https://github.com/MatsuriDayo/nekoray/releases) for Windows, and Linux.
+- [Nekobox](https://github.com/MatsuriDayo/NekoBoxForAndroid) for Android
+- [v2rayNG](https://github.com/2dust/v2rayNG) for Android
+- [Nekoray - macOS](https://github.com/abbasnaqdi/nekoray-macos/releases) for MacOS
+- [ShadowLink](https://apps.apple.com/us/app/shadowlink-shadowsocks-vpn/id1439686518) for iOS