Photo From Unsplash by Annie Spratt

Have you ever joined a hackathon?

A week ago, my answer would have been no, even though I have been a full-time developer for more than 5 years. The thought of spending the whole weekend not sleeping and only coding scared me. I love my sleep! That, and the fact that I don’t know anyone who has participated in a hackathon, discouraged me.

Like many people, I have been reading about Bitcoin, Ethereum, and blockchain-related information lately. I have read a few whitepapers, learnt about smart contracts and decentralised finance, and studied liquidity pools, impermanent loss, yield farming, etc. Down…


Icons made by Freepik from www.flaticon.com

With React and Vue being the dominant players in the frontend field, most developers are reluctant to try out other frameworks (or libraries, the line is quite blurry with the current state of the web). I have always been a fan of framework-less approaches whenever possible and reasonable, so when Web Components debuted on Chrome, I was excited to play around with them without any frameworks to see what it was about. Needless to say, it was all very vanilla and hard to scale for production apps. …


Photo from Unsplash by Harpal Singh

Ask anyone who has worked with me, and you would know I am an advocate of front-end component libraries. Be it in React, Vue, Angular, or even Vanilla JavaScript, I believe the future of web lies in component libraries.

But today I am here to tell you this — sometimes you shouldn’t build a component library. If you have read some of my articles about product development, you would think I am contradicting myself because I insisted on building the minimum viable product in a technically scalable and maintainable way, with a component library of course. So according to me…


Photo by Farzad Nazifi on Unsplash

When your startup is experimenting with an idea, you need to find if people would pay for what you offer. At this stage, what you want is most likely a Minimum Viable Product (MVP) that works, not perfectly, but one that works well enough to be delivered to the market right away to find its product/market fit.

There are two major fates of the MVP:

  1. If the product doesn’t have a decent product/market fit, it will be abandoned, which is mostly the case for startups.
  2. If the product finds its product/market fit, it will be iterated. New features will be…


Not all JavaScript developers get excited when ECMAScript has a new release. It can be annoying to be expected to continually learn new syntax, but it is definitely worth the effort for a smoother development experience. I am surprised by the number of developers around me who haven’t tried out ES6 yet, and so I am here to convince these developers to adopt the new syntax.

There are plenty of articles and tutorials on the full list of ES6 (ES2015). …


The TextField component we are going to create as shown on my CodePen demo / GitHub demo

From simple .css files to sassy .scss files, and to the CSS in JS styled-components, web developers have come a long way in styling the web.

Building a component library with React doesn’t mean you must include styled-components. You can still use plain CSS, or SCSS files that would be compiled into CSS, or CSS modules, or even inline styles. There is not any standard for your approach to styling your elements, but in general the React community favours CSS in JS solutions, probably due to the fact that React is a framework driven heavily by JavaScript, and there are…


I know some developers who are blessedly good at coding and good at being a tutor at the same time, yet very few of them would pick up the pen (or type out on their keyboard) for technical topics they are enthusiastic about. If you are one of them, I think you are seriously missing out, and I am here to persuade you to start sharing with the Internet! I will try to make my point in as few words as possible, please read the whole piece :P

Benefits of writing technical articles

  • Build your own portfolio
  • Challenge yourself if you have a deep understanding…


There are simply so much to learn in the programming world.

3 years into front-end web development, I am feeling as bad at coding as ever. There are simply so much to learn in the programming world so that a humble-enough developer would never dare to say his or her code is perfect.

I have been brushing up my CSS skills for the most part of my career, and that makes me lack confidence in my JavaScript skills for good reasons. Being a positive person who seeks growth all the time, I chose to turn this feeling of inadequacy into motivation instead of self-loath.

Below is a code test my fellow…


Gone are the days when people work for a single company for 20 years. Millennials are called the job-hopping generation for a reason. Is there someone young leaving your company recently? Or if you are a millennial, are you thinking of changing job in the coming 12 months?

People think that millennials are a group of disloyal kids who never want to stay at a company for more than 3 years, but is it really the truth? Looking for a job, sending out CVs and applications, taking time off for interviews, negotiating salary, writing the resignation letter, and finally actually…


Ah! Not the FORM again!

Yes I am sorry, developers have to deal with forms from time to time, it’s unavoidable, that’s our life.

Remember the days when placeholders don’t work on IE? No? Sorry kiddo you are too young…. Since the day there’s more than one browser used to surf the Internet, it has always been painful to work on forms even for the simplest part like a placeholder, or targeting a focused form field, and of course the validation logic for the fields.

To rescue these annoyed web developers from stabbing IE browser developers (well at least I have done these countless times…

Fionna Chan

Front-end developer. I ❤ CSS & JavaScript. My brain occasionally runs out of memory so I need to pen down my thoughts.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store