- Tech notes
Applying darkMode in Tailwind CSS
First, decide whether darkMode should follow the browser's setting, or whether you build your own button and apply it through a class state.
- Work
How to use ``(template literals) correctly in JSP
Template literals did not work properly, and my code almost became long and messy, but a Google search showed me why they don't work in JSP and how to fix it.
- Work
Using a Regex to Allow Only Numbers in input type = "text"
Today at work, while validating an input that takes a car's paint film thickness, I had the following conditions.
- Work
My experience with deep copy
At work, I recently built carInspection, a feature that lets sellers register and edit things like a vehicle's repair history.
- Projects
Node version error when starting a Next.js project
As of November 2023, if you get an error related to node -v, installing node -v 18 or later makes it work properly.
- Projects
How to cancel a git merge
I ran git merge, got flustered when there were conflicts, and was able to cancel the last merge with the command below.
- Projects
Image Errors in My Next.js Portfolio Project
I checked my deployed Next.js portfolio project and found an image error. The Notion images were hosted on AWS, and their domain seemed to have changed.
- Projects
Replacing the Old Loading Bar with a Skeleton UI
I built a skeleton UI myself and replaced what used to be shown with a loading bar, to give users a more natural UI.
- Work
When long text isn't displayed within a cell in ExcelJS
Apply wrapText: true to the cell and the text won't run outside it. If you also apply vertical: 'top', it is aligned to the top.
- Work
How to tell the development server and production server apart in a Vite project
While handling QA for a project today, I had to show a user with the same name on both the development server and the production server.
- Work
How to Use Variables in Template Literals (``) in JSP
While writing a function in JSP, not React, values passed in as variables printed fine in console.log() but did not print correctly when I used them.
- Work
React TS: scroll to top on every page navigation
Create a ScrollToTop component, then insert it in main.tsx, the top-level component, so that it wraps the page components, and you're done.
- Tech notes
Number vs number in TypeScript: why ESLint says to use number
ESLint flagged an error for using Number as a type, so I looked up the difference between Number and number in TypeScript.
- Work
ReactQuery enabled (boolean): No API Call When id Is undefined or null
In ReactQuery, enabled: !!id is an option that skips the API call when the id value is undefined or null!
- Work
Fitting the Width to the Content in ExcelJS
After I finished drawing the Excel file, it came out larger than A4, so every time I printed it I had to set the width to 1 page in Page Layout.
- Work
How to Make \n Line Breaks Work in ExcelJS
First, I made a function to create cells easily. Then, to make line breaks work in a cell, you need to apply a specific setting.
- Work
How to Apply Line Breaks Typed in a Textarea to an Input
In my case, I took the line breaks from the Textarea, which appear as \n in the string, matched them with /\n/g using replace, and changed them to ' '.
- Tech notes
Removing the arrows when a mui TextField has type: number
Removing the arrows when a mui TextField has type: number
- Work
How to fix broken Korean text in react PDF
I registered a Korean font with Font.register and just applied it through style, and the Korean text in react PDF rendered fine.
- Work
Inserting an Image into an Excel Worksheet with ExcelJS
I get the image with fetch(imgSrc), turn it into blob data, and read it with FileReader to insert it into an Excel worksheet.
