디자인 시스템2분
디자인 시스템 이름을 짓는 방법: 오래 가는 네이밍 전략
디자인 시스템을 운영하다 보면 버튼, 컬러, 레이아웃보다 먼저 부딪히는 문제가 있습니다. 바로 이름입니다. 이름은 문서 구조, 패키지명, 컴포넌트 철학, 팀 내 커뮤니케이션에 계속 영향을 줍니다.
DUOLABS BLOG
듀오랩스가 만들고 배우고 정리한 것들 — 기술 노트, 개발 이야기, 스튜디오 기록.
- 디자인 시스템2분
네오브루탈리즘 UI는 언제 효과적일까
네오브루탈리즘은 최근 웹과 앱 디자인에서 자주 보이는 강한 시각 스타일입니다. 두꺼운 테두리, 원색, 딱딱한 그림자, 과감한 타이포그래피를 사용해 화면을 포스터처럼 보이게 만듭니다.
- AI 자동화2분
AI 프로젝트를 잘 관리하기 위한 기본 개념
AI 도구를 프로젝트에 도입하면 생산성이 올라갈 수 있지만, 규칙 없이 쓰면 결과가 흔들립니다. AI 프로젝트 관리는 프롬프트를 잘 쓰는 것을 넘어 컨텍스트, 도구, 검증, 작업 규칙을 함께 설계하는 일입니다.
- AI 자동화2분
AI를 잘 활용하려면 모델보다 구조가 중요하다
AI를 잘 쓰는 핵심은 좋은 모델을 고르는 것만이 아닙니다. 모델에게 어떤 정보를 주고, 어떤 도구를 연결하고, 결과를 어떻게 검증할지까지 설계해야 실제 업무에 도움이 됩니다.
- AI 자동화3분
CodeRabbit, Warp AI, Cursor는 무엇이 다를까
AI 개발 도구가 많아지면서 이름은 비슷하지만 역할이 전혀 다른 도구들이 함께 비교됩니다. CodeRabbit, Warp AI, Cursor도 모두 개발자를 돕지만 같은 범주의 제품은 아닙니다.
- 모바일 앱3분
여러 고객 앱을 운영할 때 계정과 서명 키를 분리하는 방법
React Native와 Expo로 여러 고객 앱을 개발·배포한다면 계정, 비용, 서명 키, 스토어 권한을 어떻게 나눌지 초기에 정해야 합니다. 이 구조를 잘못 잡으면 나중에 소유권 이전, 업데이트, 보안 관리가 복잡해집니다.
- 모바일 앱2분
Watchman은 React Native 개발에서 왜 필요할까
React Native나 Expo로 개발하다 보면 코드를 고쳤는데 앱에 바로 반영되지 않는 경우가 있습니다. 이때 원인 중 하나가 파일 변경 감시 도구인 Watchman 문제일 수 있습니다.
- 모바일 앱2분
Google Play 출시 트랙을 이해하는 방법
Google Play Console에는 여러 출시 트랙이 있습니다. 처음 앱을 배포할 때 내부 테스트, 비공개 테스트, 공개 테스트, 프로덕션의 차이를 이해하지 못하면 심사와 배포 흐름이 헷갈릴 수 있습니다.
- 모바일 앱2분
모바일 앱 스토어 배포 자동화를 설계할 때 볼 것들
모바일 앱 배포는 빌드 파일을 만드는 것에서 끝나지 않습니다. 인증서, 서명 키, 스토어 메타데이터, 심사 정보, 버전 관리, 제출 자동화까지 함께 설계해야 반복 가능한 배포가 됩니다.
- 모바일 앱2분
Expo EAS 비용 구조와 절약 전략
Expo Application Services(EAS)는 React Native 앱을 빌드, 제출, 업데이트하는 과정을 단순하게 만들어줍니다. 하지만 팀 규모와 빌드 빈도에 따라 비용 구조를 이해하고 써야 합니다.
- 모바일 앱2분
React Native와 Expo에서 OTA 업데이트를 이해하는 방법
OTA(Over-The-Air) 업데이트는 앱 스토어 심사를 거치지 않고 설치된 앱의 JavaScript 코드와 에셋을 갱신하는 방식입니다. React Native와 Expo 환경에서는 빠른 버그 수정과 작은 기능 개선에 매우 유용합니다.
- 웹 인프라3분
웹사이트를 공개하기 전 확인해야 할 기본 체크리스트
웹사이트는 화면만 완성되었다고 끝나지 않습니다. 검색엔진, 소셜 미리보기, 보안 헤더, 모바일 브라우저 색상, robots, sitemap 같은 메타 계층이 함께 준비되어야 안정적으로 공개할 수 있습니다.
- 프론트엔드3분
클릭했는데 화면이 늦게 바뀌는 느낌을 줄이는 방법
사용자가 버튼이나 링크를 눌렀는데 아무 반응이 없는 것처럼 보이면, 실제 로딩 시간이 길지 않아도 서비스가 느리다고 느낍니다. 이 문제는 단순한 성능 문제가 아니라 체감 성능과 피드백의 문제입니다.
- 디자인 시스템3분
UI 디자인 스타일을 빠르게 이해하는 실무 가이드
웹사이트나 앱을 만들 때 “어떤 느낌으로 디자인할 것인가”는 생각보다 중요한 결정입니다. 같은 기능이라도 시각 언어에 따라 신뢰감, 친근함, 전문성, 실험성이 완전히 달라집니다.
- 웹 인프라3분
새 서브도메인이 특정 브라우저에서만 안 열릴 때: DNS 캐시 점검법
새 서브도메인을 추가한 직후 “Safari에서는 열리는데 Chrome에서는 안 열린다” 같은 일이 생길 수 있습니다. 이럴 때 바로 서버 장애나 DNS 설정 오류라고 판단하기 쉽지만, 실제 원인은 로컬 또는 브라우저 DNS 캐시인 경우가 많습니다.
- 프론트엔드4분
Next.js와 Postgres 조합이 작은 팀에 좋은 이유
웹 서비스를 만들 때 기술 스택은 단순한 취향 문제가 아닙니다. 개발 속도, 유지보수, 확장성, 채용 가능성, 운영 비용까지 영향을 줍니다. 작은 팀이나 1인 개발 조직이라면 특히 “적은 인원으로 오래 가져갈 수 있는 조합”이 중요합니다.
- 웹 결제4분
웹에서 Apple Pay를 붙일 때 알아야 할 구현 흐름
웹사이트에 Apple Pay를 붙이면 모바일 Safari 사용자에게 훨씬 빠른 결제 경험을 제공할 수 있습니다. 다만 버튼 하나만 추가한다고 끝나는 기능은 아닙니다. 도메인 검증, 결제 세션 생성, 결제 토큰 승인, PG 연동까지 함께 설계해야 합니다.
- 개발 도구3분
git worktree로 여러 브랜치를 동시에 작업하는 방법
개발 중에는 현재 작업을 유지한 채 다른 브랜치에서 긴급 수정이나 리뷰를 해야 할 때가 있습니다. 이때 매번 stash를 하거나 브랜치를 바꾸면 작업 흐름이 끊깁니다. git worktree는 이런 상황에서 매우 유용한 도구입니다.
- 웹 인프라4분
Cloudflare Tunnel 환경에서 실제 방문자 IP를 처리하는 방법
Cloudflare Tunnel로 서비스를 노출하면 origin 서버가 보는 접속 IP가 실제 방문자 IP가 아닐 수 있습니다. 모든 요청이 터널 또는 프록시에서 온 것처럼 보이면 rate limit, 방문 통계, IP 차단 같은 기능이 부정확해집니다.
- 웹 인프라3분
HSTS 설정 전 알아야 할 옵션과 안전한 적용 순서
HSTS(HTTP Strict Transport Security)는 브라우저에 “이 도메인은 항상 HTTPS로만 접속해야 한다”고 알려주는 보안 정책입니다. 잘 설정하면 중간자 공격과 SSL stripping을 줄일 수 있지만, 성급하게 적용하면 장애 복구가 어려워질 수 있습니다.
- 웹 인프라4분
SSL 인증서를 처음 이해할 때 알아야 할 것
웹사이트 주소 앞에 자물쇠 표시가 붙고 https://로 시작한다면 SSL/TLS 인증서가 사용되고 있다는 뜻입니다. 인증서는 방문자가 접속한 사이트가 진짜인지 확인하고, 주고받는 데이터를 암호화하는 역할을 합니다.