3 min read

The making of KLC Web 2.0

The making of KLC Web 2.0

Recently, someone told me, "Hey, the KLC Website doesn't look very nice". I looked at them and was like "Huh, what's wrong with it?". Well, since Liang Tze and I were the creators and designers of the website, maybe we just couldn't see the problem. Thus, I started coding a new website. The old website had many limitations, such as an insecure backend and authentication, when I wanted to implement such features. In the end, I decided to use another framework.

Tech/Framework Stack:

  • NextJS
  • Tailwind CSS
  • Framer Motion

Boom! The end! 😁

I spent about 2 hours learning Framer Motion as I had never used it before. After that, I went to terminal, typed npx create-next-app and there it was, the beautiful default template of NextJS right in front of my eyes. I changed the background to the usual KLC Background, downloaded the Framer Motion Package using NPM and started typing lines and lines and lines...(x100)... of code.

WakaTime - Dashboards for developers
Open source IDE plugins for programmers.

You can see the time I spent coding the KLC website. If you are reading this like 10 years later and WakaTime doesn't exist, or I deleted my account,t or something happened:

This is the amount of time I spent on the website in two days. (5hr on first day and 2hr on second day).

The Difficulties

  1. I wanted to move away from the original KLC website format, where there are white blocks for each section. However, for a good UI, it was almost impossible not to use it. I gave it another go and used it in moderation, and now I realise why the original website was not good. The original KLC Website used too many white blocks
  2. Using Motion. I entrusted the JetBrains IDE WebStorm a lot. When I used motion, that was when all the problems started pouring in. I was unable to type <motion. without pressing a lot of keys because Webstorm just would not recognise the motion tag in HTML via the package. Why WebStorm? WHY!!!!😭😭😭. I had to change to VSCode, which was the last thing I wanted. I DON'T HATE VSCODE. It is just that the VSCode UI is not very pleasing. They keep saying user interface for consumers. WHAT HAPPENED TO THE USER INTERFACE FOR DEVELOPERS? DO COMPANIES NOT CARE ABOUT THE DEVELOPER EXPERIENCE? (Ignore the screaming).
  3. Finding a new IDE. WebStorm let me down. I went through Cusor, Trae AI and more, I forgot the names, but I just stayed with VSCode, it was overall the best after JetBrains.

Thank you for reading! If you liked this, pls subscribe to my blog, thanks! If you want to support, pls pay $5/month or 🤑🤑🤑🤑$50/year. Don't actually pay, it's out as a joke. but if u want, no one is stopping you