5284fb1c6eeafd27a563d389b9925e0ef86deaf9
1) 들여쓰기가 안 되던 원인 인라인 요소가 여러 줄에 걸쳐 있으면 그 구간을 하나의 텍스트 덩어리로 다뤄 첫 줄에만 들여쓰기를 붙이고 있었다. 그래서 <img> 가 한 줄에 하나씩 적힌 상세페이지에서 두 번째 <img> 부터 1열에 붙어 나왔다. 원문 줄바꿈을 살리면서 각 줄을 현재 깊이로 들여쓰도록 고쳤다. 줄 앞 공백은 렌더링에 영향이 없으므로 안전하다. 상세페이지는 <img> 를 한 줄에 하나씩 적어두는 경우가 많고 그 모양이 저자의 의도라, 한 줄로 합치는 것보다 살리는 쪽이 읽기 좋다. 주석도 줄을 강제로 나누지 않게 바꿨다. `<!-- 대파_타임랩스 --><img ...>` 처럼 바로 뒤 요소를 설명하는 주석이 많아서, 나누면 라벨과 대상이 떨어져 오히려 읽기 나빠진다. 빈 줄은 구획 표시로 한 줄까지 유지한다. 이 과정에서 멱등성이 다시 깨지는 것을 테스트가 잡았다 — 텍스트 끝에 남은 "\n " 조각이 매번 빈 줄로 바뀌고 있었고, 양 끝 공백을 함께 제거하도록 고쳤다. 2) 줄 번호와 가로 스크롤 전문 편집기처럼 줄 번호 칸을 넣었다. 줄바꿈을 허용하면 한 논리 줄이 여러 행이 되어 번호가 어긋나므로, 줄바꿈을 끄고(white-space:pre + wrap=off) 가로로 스크롤한다. 번호 칸은 position:sticky 라 가로로 스크롤해도 왼쪽에 남는다. 크기 계산도 단순해졌다. <pre> 가 흐름에 남아 상자 크기를 정하고 textarea 가 inset:0 으로 그 위를 덮는다 — JS 로 높이를 맞추지 않으니 어긋날 여지가 없다. 색상 계열은 그대로 뒀다(태그 초록·속성 갈색·값 남색·주석 회색). 검증: 유닛테스트 45개 통과(신규 4개 — 모든 줄 들여쓰기, 주석과 요소 붙임, 빈 줄 1개 유지, 실제 상세페이지 모양 멱등). 브라우저 실측: 줄 번호 개수가 줄 수와 일치(18/18, 19/19), 번호와 코드의 세로 위치 일치, 긴 줄에서 편집기 안에서만 가로 스크롤(1920 > 716)되고 페이지는 가로 스크롤 없음, 400px 스크롤 후에도 번호 칸 고정, textarea 내부 스크롤 0(두 층 정렬 유지). Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
DBX 메인 페이지
Google Workspace 계정으로 로그인한 뒤 허용된 사용자만 업무 메뉴에 접근하는 FastAPI 웹앱입니다.
Nginx Proxy Manager(NPM) 뒤에서 Docker 컨테이너로 실행하는 구성을 기준으로 작성했습니다.
접속 허용 계정
허용 목록은 app/main.py의 ALLOWED_EMAILS에서 서버 측으로 검사합니다.
Google OAuth 설정
Google Cloud Console에서 OAuth 클라이언트를 만들고 아래 값을 등록합니다.
| 항목 | 값 |
|---|---|
| 승인된 JavaScript 원본 | https://dbx.no1king.freeddns.org |
| 승인된 리디렉션 URI (운영) | https://dbx.no1king.freeddns.org/auth/google |
| 승인된 리디렉션 URI (로컬) | http://localhost:8080/auth/google |
Google 로그인 화면에서 hd=dbxcorp.co.kr 힌트를 보내지만,
실제 접근 제한은 서버에서 이메일 도메인과 허용 계정 목록으로 다시 검사합니다.
환경 변수
| 변수 | 설명 |
|---|---|
GOOGLE_CLIENT_ID |
Google OAuth 클라이언트 ID |
GOOGLE_CLIENT_SECRET |
Google OAuth 클라이언트 보안 비밀 |
SESSION_SECRET_KEY |
세션 쿠키 서명용 랜덤 문자열 |
SESSION_COOKIE_SECURE |
HTTPS 환경 true / 로컬 HTTP false |
PUBLIC_BASE_URL |
외부 접속 주소 (예: https://dbx.no1king.freeddns.org) |
CS_ORDER_URL |
CS 발주 업무 버튼 이동 주소 |
CUSTOMER_ORDER_LIST_URL |
고객 주문리스트 프로그램 버튼 이동 주소 |
로컬 Docker 테스트
# 1. 환경 변수 파일 준비
copy .env.local.example .env.local
# .env.local 을 열어 Google OAuth 키 등 실제 값으로 수정
# 2. 이미지 빌드 및 컨테이너 실행
docker compose -f docker-compose.local.yml up --build
# 3. 브라우저에서 확인
# http://localhost:8080
Google 로컬 OAuth 주의
Google Cloud Console → OAuth 클라이언트 → 승인된 리디렉션 URI에
http://localhost:8080/auth/google를 반드시 추가해야 합니다.
서버 배포 (Ubuntu + NPM)
NPM은 dbx.no1king.freeddns.org → http://192.168.0.194:80 으로 이미 설정되어 있습니다.
# 서버에서 실행
# 1. 저장소 클론
git clone https://gitea.no1king.freeddns.org/king/dbx-main.git
cd dbx-main
# 2. 환경 변수 파일 준비
cp .env.example .env
# .env 를 열어 실제 값으로 수정
nano .env
# 3. 이미지 빌드 및 백그라운드 실행
docker compose up --build -d
# 4. 로그 확인
docker compose logs -f
업데이트 배포
git pull
docker compose up --build -d
컨테이너 관리
docker compose ps # 상태 확인
docker compose down # 중지
docker compose restart web # 재시작
폰트
app/static/fonts/ 에 Pretendard 폰트가 포함되어 있습니다.
| 파일 | 굵기 |
|---|---|
Pretendard-Thin.ttf |
100 (얇음) |
Pretendard-Regular.ttf |
400 (기본) |
Pretendard-Bold.ttf |
700 (굵음) |
Description
Languages
Python
48.6%
HTML
25.1%
CSS
15.1%
PLpgSQL
5.2%
JavaScript
4.7%
Other
1.2%