Build multiple level selection with ReactJS Hooks
Hi there! Long time no articles 😁. Today, I will show you how to build a multiple level selection from scratch in ReactJS with Hooks.
How does it look ? 🤔
How does it work ? 🤔
If you have been working on NodeJS projects for a while, I am pretty sure that you have ever seen “../../some/deep/import-path” syntax. I think these make you crazy with your code (or your partner 😅).
Can we refactor to make our codebase more prettier and clean? 🤔🧐
Absolutely YES! 😁
We have many ways to do it but there may have risks and difficulties for each way. (You can try yourself with some references at the end).
The way I mention in this article is using the jsconfig.json file and babel-cli.
Build OTP input from scratch with ReactJS Hooks
Hi, I come back after a long time no articles :)
Today, I show you how to create an OTP input with ReactJS from scratch. The target result is shown above.
OTP Input is a common UI for every verification transaction step. It contains a number of inputs to fill out the OTP/Verification code sent. One character per input. In this article, I use ReactJS and hooks to implement OTP Input from scratch.
Hello you guys, it’s me Fast Nguyen. Today, I give you a basic idea to enhance Countdown Component in React with Typescript.
The pattern I use in this Component is
render-props you can check it first to understand clearly what I wrote.
You can find full source code from my GitHub.
To be quick, we go-ahead to the snipped code.
class EnhanceCountDown extends React.PureComponent< EnhanceCountDownPropsType, EnhanceCountDownStateType>
Create the class
EnhanceCountDown Component extends from
State structure :
timeoutthe current countDown value with the initial value taken from…
I’m Fast Nguyen ( aka Phat Nguyen) graduated from Viet Nam National Ho Chi Minh University, University of Information Technology(UIT). Currently, I am working as a Software Engineer at Sendo.vn.
I am focusing on ReactJS, TypeScript and some related libraries, I started to say: “Hello World!” in Feb 2017. I love coding with ReactJS because it has a special approach to web development by building components and combine together like a lego game. Instead of using server-side rendering, ReactJS uses client-side rendering as default.
I also write some technical articles on Medium in my free time, you can refer to them in My Articles.