Projects

This project is to build my portfolio website, which is here, where I will be sharing information about me, such as projects and education, basically an elaborate version of the resume. The project is relatively simple but the crux is the designing part. Designing a good website with mobile responsiveness is really tough for me who does not have a multimedia background nor any designing experience.

I started out building my own blogging website to record down fun experience in my life as memories are fleeting. Furthermore, it also aimed at brodening my horizon into intriguing topics that are unrelated to technology while continuously improving and consolidating my writing skills in various languages. It takes a lot of effort (~7 days) to plan, outline, write, enhance and proofreading to ensure quality of a blog post. As a result, I post relatively slowly as I did not have the time solely dedicated for writing. However, I hope that the time to deliver will change as my language competency improves.

Book is a project that I use to document technical topics that I learned in the form of tutorials, notes and cheatsheets. As I am obsessed with learning new stuffs, I am mindful that there are just too much things to learn and it is impossible to keep everything in memory all the time.

Hence, I wanted a place to store and manage the info that I've came across so that I can refer them back in the future when needed. This also helps me to have a better picture to the topic that I am trying to pick up as it forces me to dive deeper to disambiguate my superficial understanding. Also, by putting it online, I hope that this will benefit others as well.

This project started out as a simple project where I want to build a aesthetically pleasing UI around the Hackernews API as the UI in the actual website is something looks like from the 1990s. However, I took me over 2 years+ and I have yet to complete this project. This effectively shows how busy (lazy) I am. I referenced the slick black and white newspaper themed UI from The New York Times and it was outstanding. I have added the "favourite" and "read later" feature that is persisted via Firebase for the users.

A static website that displays the business information for TT Wellness Healthcare Centre @ TT Clinic. This is my first freelance project and I am grateful for the opportunity. Feature includes internationalization for English and Chinese translation, mobile responsive and SEO.

One thing that I am very proud of is the Google lighthouse score for the website. The home page scored 98 for performance, 95 for accessibility, 100 for best practices and 100 for SEO when I last measured. However, I will still improve the website from these aspects when I see the opportunity.

Positron+ is a web application that allows user to send Ethereum to another user along with a random GIF as well as a piece of message that will be persisted on the Ethereum blockchain via a smart contract. It started out as a code along project with a tutorial by Mastering JS on Youtube. However as I follow along, I decide to develop my way by redesigning the UI and using another smart contract framework.

The smart contract for the project is not deployed anywhere in the network and I only tested it a local testnet running on my machine.

This is a simple project to mint images as NFT on the Avalanche blockchain. The idea sparkled from a challenge on StackUp platform but then I decided to make use of what I learned on minting NFT to this project. The smart contract was deployed to the Avalanche Fuji testnet and the images for NFT minted were stored in Pinata IPFS.

A template project to kickstart my React development. One day while I was working with a dApps with front-end bootstrapped with create-react-app. Not to mention cra is bloated and unwieldy, I faced some irritating issue while integrating the decentralized wallet.

One of tne cryptic errors confronted being Buffer not found. I spent quite some time to rectify the issue but to no avail and I gave up eventually. I tried Vite but also faced the the same problem. Confused and disgruntled, I decided to create my own React app from scratch.

This template has included a lot of tools and utilities that I find it useful for developing with React and hence it is heavy and opionionated.

A template project that started out as an experiment back in 2021 to play around with ReScript. The template was using create-react-app when first started out and it was awfully simple with just a hello world in the home page. No further development after the initial version and the repo was pretty much forsaken since then.

On December 2022, when I was reminded about ReScript on Youtube, I revisited the template and decided to ditch everything including create-react-app and reconstruct anew with better tooling such as esbuild, Tailwind CSS and the latest version of React.

Yet another template project but with the purpose of creating aesthetically pleasing documentation sites. It comes with dark mode, Markdown (in MDC) to HTML converter and also supports LaTeX for writing profound mathematical equations.

This template is using Vue v3 with Composition API and Nuxt v3.

An experimental React template written with F# and JavaScript. The F# code is transpiled to JavaScript by the Fable compiler and Feliz for React bindings. Esbuild is used to compile the generated JavaScript files into a bundle. There are still a lot of bugs and missing features at the moment.

A starter template for building robust web application with Elm. Contains all the necessary development scripts for starting out. It is blazingly fast and it supports HMR. To top it off, TailwindCSS is configured with VSCode intellisense for class autocompletion.

E-learning Platform for Distanced Collaborative Coding Assignments is a web-application aimed to provide a universal platform for students and lecturers to interact with each other effortlessly for coding-based assignments. This is the final year project of my studies at my university.

The project proposal was made to outline and review all the requirements, technology, workflow and design during the initial planning phase that tooks about three months and the actual implementation of the system takes another three months to complete. Although the entire process of developing this system is arduous and tiresome, I am flattered that I am rewarded an A- grade for this.

The core feature of this application is the concurrent code editor that allows students to program together in a group in real-time. It also provides a chatting system for the students to discuss by interact with each other with text messages. Besides, this application has a very strict rule on governing the relationships between different entities such as one student can join many course, one course can have many assignments etc. This is extremely important but the most cumbersome part to implement.

Ignite de Spark was the last event that committees of my society had put our heart and soul into before we retire and this website was made to promote the event by providing every single bits of details of the event and a call for action to a Google form for registration. This website was the first-ever project that I've done apart from assignments. Hence, the quality is substandard but I was proud of myself. Unfortunately, due to the unforeseen outbreak of pandemic in the world, the event was canceled and the website had never been to light.

This project is about displaying the latest covid data and trends worldwide all within a single page. Development started on June 2021, after I had my final semester in the university. I came across the covid API by mathdroid and thought it would be great to start a project with it. The application has a section where users can choose a country to view its infection, recover and death case for that particular day with a interactive Pie chart.

It went great until early 2022 where data for recovered case was no longer provided. As of 2023, the entire covid API has been discontinued and is no longer available for use. As a result, the site is currently broken and devoid of data. I am plotting to take down the website in the near future.

As an aspiring developer that is always on the go to learn and build stuffs, I found myself struggling to navigate between the useful sites and resources quickly. To read the docs for TailwindCSS, I will need to open up a new tab, insert the URL manually or Google to navigate to the site. If I want to access Vue.js docs, I will need to repeat the same process. It gets tedious as time goes and sometimes I wonder wouldn't it be phenomenal to have a page that has everything I need inside? That way, I can navigate around with east and less ceremony.

This project started out with a intention to replace my browser's new tab page, or become the home page. However, I found myself not using it as much as I thought I would. There are more facets to be improved and implemented before I can consider it useful. Albeit underwhelming, it was a great attempt and I still treasures the things I've learnt during the development.