My new portfolio! The beginning...

It is finally here. My new portfolio website.

Over the year, I have been spending a lot of time building the CRM (Customer Relation Management) webb application for a business that I started with my friends Talaria Order. And guess that, it is still not finished yet! But do not worry, I have it under control and will be finishing it in the next month or so (definitely!)

But let's not talk about things of the past. Let's talk about the future.

And here I present to you my new portfolio website, something that I have been desiring to build, but kept telling myself I don't have the time.

Now, after a whole of week Spring Break, really one whole week, a website that I estimated to be finished within 2 - 3 days max, has finally reached it deployment stage. For the purposes of this introductory blog post, I will talk a little bit about my old website, why I decided to migrate to a new site built with Gatsby.js, and my plan for the future with this blog :blush:.

My old portfolio

My old portfolio was built after I learned the basics of HTML, CSS, and Javascript. Unlike this new one, it was a pretty simple website. The webiste was built with Vanilla Javascript, bundled using Webpack, and compiled using Babel. It was also a my first fully functional, responsive website that I built by myself after getting out of the tutorial hell. After going through a lot of HTML/CSS/Javascript tutorial by the best teachers online, I finally got the courage to step up and build my own portfolio website. I am really proud of myself for taking such action.

However, all good things must come to an end.

Even though it serves its role as the first personal website, it could not offer amazing functionalities that Gatsby.js can do (which I will talk about in a moment). Also, the design of the website is something that prompts me to make a refresh. It was not because it does not look good anymore, but it was because I wanted to make something that looked cleaner, and more functional.

With the desire to start writing blog posts (like this first one), I had planned to rebuild my portfolio for a while, but I kept telling myself that I would do it later. Then later almost became never. Fortunately, listening to some podcasts recently has finally inspired me to take my first move.

The first step is to start...

And here comes my new portfolio, and the reasons why I chose Gatsby.js

New portfolio and its tech stacks

Gatsby.js for static page generation

Thanks to the effort and performance focus of the Gatsby.js team, the site generated is super fast. Not only that, it also comes with gatsby-image that automatically optimize your images and lazy load it on page load. If before, I had to optimize my images using another software, now I just need to pull them using GraphQL and Gatsby will handle everything from there. It works like magic under the hood. How cool is that!
Gatsby.js also comes with an extensive open source ecosystem. With 2714 plugins(as the time of this writing), Gatsby.js offer you most of the use cases you ever need such as data loading, data transformation ...
Gatsby.js comes with easy to understand documentation. It was extremely easy to get going with Gatsby.js by going through the documentation, as it covers most of what you need to get up and running. After that, it is easy to refer back while building the page too!

MDX for blog posts

All of my blog posts will be written in Markdown, so that it is easy to embed React components inside, where I might need such as graphs, videos,... in the future.

I would not recommend other non-tech people to go through this route since it is pretty difficult to start at first. For them, I would suggest using a headless CMS like Sanity.io

Where to go from here

Re-evaluate my projects

Before doing anything else, I believe it would be best to take a closer look at my old projects and re-evaluate them. One of the reasons is so that I can talk about it more smoothly in case my future employers want to ask about them.