Nuxt.js Vue.js Buefy Bulma Markdown HTML JavaScript CSS

blog

My personal website and blog.

Tuesday, February 16, 2021, 12:00:00 AM PST
GitHub

This website here, aptly named blog, is my personal website. I built it in order to host content about my personal and professional projects, as well as my blog. I also built it as an excuse to practice some of the web development skills I learned during the COVID-19 pandemic in 2020.

For the implementation, I went with a statically generated website built using the Nuxt.js framework for the frontend and the @nuxt/content (content) module CMS. Going with this implementation had several advantages. First, posts are formatted and stored in Markdown. This allows post content to be decoupled from the layout of the website. Second, there is no database to manage and in turn, no database security concerns to contend with. Third, since Nuxt.js is built on top of Vue.js, it is easy to reuse code by defining custom reusable components using HTML, JavaScript, and CSS. Fourth, using Nuxt.js and Vue.js does not require me to learn a new programming language (e.g., Ruby, Go, etc.). Finally, the website is static, so it can be hosted free of charge on GitHub Pages.

As for the layout, I went with a plain and simple responsive UI built using the Buefy and Bulma CSS frameworks. Buefy was chosen for its integration with Nuxt.js while Bulma was chosen for its ease of use (Bulma is a CSS-only framework) and customizability. Other CSS frameworks were also considered. In particular, I felt Vuetify was too rigid and I felt Bootstrap-Vue was not intuitive to use.