전체 글 (707) 썸네일형 리스트형 코파일럿과 커서 그리고 클로드 코드까지 - 바이브 코딩 입문기 개발 도구를 바꾸는 건 꽤 귀찮은 일이다. 손에 익은 단축키, 플러그인 세팅, 테마까지 — 다시 처음부터 적응해야 한다. 그럼에도 커서(Cursor)로 갈아탄 건 반강제에 가까웠다. 무언가가 확실히 달랐기 때문이다.1) 코파일럿으로 시작했지만AI 코딩 도구를 처음 접한 건 깃허브 코파일럿(GitHub Copilot)이었다. 솔직히 처음엔 인텔리센스(IntelliSense)의 업그레이드 버전 정도로 느꼈다. 코드를 치면 다음 줄을 예측해 주는데, 뭔가 더 잘 맞히는 자동완성에 가까웠다.코딩 방식은 별로 달라지지 않았다. 문제가 생기면 구글링하고, 스택 오버플로우에서 찾아보고, 내 프로젝트에 붙여 넣는 루틴 그대로였다. AI가 끼어들긴 했지만 내가 주도권을 쥐고 있다는 느낌이 강했다.2) 컨텍스트가 느껴지기.. 요즘 웹 개발 5편 — 로그인은 회사가 정해 주고, 지금은 앱이 들고 있다 부제: SSO·Husky·테스트 공백, 그리고 Better Auth·Biome까지1~4편을 거쳐 경계·상태·UI·DB까지 왔다. 마지막은 인증, 린트·포맷·훅, 테스트다.용어SSO(Single Sign-On): 한 번 인증하면 여러 시스템에 연동 로그인되게 하는 흐름. 사내 IdP가 있는 조직에선 보통 그 규칙을 따른다.Better Auth: 앱이 직접 붙이기 쉬운 인증 라이브러리 쪽(학습용 레포에 포함). SSO를 대체한다는 뜻이 아니라, 전제가 다르다.ESLint / Prettier: JS·TS 규칙 검사와 포맷을 나눠 맡기던 조합.Biome: 린트+포맷을 한 도구로 묶는 쪽에 가깝다.Husky: Git hook을 걸어 커밋 전 검사 등을 돌리게 하는 도구.Vitest: Vite 친화 단위·컴포넌트 .. 요즘 웹 개발 4편 — 스키마는 남기고, SQL은 손에 잡히게 부제: JPA·Snowflake·MyBatis·Flyway, 그리고 Drizzle이번 편은 DB·ORM·마이그레이션. 회사에서는 Aurora MySQL 도 있었고, 이번 글의 축은 JPA → Snowflake·MyBatis와 Flyway, 그리고 지금의 Postgres·Drizzle이다.용어JPA / Hibernate: 엔티티 ↔ 테이블 매핑의 자바 표준 쪽. 구현체로 Hibernate가 흔하다.dialect: DB마다 다른 SQL 문법·함수를 ORM이 맞춰 번역하게 하는 설정 축.MyBatis: SQL을 직접 적고 결과를 객체에 매핑하는 SQL 매퍼.Snowflake: 클라우드 데이터 웨어하우스. OLTP DB와 SQL 뉘앙스가 달라 ORM dialect가 꼬이기 쉽다.Flyway: 스키마 변경을 버전.. 요즘 웹 개발 3편 — 키트는 많이 써 봤는데, 한 결이 안 보였던 시절 부제: Semantic·Elastic·MUI를 돌다 Tailwind·shadcn까지1·2편은 경계와 상태·계약이었다. 오늘은 화면.용어Semantic UI / Elastic UI / MUI: 완성도 높은 컴포넌트·테마를 한 번에 쓰는 UI 키트 계열.Tailwind CSS: 유틸리티 클래스로 스타일을 조합하는 프레임워크. 팀끼리 같은 말로 간격·색을 말하기 좋다는 면에서 협업에 도움이 될 수 있다.Radix UI: 접근성·키보드 동작 위주의 헤드리스 프리미티브.shadcn/ui: Radix 등을 바탕으로 컴포넌트 소스를 프로젝트에 복사해 가져가 쓰는 흔한 패턴.CVA(class-variance-authority): 버튼 variant/size처럼 조합 규칙을 정리하는 유틸.1) 여러 키트를 돌아다닌 이유.. 요즘 웹 개발 2편 — 트리 안에서는 단단히, 경계에서는 흐릿히 부제: MobX-State-Tree·REST·any 그리고 tRPC를 만지며1편까지 SPA+Spring 분리·MSA였다. 오늘은 상태와 API 계약이다.용어MobX-State-Tree(MST): 상태를 트리 모델 + 액션으로 묶는 라이브러리.TanStack Query: 서버 데이터 캐시·재요청·동기화에 특화.Zustand: 가벼운 클라이언트 UI 상태용 스토어.React Hook Form: 폼을 등록 기반으로 다뤄 리렌더를 줄이려는 도구.tRPC: HTTP 위에서 프로시저처럼 API를 정의하고 클라 타입 추론까지 이어지게 하려는 도구.Zod: 스키마 한 번으로 런타임 검증과 TS 타입을 같이 쓰려는 라이브러리.REST: 자원을 URL·HTTP 메서드로 다루는 스타일, 페이로드는 보통 JSON.1) MST.. 요즘 웹 개발 1편 — 경계가 나뉘던 시절과, 한 덩어리로 묶는 요즘 부제: 예전엔 SPA+Vite+Spring, 지금은 Next를 만지며요즘 웹 쪽 트렌드가 궁금해서, 모던 웹 기술 스택을 공부하려고 작은 풀스택 베이스를 깎고 있다. Next.js를 한 번 해보고 싶어서 시작했는데, 막상 보니 스택이 꽤 밀려 있다는 느낌이 들었다. JS는 예전에 Express.js 정도만 떠올랐고, 최근에는 거의 자바만 해 왔다.이번 시리즈는 회사에서 겪었던 조합과 지금 손에 익히는 조합을 겹쳐 보면서 “왜 이렇게 잡았지?”를 남기려 한다. 1편은 앱 경계 — 분리된 구조와 한 덩어리 구조의 차이부터 시작한다.용어CRA (Create React App): 옛날 React 보일러. webpack으로 개발 서버·빌드를 한 번에 잡는 그림.Vite: 개발은 가볍게, 빌드는 보통 Rollup .. FastAPI 연재 9편(옵션) — Docker/Compose로 실행 환경 “한 번에” 맞추기 로컬에서만 잘 되는 서버는… 솔직히 반쪽이다 ㅋㅋ팀 작업/배포/NAS 같은 환경으로 갈수록 결국 도커를 쓰게 된다.doubles은 최소한의 구성으로 이렇게 잡아뒀다.Dockerfile: 서버 이미지를 만든다docker-compose.yml: 포트/환경변수/볼륨을 붙인다SQLite 파일은 볼륨에 저장해서 컨테이너 내려도 유지1) Dockerfile: “코드 복사 → pip install → uvicorn”핵심은 이 줄이다.CMD ["uvicorn", "app.main:app", "--host", "0.0.0.0", "--port", "8000"]그리고 DB 파일은 /app/data에 두고, 권한도 맞춰준다.RUN mkdir -p /app/data && chown appuser:appuser /app/dat.. FastAPI 연재 8편 — 테스트에서 dependency_overrides로 외부 의존성 “갈아끼우기” FastAPI 공부하면서 내가 제일 “오… 이거 좋다” 했던 포인트가 테스트였다.왜냐면 현실의 서버는 이런 애들이 붙어있다.DB외부 HTTP APIAI API근데 테스트에서 그걸 진짜로 호출하면?느림flaky(가끔 실패)돈 나감(특히 AI)그래서 테스트에서는 dependency_overrides로 의존성을 바꿔치기 한다.1) create_app(settings)로 테스트용 앱 만들기테스트용 DB URL을 주입해서 app를 만든다.settings = Settings(database_url=f"sqlite:///{tmp_path / 'test.db'}")app = create_app(settings)client = TestClient(app)이렇게 하면 테스트끼리 DB 파일이 분리돼서 깔끔하다.2) depe.. 이전 1 2 3 4 ··· 89 다음
