不知道大家有没有遇到过这样的问题，就是在 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，并提供自定义标记。

2023，又是新的一年啦！

过年在家闲着没事翻了翻GitHub，发现一个叫 docusaurus 的文档生成器， facebook 开源的前端项目，又使用 React + Markdown，就建了个玩玩。

翻文档的时候发现 docusaurus 还可以生成静态博客！联想到原来的博客已经半年没更新了😂，于是准备上手试试，可以的话就把文章迁移到 docusaurus 。一试不要紧， docusaurus 使用的 Markdown 拓展语法 MDX 把我吓了一跳 原谅我的孤陋寡闻…… MDX 支持在 Markdown 里写 React！

下面就来展示一下 MDX 语法能干些啥吧~~

Hello Docusaurus !

想静态编译一个 Node.js 打包成 Google Distroless 容器，但编译的时候遇到一些问题，不过为了照顾没有编译过源代码的同学，还是一步一步介绍。最终成果：

注：本文仅面向Linux系统