Blog DLog Service Development Review

Why I Started Developing a Blog

I had a development blog operated based on GitHub Pages, but I decided to create my own blog. This was because uploading posts by pushing code to GitHub was cumbersome. I thought that by developing it myself, I could effectively improve the inconveniences I faced while managing the blog.

For example, I could implement a feature to provide different blog content based on the visitor's language. This means showing content automatically translated into English for English-speaking users and into Korean for Korean users. Previously, the quality of translation APIs was unsatisfactory, but with the advancement of ChatGPT, high-quality translations are now possible.

Moreover, the joy of developing and operating a service myself is a major reason. Software is in a continuous process of improvement rather than staying in a finished form. By developing it myself, I can immediately address any inconveniences I encounter while using it and freely add necessary features to enhance it. For these reasons, I decided to create and operate my blog myself.

Development Schedule

It took a total of 2 weeks from the start of development to completion. The main reason why I was able to complete the development quickly compared to the scale of the service was the help of AI. By using the Composer feature of CURSOR IDE to guide the direction of coding, the development time was significantly reduced.

Although I spent about $40 (basic subscription fee of $20 + additional fee of $20) for using the CURSOR IDE API, considering the saved time, it was a worthwhile investment.

Tech Stack

As SEO is important for a blog service, I chose Next.js, which strongly supports SSR, as the frontend framework. Additionally, I maximized development productivity by applying TypeScript and TailwindCSS together.

For the backend, I built it using the lightweight and high-performance combination of Go and MongoDB, and I plan to introduce Redis in the future for even more efficient improvements.

For CI/CD, I used GitHub Actions to build Docker images, uploaded them to a personal Harbor Docker registry, and configured them to run on a locally installed server. Although using AWS would be more convenient, the cost was high, so I reset my existing gaming PC, installed Ubuntu on Proxmox, connected a UPS, and am operating it that way.

Image resources are served through integration with AWS CloudFront and S3.

Major Libraries Used

• TipTap (Open-source editor library)
  Traditional markdown editors require inputting markdown on the left and providing a preview on the right. However, using TipTap allows applying styles directly like Notion, providing a more intuitive user experience.
• next-i18next (Multilingual support library)
  It is a representative library that helps easily implement multilingual features in Next.js. In the current project, we are managing translation data from Google Sheets.

Introduction of Service Features

• Styled editing feature

  Since the core of a blog service is content, the content creation and editing feature should be intuitive and easy to use. To make it easy for both developers and general users, we support a styled editor using the TipTap library. Additionally, we added keyboard shortcuts to provide convenient functions such as moving to the editing page by pressing the E key like in Confluence, enhancing the user experience.

  

• Automatic translation level

  If one post can be automatically translated into multiple languages, the author can communicate more easily with people from various countries. The goal is to increase the convenience of the post author. A list of supported languages is displayed at the top of each post, and when a user selects the desired language, pre-translated content is provided.

  

• Username-based address setting

  Like YouTube, we set up each blog so that it can be accessed with the user's username, in the form of <https://blog.danver.io/@0921pig>. We made efforts to provide a more intuitive and easy-to-understand URL structure. In the future, we plan to support a feature where users can set custom domains themselves.

In Conclusion

As this project was developed alone in a short period of 2 weeks, there are still many areas that need improvement. I plan to compile improvement points discovered while using it and continuously enhance them.

However, I am also concerned that as the number of projects to manage increases, I may miss some aspects. To address this, I plan to use ClickUp to systematically manage project schedules. I want to enjoy the process of efficiently progressing and further developing the blog. 🚀