ownership
구조화와 검증이 더 중요했다 - 바이브 코딩으로 챗봇을 만들며 배운 것들
기존 챗봇이 사용 불가해진 상황에서 바이브 코딩으로 챗봇을 직접 만든 경험을 정리합니다. LLM API, S3 로깅, GitHub Actions 자동 지식 보강까지 구현한 과정과 설계 판단을 기록합니다.
aivibe-coding
#architecture
13 posts found.
vue
이벤트 페이지 제작 공수를 줄이기 위한 드래그&드롭 빌더 개발기
이벤트 페이지를 만들 때마다 개발자가 직접 이미지를 S3에 올리고 HTML을 작성해야 했던 반복 작업을 없애기 위해, 드래그&드롭 기반 이벤트 페이지 빌더를 개발한 과정을 다룹니다.
architectureux
ownership
Vanilla JS 댓글 모듈 자체 개발기
프레임워크 독립적인 Vanilla JS 댓글 모듈을 설계·개발하고 기존에 서비스 중이던 Nuxt 3 프로젝트에 통합한 과정을 다룹니다.
javascriptarchitecture
react
대용량 엑셀 다운로드: 클라이언트에서 서버로
클라이언트 기반 엑셀 생성의 한계를 극복하고 SSE를 활용한 서버 사이드 아키텍처로 성능과 사용자 경험을 개선한 과정을 다룹니다.
performancearchitecture
architecture
외부 PG사 연동 시 리다이렉트 패턴 비교 - SDK vs Form POST vs GET
결제 시스템에서 다양한 외부 결제 서비스를 연동하면서 경험한 리다이렉트 패턴들의 차이점과 구현 방법을 정리합니다.
react
architecture
웹 플랫폼 인증 흐름 개선기
브라우저 세션 복원 시 발생할 수 있는 보안 취약점을 개선하고, SSR과 CSR 환경에서 인증 로직을 강화한 과정을 다룹니다.
authssr
react
Next.js 15 App Router 마이그레이션 여정
Express 서버와 Page Router로 구성된 레거시 프로젝트를 Next.js 15 App Router 기반으로 전환한 대규모 마이그레이션 과정을 다룹니다.
ssrmigration
react
HOC와 미들웨어로 구축하는 중앙집중식 오류 처리
Next.js SSR 환경에서 HOC 패턴과 미들웨어 헤더 전파를 활용하여 분산된 오류 처리를 중앙집중화하고 일관된 사용자 경험을 구현한 과정을 다룹니다.
ssrarchitecture
vue
통합 로그인 시스템 구축기: 소셜 로그인과 이메일 로그인을 하나로
네이버, 구글 소셜 로그인과 이메일 계정 시스템을 통합하여 일관된 사용자 경험을 제공하고 신규 회원 가입 플로우를 단일화한 과정을 다룹니다.
autharchitecture
vue
서비스 프론트엔드 성능 최적화 탐구: Nuxt.js 3와 캐싱 전략의 현실
Nuxt.js 3 기반 서비스에서 SWR, Redis, In-Memory 캐싱 등 다양한 성능 최적화 전략을 탐구하고, 실제 인프라 지표를 분석하며 '지금 당장'보다 '적절한 시점'의 중요성을 도출한 결론을 정리합니다.
performancessr
ownership
결제 비밀번호 입력을 위한 숫자패드 컴포넌트 개발 과정
React와 Zustand를 사용하여 결제, 등록, 변경 등 다양한 시나리오에 대응하고, 보안까지 강화한 범용 Numpad 컴포넌트의 설계와 구현 과정을 자세히 살펴봅니다.
reactux
architecture
Nuxt2에서 Pinia 사용하기
Nuxt2 프로젝트에서 Vuex를 Pinia로 마이그레이션하며 적용 방법과 코드 구조 개선 포인트를 정리합니다.
vue
vue
Nuxt2에서 Nuxt3로 마이그레이션 도전기
Nuxt2 프로젝트를 Nuxt3로 전환하며 겪었던 주요 차이점과, 라이브러리 업데이트/디렉터리 이동/Composition API 전환 순서로 진행한 마이그레이션 접근을 정리합니다.
migrationarchitecture