I recently started a personal blog. Without using platforms like WordPress or Hatena, I developed it from scratch using Next.js (including the Markdown editor I'm typing this in). It's well known that engineers' blog development can never be published, and I was about to fall into that trap myself. (Initially, I was going to set up a GraphQL server and receive it with Apollo Client... but I stopped that.)

For the tech stack, I'm using:

• Next.js (SSG)
• TypeScript
• Chakra
• Supabase

Next.js's SSG on Vercel is incredibly fast. Coming from a background of developing with Rails templates, I'm amazed at how quickly a Jamstack site can be delivered through Vercel's edge network CDN.

Additionally, development with Chakra UI has excellent developer experience. Most components are provided, and using those components allows you to implement most UI requirements.

This blog also supports dark mode, and with Chakra, theming for that is straightforward:

1import { extendTheme } from '@chakra-ui/react';
2const config = {
3  initialColorMode: 'dark',
4  useSystemColorMode: true
5};
6const theme = extendTheme({ config });
7const MyApp = ({ Component, pageProps }) => {
8  return (
9    <ChakraProvider theme={theme}>
10      <Component {...pageProps} />
11    </ChakraProvider>
12  );
13};

It's like a combination of Tailwind and Emotion, I guess. Personally, I find Chakra more intuitive and easier to write CSS injections compared to Tailwind, and component implementation is extremely simple, so I really like it.

This site is open source on GitHub, so contributions are welcome! 👨‍🦰 https://github.com/NagaiKoki/blog