enpitsulin

enpitsulin

这个人很懒,没有留下什么🤡
twitter
github
bilibili
nintendo switch
mastodon

Content migration from Sanity.io - the journey of a blog

In about who knows how many versions ago probably still using Next.js, the content of my articles was migrated from local file to this CMS called Sanity.io.

Sanity.io is actually great, but why did I migrate back now? Here, I want to talk about the journey of blog development.

Hexo Static Site#

From the beginning of building a blog, I didn't choose the traditional web page building method like Wordpress. Firstly, it's quite troublesome to have a server, and it's also prone to attacks. Secondly, I prefer a more geeky approach, so I chose a statically generated blog.

Actually, if you look back at the past articles, you can find that I initially used Hexo, but during this period, some of the earlier articles were lost 😥. Actually, Hexo is a very perfect static blog program. It has almost all the necessary features and a very good community environment.

But the problem is that for me, as a developer, the architecture of Hexo is basically composed of traditional templates + CSS + JavaScript. After I started working, this kind of architecture is no longer in demand even if I learn and tinker with it. Web development is gradually being replaced by frameworks like Vue and React, especially Vue, which is both new and old and is very popular in China.

So the blog moved towards a statically generated framework based on React. As for why it's not Vue, firstly, the Vue-based blog programs at that time were not good enough, and I mainly used Vue at work, so I wasn't interested in using Vue in my spare time.

Note: Now it seems that using tools like Nuxt.js and Vitepress to build a blog is already very good and can be considered as an option.

Embracing React#

Amazing Gatsby#

At first, I came across Gatsby, which is a relatively well-established website development framework. It can be said that using it to develop a static blog is like using a sledgehammer to crack a nut. However, I didn't save the source code at that time, which is a bit regrettable. It was the first project I practiced after mastering React.

But after using it for a while, I felt that Gatsby was too heavy for a small blogrelated article. At that time, my GitHub repository received strange dependency warnings, so I switched to Next.js.

But using Gatsby introduced me to a new knowledge, which is GraphQL. All the data in the blog (such as articles) is queried through GraphQL, which expanded my horizon beyond the basic exposure to Restful and JSONrpc at that time. This part of the experience was quite good.

Who is Next?#

After going around, I came to the king of the React ecosystem - Next.js. As a framework based on React, it also provides the ability of SSG. In fact, I only learned about SSG\SSR\CSR after using Gatsby.

The blog also moved to Vercel during this period. Previously, it was based on GitHub Pages, and I also briefly tried using GitHub Actions provided by GitHub for simple continuous integration of my blog.

As the top player in the React ecosystem, Next.js can be said to have no shortcomings. In this part of the blog source code, you can see that in the later stages, the content has been migrated from local markdown files to Sanity.io for hosting. It was quite challenging to use remote content while still having a complete MDX experience. There was also a period of time when I wanted to use Notion as a CMS, but the effect was not good, so I came to Sanity.io.

During this period, based on the improvement of my React skills, I gradually realized that React does have some cognitive burden, and there are also some architectural flaws in Next.js. The page system based on single files gradually confused the Node.js environment and the web environment. Next.js 13 brought App Router, which to some extent solved this problem, which is a cause for celebration.

So later, I briefly switched to vite-plugin-ssr.

Speed is the Key#

During the time of using Next.js, Vite emerged, and I was quite envious because webpack was indeed slow, and developing plugins was also troublesome. So I made up my mind to use vite-plugin-ssr to build my blog.

To be honest, it was a bit troublesome at first. I realized that an SSR framework had silently done so much for developers. It really made me cry.

So I spent some time using vite-plugin-ssr to replicate the blog of Next.js. The experience was actually quite good. Personally, I think both the DX and UX are top-notch. But then I encountered astro.

The Space Age#

With the development of front-end, there are more and more dazzling frameworks like remix, Qwik, and astro, which bring isolated architecture and are said to be very powerful.

I also followed the trend and came to astro. In fact, I had already come into contact with it when astro was not yet version 1.0, but it was not until the release of [email protected] that I officially migrated my blog to astro.

The feeling astro gives me is a return to simplicity, just like the experience of directly writing HTML+CSS+JavaScript. I implemented a large part of the functionality using native JavaScript, but the development experience it brings is very modern, based on Vite and with excellent TypeScript support. This gives me a feeling of both new and old.

Moreover, based on the integration with various UI frameworks, you can add Vue, Solid, and React, which is quite impressive. I think astro can be considered as a thin veil for various solutions I used before, regardless of DX or UX.

During this time, I also learned about Solid and added it as a UI framework to my blog. It doesn't have the cognitive burden of React in terms of responsive implementation, and I really think that compilation is indispensable in the frontend field. Sacrificing a small part of DX for performance improvement is actually quite good.

But I really don't understand memo and useCallback, after all, I don't have much exposure to React in my work, so I prefer to choose something that is not so difficult to learn in my spare time 😥. Maybe I should find a company that uses React

Migration of Article Content#

Actually, it's because remote markdown content cannot have a complete MDX experience, or I choose to sacrifice runtime 0JS, and astro indeed provides a much better integration experience for content.

And if I use Sanity.io, the workflow for writing articles becomes more complicated. As a geeky solution, based on Git, it's not too bad. Let the articles follow the repository through push/pull from now on.

Moving towards Web3#

Actually, recently I came across xLog, which is a blockchain-based blog. I highly recommend it to friends who have writing needs and want to step into Web3 as their first application, especially those who are not familiar with blog tinkering.

Actually, putting aside the theories about Web3 that are full of hype, blockchain technology is indeed the most primitive form of an open and free internet in my opinion. It is decentralized, without censorship, and based on consensus.

Although it is also filled with human nature and brings a lot of malice, it may be attractive to those who want a certain environment and simply need an uncensored writing platform.

Loading...
Ownership of this post data is guaranteed by blockchain and smart contracts to the creator alone.