总结一下 WireGuard 的配置方法，以免长时间不用忘记。

主要包含以下内容：

• 关键概念
• 使用 wg-quick
• 实际场景例子

文章基于 Arch Linux，理论上适用于所有 Linux 发行版。

今天在 medium 看到一篇关于 Google Photos 的文章，里面详细的介绍了谷歌的一名工程师是如何设计 Google Photos 的布局的，文章地址：Building the Google Photos Web UI。

观察了一下 Google Photos 的布局，发现它的布局非常的有意思，有以下特点：

• 一行图片的宽度始终刚好占满容器宽度
• 图片全部保持原始比例，不会被拉伸
• 图片的高度不一，但是每一行的高度是一样的
• 图片顺序不会被改变

感觉很神奇，但是那篇文章里的实现方法太过复杂，虽然性能非常好，但是我觉得可以用更简单的方法来实现，于是就有了这篇文章。

不知道大家有没有遇到过这样的问题，就是在 Next.js 中使用暗黑模式时，页面会闪烁一下，这是因为 Next.js 会在服务端渲染时并不知道用户是否选择了黑暗模式（比如我一般将这个变量存在 window.localStorage 里），所以所以在用户接收到页面之前，页面会先显示一下默认的样式，然后再根据用户的选择来渲染暗黑模式的样式，这样就会导致页面闪烁。

在使用 CSS in JS 的时候这种闪烁尤为明显，例如 MUI 的官网。一般网站都会默认使用亮色主题，但我又倾向于使用暗黑模式，所以经常看到这种闪烁。我认为这真的很影响用户体验，至少我自己看得很难受。

本文主要介绍如何使用 Traefik 作为 Docker 的反向代理，以及如何使用 Traefik 配置自动 HTTPS。但是，在写这篇文章时有感而发，先聊聊我对建网站，或者说自学 linux 的一些历程吧。想直达重点的点这里跳转。

还记得最开始使用云服务器的时候，租了个阿里云的学生机，当时就想建个博客玩玩，一顿搜索，发现网上全在推荐使用 WordPress。但是当时还是小白啊，只会 ls cat 的那种，安装 PHP 和 Apache 几乎是不可能的，再加上网上一堆教程动不动就手动编译安装，我当时连 yum 都不会用，怎么可能编译安成果嘛。

一直很好奇 React 官网的在线编辑器是如何实现的，于是稍微研究了一下，通过 TypeScript 和 Babel 实现在浏览器中编译 React。

这个项目本身也是使用 TypeScript, Webpack 和 Babel 构建的，源码在 react-online - Skyone Git。

在上一篇文章中，我记录了如何安装ArchLinux，这篇文章写一下如何安装GNOME桌面，以及一些常用软件。

众所周知，ArchLinux是一个滚动更新的发行版，所以在安装完系统后，需要手动安装桌面环境和一些常用软件。

Linux下的桌面环境有很多，比如GNOME、KDE、Xfce、LXDE、LXQt等等， 这里我选择安装GNOME桌面，因为GNOME不需要太多配置，而且我也比较喜欢GNOME类似的设计风格。此外，GNOME还包含一个基于flatpak的应用商店，当想使用一些基于KDE的应用又不想破坏系统的时候，可以使用flatpak安装。

除了桌面环境，还需要安装一些常用软件，比如浏览器、音乐播放器、视频播放器、输入法等等。

话不多说，让我们开始吧。

Windows 10 用了也有好几年了，最近用的有点腻了，这次折腾一下 ArchLinux。搞个双系统，也顺便检验一下自己的 Linux 水平。

都说 ArchLinux 安装有点难度，需要手动安装所有系统组件，但是我觉得还好，只要按照 Wiki 上的步骤一步一步来，就不会出什么问题。之前一直拿 ArchLinux 的 LiveCD 模式在虚拟机里面折腾，这次直接在实体机上安装 ArchLinux 并包含桌面环境。

Markdown是一种几乎万能的标记语言，它能让我们以简单的语法写出很好看的文章。但是markdown源码只是一串纯文本字符串，我们需要将他渲染成HTML、word、PDF等格式才能更好的供人阅读。下面我将记录一下我是如何使用 remark 一系列的库实现将 markdown 渲染成 HTML，并提供自定义标记。