Article Search Icon

How to Add Search to Any Kind of Static Site Using Pagefind

Give your site a custom search powered by WebAssembly. With the release of Pagefind 1.0, I replaced my custom fuse.js search with Pagefind.

2024-04-13
@ Technical Discussion
  • #unsorted
Heart Symbol

What is Shadcn UI? Why is it so popular?

Recently, I used Shadcn for Vue to build web UI. It's a customizable component library based on Tailwind, allowing quick creation of web interfaces.

2024-04-01
@ User Interface
  • #unsorted
A hand manipulating a touchpad symbol

Design Forms Correctly, Essential UX for User Input

Forms are the most common website elements and the bridge to users. This post summarizes essential form UX and why design choices matter.

2024-03-31
@ User Experience
  • #unsorted
Warning Symbol

How to Handle TypeScript Error?

JavaScript has try...catch syntax for capturing errors. How can we ensure the type of errors thrown in TypeScript?

2024-03-30
@ TypeScript
  • #unsorted
Container Loading Exclamation Mark Symbol

Type Safety at Runtime with Zod

Zod is a schema declaration and validation library led by TypeScript. The purpose of Zod is to easily write runtime data validation.

2024-03-30
@ TypeScript
  • #Zod
Two people communicating symbol

Describing Consensus: Goals, Problems, Solutions

Recently reading about Goals, Problem, Solutions in Stay SasSy made me realize this is how I break down problems at work!

2024-03-28
@ Team
  • #Communication
An eye with a diagonal slash

Why you shouldn't disable input and how to do it correctly

Using the `disabled` attribute blocks users and creates confusion—explain the reason instead of just preventing actions.

2024-03-24
@ User Experience
  • #Buttons
Astro Logo symbol

Astro Custom Component in MDX

MDX in Astro gives me flexibility, but I prefer writing in Markdown. Can custom components be mapped to Markdown syntax?

2024-03-23
@ Astro
  • #unsorted
A rotating arrow with an exclamation mark in the center

Problem Between UI and Development

why are UI design and development so uncoordinated? Can teams consistently deliver products that truly meet user needs?

2024-03-17
@ Team
  • #unsorted
Check Box Symbol

TDD is Awesome You Should Try It! (Tutorial With Example)

TDD Test-Driven Development is a development methodology where tests are written before the implementation code.

2024-03-17
@ Technical Discussion
  • #unsorted
Three Star Symbols

3 Virtues From a Good Software Engineer

Patience, communication, and thinking outside the box are the virtues I believe a software engineer should have. Do you agree with this idea?

2024-03-16
@ Non-technical discussion
  • #unsorted
File Check Symbol

2 Ways to Verify if JSON-LD is Working

JSON-LD is a way to embed additional data to describe web content. This article shares my experience and how to verify JSON-LD is interpreted correctly.

2024-03-12
@ Search Engine Optimization
  • #unsorted
Refresh Arrow Symbol

How to Rewrite a Legacy System: The Ship of Theseus

Recently faced with many issues of maintaining legacy code, documenting the dilemmas and solutions in rewriting legacy systems.

2024-02-12
@ Pattern
  • #Refactoring
Communication Symbol

The Dailies: A Good Way to Eliminate Team Learning Debt

Developers' "failures" transferring knowledge are not due to laziness. Instead, [pressures] create a complex tension between performance and learning goals.

2024-02-12
@ Team
  • #Communication
Overlapping Abstract Geometric Line Symbol

What is Monorepo? A straightforward explanation

As the complexity of development increases, the term Monorepo frequently appears, To clarify my understanding of Monorepo, I wrote this post.

2024-02-01
@ Technical Discussion
  • #Concept