Learning Blog Development with Next.js, Vercel and Tailwind CSS
I have decided to officially start my own personal website, which will have a blog where I write up projects I am working on and will have links to relevant professional websites such as LinkedIn and GitHub. I will import old blog posts as well. To develop this website I am using and learning more about Next.js, Vercel, and Tailwind CSS. Since I already have experience with JavaScript, Node, React, CSS, and HTML, developing with Next.js, Vercel, and Tailwind CSS was relatively straightforward. I developed this website in a Windows environment using Visual Studio Code, which has some helpful extensions.
Next.js
Next.js is a React framework that allows developers to create full-stack web applications. Currently Next.js requires Node.js 16.8 or later, which was easy to confirm on windows using the node -v command. Next.js has a logical project structure and is very well documented. I could have installed Next.js using their installation documentation, but because I knew I wanted to build and host my website with Vercel I decided to use their installation documentation, which was specifically related to the template I wanted to try out.
Vercel
Vercel is a platform that works in conjunction with Next.js to build and host websites. Vercel has multiple available templates available on GitHub. At first I investigated the blog template, but finally decided to use the blog-starter template. My decision was effected by the way each blog template utlized themeing. In the blog template the theme was not well documented, at least at the time of writing. The blog-starter template, however, uses Tailwind CSS, which is well documented and looked like it would be really fun to learn.
Tailwind CSS
Tailwind CSS is a framework that allows for developer-friendly web design. Learning how to format with Tailwind CSS has been relatively easy so far as it is well documented and Visual Studio code has a very helpful extension called Tailwind CSS IntelliSense, which I am using.
