Go to file
SeongHyun Kim 599b5a4426 feat(pop): pop-card-list-v2 슬롯 기반 카드 컴포넌트 신규 + 타임라인 범용화 + 액션 인라인 설정
CSS Grid 기반 슬롯 구조의 pop-card-list-v2 컴포넌트를 추가한다.
기존 pop-card-list의 데이터 로딩/필터링/장바구니 로직을 재활용하되,
카드 내부는 12종 셀 타입(text/field/image/badge/button/number-input/
cart-button/package-summary/status-badge/timeline/action-buttons/
footer-status)의 조합으로 자유롭게 구성할 수 있다.
[신규 컴포넌트: pop-card-list-v2]
- PopCardListV2Component: 런타임 렌더링 (데이터 조회 + CSS Grid 카드)
- PopCardListV2Config: 3탭 설정 패널 (데이터/카드 디자인/동작)
- PopCardListV2Preview: 디자이너 미리보기
- cell-renderers: 셀 타입별 독립 렌더러 12종
- migrate: v1 -> v2 설정 마이그레이션 함수
- index: PopComponentRegistry 자동 등록
[타임라인 데이터 소스 범용화]
- TimelineDataSource 인터페이스로 공정 테이블/FK/컬럼/상태값 매핑 설정
- 하드코딩(work_orders+work_order_process) 제거 -> 설정 기반 동적 조회
- injectProcessFlow: 설정 기반 공정 데이터 조회 + __processFlow__ 가상 컬럼 주입
- 상태값 정규화(DB값 -> waiting/accepted/in_progress/completed)
[액션 버튼 인라인 설정]
- actionRules 내 updates 배열로 동작 정의 (별도 DB 테이블 불필요)
- execute-action API 재활용 (targetTable/column/valueType)
- 백엔드 __CURRENT_USER__/__CURRENT_TIME__ 특수값 치환
[디자이너 통합]
- PopComponentType에 "pop-card-list-v2" 추가
- ComponentEditorPanel/ComponentPalette/PopRenderer 등록
- PopDesigner loadLayout: components 존재 확인 null 체크 추가
[기타]
- .gitignore: .gradle/ 추가
2026-03-10 16:56:14 +09:00
.cursor Merge branch 'main' into jskim-node 2026-03-04 21:09:55 +09:00
.playwright-mcp 그리드? 일단 추가랑 복사기능 되게 했음 2026-01-08 17:05:27 +09:00
backend/gradle/wrapper feat: Enhance menu and screen synchronization services with new fields 2026-03-04 22:46:02 +09:00
backend-node feat(pop): pop-card-list-v2 슬롯 기반 카드 컴포넌트 신규 + 타임라인 범용화 + 액션 인라인 설정 2026-03-10 16:56:14 +09:00
db feat: Implement process work standard routes and controller 2026-02-24 12:37:33 +09:00
docker Merge branch 'jskim-node' of http://39.117.244.52:3000/kjs/ERP-node into gbpark-node 2026-03-05 09:59:23 +09:00
docs Merge branch 'jskim-node' of http://39.117.244.52:3000/kjs/ERP-node into gbpark-node 2026-03-04 22:45:40 +09:00
frontend feat(pop): pop-card-list-v2 슬롯 기반 카드 컴포넌트 신규 + 타임라인 범용화 + 액션 인라인 설정 2026-03-10 16:56:14 +09:00
mcp-agent-orchestrator chore: Remove obsolete .classpath file 2026-03-04 15:31:45 +09:00
scripts Merge branch 'jskim-node' of http://39.117.244.52:3000/kjs/ERP-node into gbpark-node 2026-03-05 09:59:23 +09:00
.cursorrules docs: 비즈니스 로직 요청 양식 검증 및 화면 분석 요약 추가 2026-01-30 14:13:44 +09:00
.gitignore feat(pop): pop-card-list-v2 슬롯 기반 카드 컴포넌트 신규 + 타임라인 범용화 + 액션 인라인 설정 2026-03-10 16:56:14 +09:00
Dockerfile feat: 원본 최신 소스 반영 + NCP Kubernetes 배포 설정 추가 2025-11-10 14:20:10 +09:00
Jenkinsfile feat: 원본 최신 소스 반영 + NCP Kubernetes 배포 설정 추가 2025-11-10 14:20:10 +09:00
PLAN.MD feat(pop-card-list): 3섹션 분리 + 포장 2단계 계산기 + 설정 패널 개편 2026-02-25 17:03:47 +09:00
POPUPDATE.md POP 디자이너 v5 그리드 시스템 통합 및 그리드 가이드 재설계 2026-02-05 14:24:14 +09:00
POPUPDATE_2.md feat(pop): 아이콘 컴포넌트 추가 및 디자이너 UX 개선 2026-02-11 10:41:30 +09:00
README.md chore: Remove obsolete .classpath file 2026-03-04 15:31:45 +09:00
STATUS.md feat(pop-card-list): 3섹션 분리 + 포장 2단계 계산기 + 설정 패널 개편 2026-02-25 17:03:47 +09:00
docker-compose.backend.win.yml rest api 액션노드 기능변경 2025-10-13 12:00:41 +09:00
docker-compose.frontend.win.yml feat: Docker 및 스크립트 개선 2026-02-04 13:57:04 +09:00
package-lock.json feat: Enhance BOM management with new header retrieval and version handling 2026-02-26 13:09:32 +09:00
package.json feat: Enhance BOM management with new header retrieval and version handling 2026-02-26 13:09:32 +09:00
values_logistream.yaml feat: 원본 최신 소스 반영 + NCP Kubernetes 배포 설정 추가 2025-11-10 14:20:10 +09:00

README.md

WACE 솔루션 (ERP/PLM)

프로젝트 개요

본 프로젝트는 WACE ERP/PLM(Product Lifecycle Management) 솔루션입니다. Node.js + Next.js 기반 풀스택 웹 애플리케이션으로, 멀티테넌시를 지원합니다.

주요 특징

  • 모던 프론트엔드: Next.js (App Router) + TypeScript + shadcn/ui
  • Node.js 백엔드: Express + TypeScript + PostgreSQL
  • 반응형 디자인: 데스크톱, 태블릿, 모바일 모든 기기 지원
  • 멀티테넌시: 회사별 데이터 격리 (company_code 기반)
  • Docker 기반 배포: 개발/운영 환경 일관성 보장
  • 타입 안전성: TypeScript로 런타임 에러 방지

기술 스택

Frontend

  • 프레임워크: Next.js (App Router, Turbopack)
  • 언어: TypeScript
  • UI 라이브러리: shadcn/ui + Radix UI
  • 스타일링: Tailwind CSS
  • 상태 관리: TanStack Query + React Context
  • 아이콘: Lucide React

Backend

  • 런타임: Node.js 20+
  • 프레임워크: Express 4
  • 언어: TypeScript
  • 데이터베이스: PostgreSQL (pg 드라이버)
  • 인증: JWT (jsonwebtoken) + bcryptjs
  • 로깅: Winston

개발 도구

  • 컨테이너화: Docker + Docker Compose
  • 코드 품질: ESLint + Prettier
  • 테스트: Jest + Supertest
  • 백엔드 핫리로드: nodemon
  • CI/CD: Jenkins

프로젝트 구조

ERP-node/
├── backend-node/            # Express + TypeScript 백엔드
│   ├── src/
│   │   ├── app.ts          # 엔트리포인트
│   │   ├── controllers/    # API 컨트롤러
│   │   ├── services/       # 비즈니스 로직
│   │   ├── middleware/      # 인증, 에러처리 미들웨어
│   │   ├── routes/         # 라우터
│   │   └── config/         # DB 연결 등 설정
│   └── package.json
├── frontend/                # Next.js 프론트엔드
│   ├── app/                # App Router 페이지
│   ├── components/         # React 컴포넌트
│   │   ├── ui/            # shadcn/ui 기본 컴포넌트
│   │   ├── admin/         # 관리자 컴포넌트
│   │   ├── screen/        # 화면 디자이너
│   │   └── v2/            # V2 컴포넌트
│   ├── lib/               # 유틸리티, API 클라이언트
│   ├── hooks/             # Custom React Hooks
│   └── package.json
├── db/                     # 데이터베이스
│   └── migrations/        # 순차 마이그레이션 SQL
├── docker/                # Docker 설정 (dev/prod/deploy)
├── scripts/               # 개발/배포 스크립트
├── docs/                  # 프로젝트 문서
├── Dockerfile             # 프로덕션 멀티스테이지 빌드
├── Jenkinsfile            # CI/CD 파이프라인
└── .cursorrules           # AI 개발 가이드

빠른 시작

1. 필수 요구사항

  • Node.js: 20.10+
  • PostgreSQL: 데이터베이스 서버
  • npm: 10.0+

2. 개발 환경 실행

# 백엔드 (nodemon으로 자동 재시작)
cd backend-node && npm install && npm run dev

# 프론트엔드 (Turbopack)
cd frontend && npm install && npm run dev

3. Docker 환경 실행

# 백엔드 + 프론트엔드 (개발)
docker-compose -f docker-compose.backend.win.yml up -d
docker-compose -f docker-compose.frontend.win.yml up -d

# 프로덕션 배포
docker-compose -f docker/deploy/docker-compose.yml up -d

4. 서비스 접속

서비스 URL 설명
프론트엔드 http://localhost:9771 Next.js 사용자 인터페이스
백엔드 API http://localhost:8080 Express REST API

주요 기능

1. 사용자 및 권한 관리

  • 사용자 계정 관리 (CRUD)
  • 역할 기반 접근 제어 (RBAC)
  • 부서/조직 관리
  • 멀티테넌시 (회사별 데이터 격리)

2. 메뉴 및 화면 관리

  • 동적 메뉴 구성
  • 화면 디자이너 (드래그앤드롭)
  • V2 컴포넌트 시스템

3. 플로우(워크플로우) 관리

  • 비즈니스 프로세스 정의
  • 데이터 흐름 관리
  • 감사 로그

4. 제품/BOM 관리

  • BOM 구성 및 버전 관리
  • 제품 정보 관리

5. 기타

  • 파일/문서 관리
  • 메일 연동
  • 외부 DB 연결
  • 번호 채번 규칙

환경 변수

# backend-node/.env
DATABASE_URL=postgresql://postgres:password@localhost:5432/dbname
JWT_SECRET=your-jwt-secret
JWT_EXPIRES_IN=24h
PORT=8080
CORS_ORIGIN=http://localhost:9771

# frontend/.env.local
NEXT_PUBLIC_API_URL=http://localhost:8080/api

배포

프로덕션 빌드

# 멀티스테이지 Docker 빌드 (백엔드 + 프론트엔드)
docker build -t wace-solution .

CI/CD

Jenkins 파이프라인 (Jenkinsfile)으로 자동 빌드 및 배포가 설정되어 있습니다.

코드 컨벤션

  • TypeScript: 엄격한 타입 정의 사용
  • ESLint + Prettier: 일관된 코드 스타일
  • shadcn/ui: UI 컴포넌트 표준
  • API 클라이언트: frontend/lib/api/ 전용 클라이언트 사용 (fetch 직접 사용 금지)
  • 멀티테넌시: 모든 쿼리에 company_code 필터링 필수