Latest ⚡
This is the only place where you can find a list of my recent posts. They come from different series, but don't worry, following each one will lead you to a collection of similar content.
If you don't want to miss any of my latest posts, be sure to subscribe to my newsletter at the bottom of this page.
Written in 2023 ⏳
Dec
Use forwardRef with a higher-order component
05 Dec, 2023
Swap items in a sortable list
04 Dec, 2023
Display a placeholder in a sortable list
03 Dec, 2023
Create a sortable list
02 Dec, 2023
Build a drop zone for file uploads
01 Dec, 2023
Nov
Read the content of the dropped file
30 Nov, 2023
Preview images before uploading them
29 Nov, 2023
Build a drop file indicator
28 Nov, 2023
Create your own ghost element
27 Nov, 2023
Customize the appearance of a ghost element
26 Nov, 2023
An introduction to HTML 5 drag and drop
25 Nov, 2023
Use a custom drag handle
24 Nov, 2023
Create a linear gauge with discrete values
22 Nov, 2023
Create a time picker
21 Nov, 2023
Linear gauge
20 Nov, 2023
Snap a draggable element to a grid
19 Nov, 2023
Create a radial progress bar
18 Nov, 2023
Pie chart
17 Nov, 2023
Drag an element along a circle
16 Nov, 2023
Add annotations to an image
15 Nov, 2023
Take a screenshot of a portion of an element
14 Nov, 2023
Crop a portion of an image
13 Nov, 2023
Build a magnifying glass for images
11 Nov, 2023
Craft an image cropper
10 Nov, 2023
Convert an LCH color to a LAB color
10 Nov, 2023
Convert a LAB color to an LCH color
10 Nov, 2023
Build a color picker
09 Nov, 2023
Create an RGB to HEX color converter
08 Nov, 2023
Resize columns in a table
07 Nov, 2023
Make a given element resizable
05 Nov, 2023
Build a custom scrollbar
04 Nov, 2023
Scroll by dragging
03 Nov, 2023
Create an image comparison slider
02 Nov, 2023
Create a drawer
01 Nov, 2023
Oct
Create resizable split views
31 Oct, 2023
Create a range slider
30 Oct, 2023
Create a custom draggable hook
29 Oct, 2023
Make an element draggable on touchscreen devices
28 Oct, 2023
Make a given element draggable
27 Oct, 2023
Build a tooltip component
26 Oct, 2023
Merge different refs
24 Oct, 2023
Make an element draggable
23 Oct, 2023
Create a custom hook returning a callback ref
22 Oct, 2023
Pass a ref to a custom hook
20 Oct, 2023
Detect whether an element is in view
19 Oct, 2023
Build your own drawing board
18 Oct, 2023
Implement inline input suggestions
17 Oct, 2023
Save the previous value of a variable
16 Oct, 2023
Persist values between renders
15 Oct, 2023
Drag and drop items within a list
15 Oct, 2023
Reference an element with React's useRef() hook
14 Oct, 2023
Carousel slider
14 Oct, 2023
Navigate to a specific item in a carousel slider
14 Oct, 2023
Store a reference with callback refs
10 Oct, 2023
Access the methods of class components
10 Oct, 2023
Create a reference using React.createRef()
09 Oct, 2023
String refs
08 Oct, 2023
ele.setAttribute vs ele.attribute
07 Oct, 2023
HTML attributes vs DOM properties
06 Oct, 2023
aria-hidden vs hidden
06 Oct, 2023
Mention
04 Oct, 2023
Insert emojis
04 Oct, 2023
Build a simple code editor
03 Oct, 2023
innerText vs textContent
02 Oct, 2023
Truncate the content of an element
02 Oct, 2023
Copy the content of an element to your clipboard
01 Oct, 2023
Sep
Make a text area fit its content automatically
30 Sep, 2023
Quickly insert alternate characters while typing
30 Sep, 2023
Zebra-like background
30 Sep, 2023
Add autocomplete to your text area
28 Sep, 2023
Linear scale of a number between two ranges
28 Sep, 2023
Highlight the current line in a text area
27 Sep, 2023
Create your own custom cursor in a text area
27 Sep, 2023
Mirror a text area for improving user experience
26 Sep, 2023
Display the line numbers in a text area
24 Sep, 2023
Select a given line in a text area
24 Sep, 2023
Highlight keywords in a text area
23 Sep, 2023
Calculate the reading time of a webpage
23 Sep, 2023
createDocumentFragment vs createElement
22 Sep, 2023
Enter full-screen mode
22 Sep, 2023
Make an element take up the entire page
22 Sep, 2023
Dynamically update CSS root variables
21 Sep, 2023
Create a custom cursor
21 Sep, 2023
Sanitize HTML strings
20 Sep, 2023
Indent content in a text area using the Tab key
20 Sep, 2023
Music bars
19 Sep, 2023
Build a spin input
18 Sep, 2023
Reading progress indicator
18 Sep, 2023
Get or set the cursor position in a text field
17 Sep, 2023
Build an OTP input field
17 Sep, 2023
Animate the caret in an input field
17 Sep, 2023
alt vs aria-label
16 Sep, 2023
Display a modal when users leave website
15 Sep, 2023
Display a confirm modal when closing the browser
15 Sep, 2023
resize event vs ResizeObserver
14 Sep, 2023
Waiting for an element to become available
13 Sep, 2023
Avoid shifting layout when opening a modal
13 Sep, 2023
Prevent scrolling behind a fixed header
12 Sep, 2023
Controlled vs uncontrolled modes
11 Sep, 2023
Controlled vs uncontrolled components
11 Sep, 2023
Stateless vs stateful components
10 Sep, 2023
React.useEffect() vs React.useLayoutEffect()
10 Sep, 2023
React.createElement() vs React.cloneElement()
10 Sep, 2023
NodeIterator vs TreeWalker
09 Sep, 2023
React.useState() vs React.useReducer()
08 Sep, 2023
Microtasks vs macrotasks
08 Sep, 2023
Animations vs transitions
08 Sep, 2023
Avoid using default exports
08 Sep, 2023
Flipping number
07 Sep, 2023
setInterval() vs setTimeout() vs setTimeout(0)
06 Sep, 2023
Call stack vs task queue
06 Sep, 2023
Frame corners
06 Sep, 2023
Folded corner
06 Sep, 2023
Debouncing vs throttling
05 Sep, 2023
Anonymous vs closure functions
05 Sep, 2023
HTML entities vs Unicode characters
04 Sep, 2023
Dynamic vs static NodeList
04 Sep, 2023
children vs childNodes
04 Sep, 2023
Typewriter
04 Sep, 2023
React.createElement() vs JSX
03 Sep, 2023
Make a textarea auto-expand
03 Sep, 2023
Scroll down indicator
03 Sep, 2023
Hamburger menu
03 Sep, 2023
Blinking cursor
03 Sep, 2023
font-size vs line-height
02 Sep, 2023
Deep compare vs shallow compare
02 Sep, 2023
cookie vs localStorage vs sessionStorage
02 Sep, 2023
Check if users click outside of selected text
02 Sep, 2023
ReactNode vs ReactElement
01 Sep, 2023
JavaScript events vs synthetic React events
01 Sep, 2023
ceil vs floor vs round
01 Sep, 2023
Typing indicator
01 Sep, 2023
Aug
pseudo-classes vs pseudo-elements
31 Aug, 2023
Object constructor function vs object literals
31 Aug, 2023
eval() vs new Function()
31 Aug, 2023
__proto__ vs prototype
31 Aug, 2023
Speech bubble
31 Aug, 2023
Deep copy vs shallow copy
30 Aug, 2023
Get the bounding rectangle of a text node
30 Aug, 2023
Set Git configuration conditionally
30 Aug, 2023
Grid lines background
30 Aug, 2023
object.property vs Object.defineProperty()
29 Aug, 2023
^a.b.c vs ~a.b.c in package.json file
29 Aug, 2023
Select the direct children of an element
29 Aug, 2023
Pass specified environments to Webpack
29 Aug, 2023
Set vs Array
28 Aug, 2023
Object.freeze() vs Object.seal()
28 Aug, 2023
Object.assign() vs Object spread operator
28 Aug, 2023
Include properties conditionally
28 Aug, 2023
Highlighting target element
28 Aug, 2023
Add a special message when users copy text
27 Aug, 2023
Grid without double borders
27 Aug, 2023
Center align one and left align the other
27 Aug, 2023
Customer logos marquee
27 Aug, 2023
Multiple awaits vs Promise.all()
26 Aug, 2023
isNaN vs Number.isNaN
26 Aug, 2023
Running flow
26 Aug, 2023
Rotating texts
26 Aug, 2023
Floating label
26 Aug, 2023
preload vs prefetch
25 Aug, 2023
blur vs focusOut
25 Aug, 2023
append vs appendChild
25 Aug, 2023
a vs !!a
25 Aug, 2023
Skeleton loading
25 Aug, 2023
void vs never
24 Aug, 2023
Readonly<T[]> vs ReadOnlyArray<T>
24 Aug, 2023
K keyof T vs K extends keyof T
24 Aug, 2023
any vs unknown
24 Aug, 2023
standard event handler vs event delegation
23 Aug, 2023
default parameters vs OR operator
23 Aug, 2023
Pulse animation
23 Aug, 2023
Calculate the distance to the bottom of a page
23 Aug, 2023
Generate a weighted random number in given range
22 Aug, 2023
Apr
Capitalize a string
11 Apr, 2023
Feb
Returns an object with unique values by key
17 Feb, 2023
Newsletter 🔔
If you're into front-end technologies and you want to see more of the content I'm creating, then you might want to consider subscribing to my newsletter.
By subscribing, you'll be the first to know about new articles, products, and exclusive promotions.
Don't worry, I won't spam you. And if you ever change your mind, you can unsubscribe at any time.
Phước Nguyễn