Technology changes rapidly, so as the importance of articles. I add "stars" to mark the importance in today's context of development.
Selected articles are on Medium.

Common patterns for customized hooks

15 June, 2021

Customized hooks are like helper functions in React, they encapsulate logics with different React native hooks: useState, useEffect…

Improve site performance with examples

11 April, 2021

Several practical ways to improve site performance with React. For months, we have worked on web performance for our site. It is a tough…

Code execution order with useEffect and cleanup function

10 April, 2021

Some quick FAQs to share my test results. 1. Does then clean up function only occur on componentUnMount? No. It occurs not just when a…

Three ways to create layout component in React

12 December, 2020

It is a summary on how to use children props, HOC (Higher Order Component), and render props to create layout components. They are not…

How to mock default import and named import in jest

09 October, 2020

Dependencies make tests complicated. Mock them help us concentrate on the things we really want to test. There are two possibilities of…

Write test for React: component, hoc, hooks, promise, saga, graphql, custom hooks

09 October, 2020

Read this article on medium In this article, I will talk about writing test for react component, connected component, hoc, react hooks…

How react lazy helps with web performance

30 July, 2020

React.Lazy is a React official API for lazy load component / dynamic import bundle. In this article, I will show a real simple example on…

How to use hooks (useContext, useReducer) to replace redux

29 June, 2020

Intro In the beginning of development with React, Redux has been a great tool for managing data with certain drawbacks. The drawbacks…

How do I use Cypress as web crawler

11 June, 2020

As a big fan of Hong kong films, I had always wanted to make a website for it, mainly for myself, to list all the Hong kong films from 197…

Some misunderstandings with React.memo, useMemo, and useCallback

10 May, 2020

Read this article on medium React.memo, PureComponent, React.useMemo, React.useCallback are React APIs for optimizing web performance…

Track web performance with Google Analytics

13 April, 2020

This is a research project for discovering the possibility of tracking web performances with Google Analytics. In this project, we have…

Cypress test without polluting the database

11 April, 2020

Cypress is a popular end to end test tool. It can be used to test on localhost during the development, and it can also be used to test the…

React design system with typescript and storybook

08 April, 2020

Read this article on medium A design system should serve two things: export shared components, and show what shared components we have. In…

Create HOC pattern for context

02 April, 2020

Some data should be shared throughout the whole application, for example, the site language, the device size. A common solution is to use…

Rethink on data in React

12 December, 2019

According to Gatsby, data is something outside of the component. React doesn't have its officiel way to fetch and manage data, and it only…

Rethink on React component patterns

09 December, 2019

As mentioned by the first part of tutorial from Gatsby: Components become the base building blocks of your site. Instead of being limited to…

Why use GatsbyJS for this new portfolio website

20 November, 2019

Recently I remade my blog with GatsbyJS. The main reason is that I don't want to create blog by writing html anymore. Gatsby has its support…

Is your team "Agile" ?

01 October, 2019

A questionnaire about the agility in the development team. Development and delivery 1. How do you test in your team ? 0 - Manual test…

Creating the callApi method with promise, async/await

02 April, 2019

It is quite useful to create our own callApi method in the application. In this article, I will talk about three ways to implement it with…

ReduxForm vs Formik, with Material-UI or not ?

02 April, 2019

Form is one of the most important part in web application. When we work with a form, there are so many things that are quite similar, for…

Webpack configuration for react development

14 March, 2019

In order to work with react, we need an environment for compiling es6 and jsx, besides that, we need to support import css and images into…

How to better construct and ship your web application

18 February, 2019

Working in a development team is quite different from working alone or working with only one person. Without shared configurations, rules…

Rethink on web design

07 November, 2017

Thanks to the experience in La Maison du Bitcoin, I had the opportunity for designing the whole website and then implementing it. In this…

Angular 1 Guideline

04 June, 2017

During the last two months, I did an internship as a front-end developer for Angular. The project is well-structured, and strictly follow…

Common practice for header and sidebar in web design and development

10 September, 2016

Recently, I start to discover the common practice for web design and web development. I find that almost all the articles about web design…

Deploy node server to Digital Ocean with PM2

09 September, 2016

It is my note about how to deploy node server to DigitalOcean. 1. Create a virtual server in DigitalOcean DigitalOcean provides service for…

Add ssl certificate(https) for your website with NodeJS

01 August, 2016

Recently one of our customer asked us to use https instead of http for their node based website. The logic is simple: buy the ssl…

Build your Mean Stack with Gulp

12 July, 2016

MEAN stack(MongoDB, Express.js, AngularJS, Node.js) is a very inspiring topic nowadays for front-end developers, because we can become full…

Login, Signup, Find Password by Mail with NodeJS

23 June, 2016

It is a demo for une application full-stack with NodeJS and PassportJS. The demo supports login, signup and forget password. The…

Use Gulp for three reasons

04 May, 2016

First of all, what is gulp? Gulp helps front-end programmers enhance their workflows, but how? Gulp have a lot of plugins to help front-end…