#JavaScript

| 서론 안녕하세요, 팡일입니다. TypeScript를 사용하다 보면 "loading", "success", "error" 같은 상태값을 자주 다루게 됩니다. 처음에는 단순히 string 타입으로 선언하고 사용하지만, 프로젝트 규모가 커질수록 오타나…

| 서론 let num = '123'; console.log(+num); 123을 문자가 아닌 숫자로 출력하려고 하는데, 혹시 위의 코드에서 의문이 드시는 점이 있으신가요? 저는 이 코드를 봤을 때, "문자가 아닌 숫자로 형변환은 어디서하지? +는 …

| 서론 안녕하세요, 팡일입니다. 이전 글에서는 React + Node.js 기반의 풀스택 모노레포 환경을 구축하는 과정을 정리했고, 이번 글에서는 그 환경 위에서 실제로 데이터를 저장하고 조회할 수 있는 CRUD 기능을 구현해보겠습니다. 전체 데이…

| 서론 안녕하세요, 팡일입니다. 보통 웹 개발을 하면 프론트엔드 프로젝트와 백엔드 프로젝트를 각각 관리해왔었는데요? 혹시 모노레포라고 들어보셨나요? 모노레포란?: 두 개 이상의 프로젝트, 애플리케이션 또는 라이브러리 코드를 하나의 버전 관리 저장소…

| 서론 안녕하세요, 팡일입니다.프로젝트를 진행하면서 서버 데이터 호출 로직이 점점 복잡해져, API 모듈 구조를 정리하려고 했습니다. 그런데 구조를 손본 직후, 화면이 하얘지고 콘솔에는 courses.ts 404가 터졌습니다.“파일 하나만 만들면 …

문제 링크 : https://www.acmicpc.net/problem/1021 | 문제 탐색하기 1) 문제 분석 (1) 입력값 N : 큐의 크기 (50보다 작거나 같읕 자연수) M : 뽑아내고자 하는 수의 개수 (N보다 작거나 같은 자연수) arr…

| 서론 안녕하세요, 팡일입니다. React Router v6에서 중첩 라우트(nested routes)를 사용하다 보면 index 라우트를 자연스럽게 사용하게 됩니다. 저 역시 메시지 기능을 구현하면서 /message 아래에 여러 하위 페이지를 두…

| 서론 안녕하세요, 팡일입니다. 오늘은 React + Vite + TS 환경과 Firebase Hosting 그리고 Github Action을 구축하는 방법에 대해서 공유 드리려고 합니다. Vercel로 CI/CD를 구축하는 방법도 공유드린 적이 …

| 서론 안녕하세요, 팡일입니다. 지난 포스팅에서는 useQuery와 캐시 생명주기를 중심으로, 서버 데이터를 ‘읽어오는(Read)’ 방식에 대해 깊이 있게 살펴보았습니다. 이번 포스팅에서는 그 데이터를 ‘변경하는(Change)’ 작업, 즉 생성(C…

| 서론 안녕하세요, 팡일입니다! 이번 포스팅에서는 TanStack Query(이하 React Query)의 가장 핵심적인 훅인 useQuery를 깊이 있게 살펴보려고 합니다. 단순히 “데이터를 가져오는 방법”을 넘어서, React Query가 내부…

| 서론 JavaScript를 사용하다 보면 “문법은 아는데, 막상 문제를 풀거나 코드를 짜려면 손이 안 움직이는 순간”이 자주 온다.특히 코딩테스트나 알고리즘 문제, 혹은 실무에서 데이터를 가공할 때 배열, 문자열, 객체, Set/Map, 정렬 같…

문제 링크 : https://www.acmicpc.net/problem/27918 | 문제 탐색하기 1) 목표 : 입력 값을 바탕으로 달구와 포닉스의 점수를 X:Y 형식으로 출력한다. 2) 기능 명세서 (1) 입력받기 표준 입력을 통해 경기의 수와 …