Next.js7분
Next.js loading.tsx와 404: 버튼이 화면보다 먼저 살아나게 하기
관리 화면 왼쪽 위에 사이드바를 접고 펴는 ☰ 버튼이 있습니다. 폭 하나 바꾸는 버튼인데, 대시보드에서 누르면 2초 넘게 아무 반응이 없었습니다. 레이아웃만 바꾸는 일이 왜 이렇게 오래 걸리는지부터 들여다봤습니다. Next.js 16 App Router 로 만든 제조 공장의 생산 관리 앱입니다.
DUOLABS BLOG
전체 글537
- 프론트엔드8분
가상 스크롤로 장부 화면 만들기: 느린 원인은 Intl.DateTimeFormat
제조 공장 한 곳의 생산 관리 앱을 만들고 있습니다. 그 안에 수주대장이라는 화면이 있는데, 공장이 쓰던 생산 엑셀을 칸 순서까지 그대로 옮긴 표입니다. 1년치만 봐도 4천 줄이 넘습니다. 처음에는 100줄씩 쪽으로 나눠 두었습니다. 직접 써 보다가 이 부분은 확실히 엑셀보다 불편하다는 생각이 들었습니다. 엑셀은 수천 …
- 보안8분
서비스 간 인증 키 관리: 공유 토큰부터 mTLS까지 규모별 4단계
예를 들어 직원 열 명 남짓한 쇼핑몰 운영사를 생각해 봅시다. 주문 관리 화면이 재고 서버에서 수량을 읽고, 고객센터 도구가 주문 서버에서 문의 내역을 가져오고, 사내 챗봇이 외부 AI API를 부릅니다. 연결은 세 가닥이고 키도 세 개입니다. 그런데 이 키들을 비밀 관리 도구에 옮겨 적으려고 표를 그려 보면 칸이 다섯…
- 보안10분
보안 업데이트는 켜 두었는데, 왜 서버는 1년 전 커널로 돌고 있었을까?
리눅스 서버에 자동 보안 업데이트를 켜 두면 한시름 놓게 됩니다. 매일 새벽 패치가 내려오고, 로그에는 「설치 완료」가 쌓입니다. 그런데 커널만큼은 이야기가 다릅니다. 설치와 적용 사이에 재부팅이 있고, 그 재부팅은 아무도 대신 해 주지 않습니다.
- 보안10분
CSP script-src 'unsafe-inline'은 무엇을 열어 둘까?
어떤 사이트의 응답 헤더를 열어 보면 이런 줄이 있습니다.
- 백오피스6분
텔레그램 알림 봇 만들기: BotFather 토큰부터 chat id까지
예약해 둔 작업은 사람이 없는 시각에 서버가 혼자 처리합니다. 잘 끝나면 다행이지만, 중간에 막히면 그 작업은 조용히 대기 상태로 돌아갑니다. 까닭은 기록에 남는데, 기록을 열어 보기 전에는 아무도 모릅니다. 그래서 고객사 업무 시스템의 예약 작업에 텔레그램 알림을 붙였고, 그 알림을 받을 봇을 새로 만들기로 했습니다.
- Next.js8분
Next.js Docker 빌드 캐시: 배포 CSS에서 패키지 스타일이 빠진 문제
테마 메뉴에서 디자인 시스템을 바꾸는 기능을 배포했습니다. 메뉴에는 「Betelgeuse 라임 다크」라고 정확히 찍히는데, 화면은 기본 시스템 그대로였습니다. 바로 전 배포에서는 같은 기능이 잘 동작했습니다. 그 사이에 바뀐 것은 디자인 시스템 패키지의 버전 하나였습니다.
- 데이터베이스 설계13분
온톨로지 다시 보기: 시맨틱 웹 유행 뒤에 남은 것
20년쯤 전, 처음 개발을 배우던 무렵 「온톨로지」라는 말을 들었습니다. 시맨틱 웹이 다음 웹이 된다던 때였고, 저는 그 말이 무슨 뜻인지 제대로 모른 채 지나갔습니다. 그 말을 최근 터미널 매뉴얼 하나를 고치다가 다시 만났습니다.
- AI 자동화6분
SMTP만으로 답장할 수 있을까? 메일 자동화와 IMAP
업무 메일을 대화 한 번으로 보내는 스킬을 설계하다가, 시간을 얼마나 아낄 수 있을지 따져 봤습니다. 견적서를 만든 직후 "이거 보내줘" 한 마디로 첨부·제목·본문이 끝나면 꽤 줄어듭니다. 그런데 목록을 적다 보니 한 줄이 걸렸습니다. 받은 메일에 답하는 일은 이 설계로는 할 수 없었습니다.
- 데이터베이스9분
pgvector HNSW 필터 검색: WHERE를 붙이면 결과가 줄어드는 이유
SELECT id, title