본문 바로가기

frontend39

비트윈톤(BetweenTone) 출시 첫 주 회고: 예상치 못한 관심에서 배운 것들 🎯 들어가며"대AI 시대에 대화 속 숨겨진 감정을 AI가 분석하고 답변을 추천해주면 어떨까?" 라는 단순한 아이디어에서 시작한 프로젝트가 출시 첫 주에 예상보다 많은 관심을 받았습니다. 첫 5일간 일 트래픽이 최대 33,000건까지 올랐고, 이후 일 평균 10,000건 수준을 유지하고 있습니다. 이 글에서는 개인 프로젝트를 출시하고 실제 사용자들을 만나며 배운 솔직한 경험들을 공유하고자 합니다.📊 숫자로 보는 첫 주의 성과트래픽 추이Day 1: 15.7k (초기 공개)Day 2: 33.0k (입소문 확산)Day 3: 33.1k (관심 지속)Day 4: 33.6k (피크 달성)Day 5: 28.5k (자연스러운 조정 시작)Day 6-7: 평균 10k (실제 수요 수준)솔직히 말하면, 초기의 폭발적인 트.. 2025. 7. 23.
Next.js 프로젝트에 TypeScript 타입 체크 설정하기: 놓치기 쉬운 필수 설정 Next.js 프로젝트에 TypeScript 타입 체크 설정하기: 놓치기 쉬운 필수 설정Next.js로 새 프로젝트를 시작할 때 npx create-next-app@latest를 사용하면 TypeScript가 기본으로 설정되지만, 의외로 타입 체크 명령어는 포함되어 있지 않습니다. 이 글에서는 Next.js 15와 TypeScript 5.x 환경에서 타입 체크를 설정하는 간단하면서도 유용한 방법을 소개합니다.알고 계셨나요? Next.js의 next build 명령어는 기본적으로 타입 체크를 수행하지만, 개발 중에는 별도의 타입 체크 명령어가 필요합니다.왜 타입 체크가 필요한가요?Next.js의 개발 서버(next dev)는 실시간으로 타입 에러를 보여주지만, 다음과 같은 상황에서는 별도의 타입 체크가 필.. 2025. 7. 14.
Next.js13 프로젝트에서 yarn start(or npm run start) 스크립트를 실행했을 때 실행되는 코드 분석 Next.js - next-start code #!/usr/bin/env node import arg from 'next/dist/compiled/arg/index.js' import { startServer } from '../server/lib/start-server' import { getPort, printAndExit } from '../server/lib/utils' import isError from '../lib/is-error' import { getProjectDir } from '../lib/get-project-dir' import { CliCommand } from '../lib/commands' import { resolve } from 'path' import { PHASE_P.. 2023. 6. 28.
CSR(Client-side Rendering)이란? (+SSR 비교) 🤔 CSR(Client-side Rendering)이란? Client-side Rendering(CSR)은 웹 페이지의 콘텐츠를 클라이언트(브라우저)에서 렌더링하는 방식이다. 서버에서 HTML, CSS, JavaScript 파일을 클라이언트로 보내고, 클라이언트에서 JavaScript를 실행하여 동적인 웹 페이지를 생성하게 된다. 이로 인해 서버의 부하가 감소하고, 많은 인터랙티브한 기능을 제공할 수 있게 된다. 자주 사용되는 웹 프레임워크로는 React, Angular, Vue.js 등이 있다. 😎 장점 ✅ 인터랙션 향상 CSR은 사용자 경험(UX) 측면에서 이점을 가지고 있다. 페이지의 동작에 따라 실시간으로 콘텐츠가 변경되어 사용자가 웹사이트를 더 쉽게 이용할 수 있다. 예를 들면, 기존 웹에서 페.. 2023. 6. 28.