• 현대적이고 직관적인 UI로 개편하여 사용자 경험 극대화
• 기존의 모놀리식 구조에서 탈피하여 마이크로서비스 기반으로 전환
• On-premise에 Kubernetes 기반의 자동화된 배포와 스케일링으로 시스템 안정성과 확장성 확보
• 조회가 잦은 정보는 Redis로 캐싱해 사용성 극대화
• 다양한 결제 수단을 제공하기 위한 결제 시스템(KCP, 카카오페이, 페이코 등) 통합
• Gitlab CI/CD, Harbor, ArgoCD를 활용한 자동 배포 CI/CD 파이프라인 구성

• 도서 재고, 기프티콘, 쿠폰, 지점 관리자 등 RDB 테이블 설계
• 11번가 기프티콘 POS 서버와 연동해 기프티콘 코드 검증 및 소진 처리 개발
• O2O(Online to Offline) 나우드림 개발 (온라인 구매 시 기간 내 오프라인에서 도서를 직접 받아볼 수 있는 기능)
• 국내 및 DHL 해외배송비 산정 로직 개발
• Profile(Dev, Prod) 환경에 따른 KCP, 카카오페이 주문 결제 로직 분리 및 버그 픽스
• 마이페이지 (배송지 관리 및 개인 정보) 개발
• 주간/월간 베스트셀러 개발
• 외부 검색엔진 업체(와이즈넛)와 협력하여 검색 기능 개발
• 주문/결제 건 조회 및 주문 취소 개발
• 기프티콘, 나우드림 어드민 통계 개발
• @Scheduled 로 작성돼 있던 배치 프로세스를 Spring Quartz + Spring Batch 환경으로 전환하여 물리적으로 실행 환경이 분리된 MSA 환경에서 원자 단위로 배치가 실행되도록 수정
• 기존의 회원, 상품, 이미지, 댓글, 베스트셀러 등의 데이터를 신규 데이터베이스로 이관 배치 개발
• 기존의 Jenkins로 CI 하고 수동으로 서버에 접속해 웹 애플리케이션을 실행 하던 개발 환경에서 Gitlab CI + Harbor + ArgoCD 로 영풍문고의 On-Premise 각 물리서버들에 자동 배포되는 환경으로 전환하는데 참여
• 쿠버네티스에서 모듈화된 프론트엔드 화면이 제공될 수 있도록 환경별 .env 작성 및 Vite 라우팅 설정 정보 수정
• 모든 백엔드 마이크로서비스 애플리케이션 도커 파일 작성
• 쿠버네티스에서 모듈화된 백엔드 마이크로서비스가 제공될 수 있도록 헬름 차트 수정
• 상품, 베스트셀러 등 쿼리 속도 개선
• 각종 버그 픽스 (입사 당시 BTS에서 우선순위가 낮은 Minor를 제외하고 Critical, Major 이슈 약 1,600개)

• Backend: Java, Spring Boot, MyBatis
• Frontend: TypeScript, Vue, Vite
• Database: MySQL, Redis
• DevOps: Kubernetes, Jenkins, Gitlab CI/CD, Harbor, ArgoCD
• Monitoring: Grafana, Loki

기존의 모든 배치 프로세스와 스케줄링을 Spring Quartz + Spring Batch 환경으로 전환

• CronTriggerFactoryBeanBuilder: Quartz 스케줄을 정의합니다.
• JobDetailFactoryBeanBuilder: Batch Job을 정의합니다.

1@Value("${quartz.schedule.cron.order.completed-order-to-wms}")
2private String scheduleCronTime; // 예시: 0/30 * * * * 
3
4// [A]
5@Bean
6public CronTriggerFactoryBean sendCompletedOrderToWmsJobTrigger() {
7    return ScheduleHelper.cronTriggerFactoryBeanBuilder()
8        .name("sendCompletedOrderToWmsJobTrigger")
9        .cronExpression(scheduleCronTime)
10        .jobDetailFactoryBean(sendCompletedOrderToWmsJobSchedule())
11        .build();
12}
13
14// [B]
15@Bean
16public JobDetailFactoryBean sendCompletedOrderToWmsJobSchedule() {
17    return ScheduleHelper.jobDetailFactoryBeanBuilder()
18        .job(sendCompletedOrderToWmsJob())
19        .build();
20}
21
22// [C]
23@Bean
24public Job sendCompletedOrderToWmsJob() {
25    return jobBuilderFactory.get(JOB_NAME)
26        .start(sendCompletedOrderToWmsStep())
27        .build();
28}
29
30// [D]
31private Step sendCompletedOrderToWmsStep() {
32    return stepBuilderFactory.get(STEP_NAME)
33        .<OrderDetailVo, OrderDetailVo>chunk(CHUNK_SIZE)
34        .reader(sendCompletedOrderToWmsItemReader())
35        .writer(sendCompletedOrderToWmsWriter())
36        .build();
37}

• [A]: Spring Quartz의 CronTriggerFactoryBean을 생성합니다. 이는 Cron 시간 트리거이며, 정의된 Cron 시간에 Trigger 되도록 하는 정의 입니다.
• [B]: Spring Batch의 JobDetailFactoryBean을 생성합니다. 이는 Batch Job을 포함하는 팩토리 빈 입니다.
• [C], [D]: Spring Batch의 Job과 Step을 생성합니다. 이는 JobDetail에 포함될 정보들입니다.

1@Bean
2@StepScope
3public SynchronizedItemStreamReader<OrderDetailVo> sendCompletedOrderToWmsItemReader() {
4    MyBatisCursorItemReader<OrderDetailVo> itemReader = new MyBatisCursorItemReaderBuilder<OrderDetailVo>()
5        .sqlSessionFactory(sqlSessionFactory)
6        .queryId(getMapperPath("OrderStatusMapper.selectOrderListForWmsApi"))
7        .build();
8
9    return new SynchronizedItemStreamReaderBuilder<OrderDetailVo>()
10        .delegate(itemReader)
11        .build();
12}
13
14private ItemWriter<OrderDetailVo> sendCompletedOrderToWmsWriter() {
15    return items -> items.forEach(orderDetailVo -> {
16        log.info("[도서상품 출고 요청] 주문완료 건 WMS에 전송 - orderNo: {}, orderStatusCd: {}", orderDetailVo.getOrderNo(), orderDetailVo.getOrderStatusCd());
17        orderManageService.sendOrderToDelivery(orderDetailVo, orderDetailVo.getOrderProducts(), WmsOrderType.ORDER);
18    });
19}

MyBatis의 활용

1<select id="findAll" resultType="kr.co.ypbooks.base.admin.model.o2o.NowdreamOrderManagementResponseDto">
2    SELECT
3        os.company_cd,
4        os.order_no,
5        os.order_id,
6        CASE
7            WHEN os.order_status_cd = 1000 THEN '입금대기'
8            WHEN os.order_status_cd = 1010 THEN '주문완료'
9            WHEN os.order_status_cd = 1061 THEN '전체취소'
10            WHEN os.order_status_cd = 1040 THEN '출고'
11            WHEN os.order_status_cd = 1071 THEN '전체반품'
12        END AS order_status_cd,
13        DATE_FORMAT(os.order_date,'%Y-%m-%d %H:%i') AS order_date,
14        JSON_VALUE(os.orderer_info, '$.ordererName') AS orderer_name,
15        JSON_VALUE(os.orderer_info, '$.ordererEmail') AS orderer_email,
16        os.member_cd,
17        os.zbcnr,
18        CASE
19            WHEN os.member_flag = 1 THEN '회원'
20            ELSE '비회원'
21        END AS member_flag,
22        CASE
23            WHEN os.payment_method_cd = 900 THEN 'O' -- 무통장입금
24            WHEN os.payment_method_cd = 999 THEN 'R' -- 적립/예치
25            WHEN os.payment_method_cd = 100 THEN 'K' -- 신용카드
26            WHEN os.payment_method_cd = 101 THEN 'A' -- 실시간계좌이체
27            WHEN os.payment_method_cd = 102 THEN 'M' -- 휴대폰 소액결제
28            WHEN os.payment_method_cd = 110 THEN 'J' -- 문화/도서/해피머니 상품권
29            WHEN os.payment_method_cd = 300 THEN 'P' -- PAYCO
30            WHEN os.payment_method_cd = 200 THEN 'Q' -- KAKAO
31            WHEN os.payment_method_cd = 400 THEN 'Z' -- TOSS
32        END AS payment_method_cd,
33        os.total_quantity,
34        JSON_VALUE(os.payment_info , '$.totalProductSalesPrice') AS order_amount,
35        CASE
36            WHEN JSON_VALUE(os.branch_pickup_info, '$.pickupTypeCd') = 1 THEN '1시간이후'
37            ELSE '직접수령'
38        END AS receiving_method_cd,
39        IFNULL(os.branch_pickup_yn, 'N') AS branch_pickup_yn,
40        IFNULL(os.branch_pickup_admin_yn, 'N') AS branch_pickup_admin_yn,
41        (SELECT COUNT(ORDER_CONSULT.consult_no) FROM ORDER_CONSULT WHERE order_no = os.order_no) AS order_consult_cnt
42    FROM ORDER_STATUS AS os
43    WHERE id >= #{pageable.offset}
44    <include refid="whereBySearchDto" />
45    ORDER BY os.reg_date DESC, os.upd_date DESC
46    LIMIT #{pageable.pageSize}
47</select>
48
49<sql id="whereBySearchDto">
50
51    ... 생략 ...
52
53    <!-- 주문 상태 -->
54    <if test="searchDto.orderStatusCd != null and searchDto.orderStatusCd.name() != 'ALL'">
55        AND os.order_status_cd = #{searchDto.orderStatusCd.code}
56    </if>
57    <!-- 수령 여부 -->
58    <if test="searchDto.branchPickupYn != null and searchDto.branchPickupYn != ''">
59        AND os.branch_pickup_yn = #{searchDto.branchPickupYn}
60    </if>
61
62    ... 생략 ...
63
64</sql>

Gitlab CI/CD → Harbor → ArgoCD → Kubernetes Cluster 배포 경험

1// [A]
2back_order_build_jar:
3  extends: .common_build_template
4  variables:
5    SERVICE_NAME: "back_order"
6
7// [B]
8.common_build_template:
9  variables:
10    SERVICE_NAME: "common build"
11  when: manual
12  stage: build_jar
13  image: openjdk:17-jdk
14  only:
15    - develop
16  script:
17    - ./gradlew --stacktrace back:${SERVICE_NAME}:clean -Pprofile=qa back:${SERVICE_NAME}:build;
18  artifacts:
19    paths:
20      - back/${SERVICE_NAME}/**/*.jar
21
22// [C]
23back_order_deploy_harbor:
24  extends: .common_deploy_harbor_template
25  variables:
26    SERVICE_NAME: "back_order"
27    HARBOR_REPOSITORY_NAME: "ypbooks/back_order"
28  needs:
29    - back_order_build_jar
30
31// [D]
32.common_deploy_harbor_template:
33  variables:
34    SERVICE_NAME: "common deploy harbor"
35    HARBOR_REPOSITORY_NAME: "ypbooks"
36  stage: deploy_harbor
37  image:
38    name: gcr.io/kaniko-project/executor:debug
39    entrypoint: [ "" ]
40
41  before_script:
42    - mkdir -p /kaniko/.docker
43    - echo "{\"auths\":{\"$HARBOR_URL\":{\"username\":\"$HARBOR_USER\",\"password\":\"$HARBOR_PASSWORD\"}}}" > /kaniko/.docker/config.json
44
45  script:
46    - |
47      /kaniko/executor \
48       --context $CI_PROJECT_DIR \
49       --dockerfile $CI_PROJECT_DIR/back/${SERVICE_NAME}/Dockerfile \
50       --destination $HARBOR_URL/${HARBOR_REPOSITORY_NAME}:$CI_COMMIT_SHORT_SHA \
51       --skip-tls-verify
52  only:
53    - develop

• [A]: 주문 서비스 빌드 정의입니다.
• [B]: 각 마이크로서비스에서 공통적으로 사용되는 빌드 구성 정의입니다. QA 프로파일로 빌드해 JAR 파일을 생성합니다.
• [C]: 주문 서비스 도커 이미지를 Harbor로 업로드하는 정의 입니다.
• [D]: 각 마이크로서비스에서 공통적으로 사용되는 도커 이미지 생성 및 Harbor로 업로드하는 정의입니다. 도커 이미지 생성에는 Kaniko를 사용합니다.

1// [A]
2replicaCount: 3
3
4// [B]
5image:
6  repository: harbor.ypbooks.co.kr/ypbooks/qa_back_order
7  pullPolicy: Always
8
9// [C]
10ingress:
11  enabled: true
12  className: "nginx"
13  annotations: {}
14  hosts:
15  - host: qa.ypbooks.co.kr
16    paths:
17    - path: /back_order
18      pathType: Prefix
19  - host: m-qa.ypbooks.co.kr
20    paths:
21    - path: /back_order
22      pathType: Prefix

• [A]: 생성할 Pod의 개수 정의 입니다. QA의 경우 테스터 분들께서 큰 불편함 없이 테스트 할 수 있는 환경을 구성하기 위해 기본 3개로 설정했습니다.
• [B]: 주문 서비스 도커 이미지가 업로드 된 Harbor 저장소 경로입니다.
• [C]: Ingress 리소스를 생성하여 외부 요청을 클러스터 내부 서비스로 라우팅하도록 합니다. Ingress 리소스로 Nginx Ingress Controller를 사용합니다. 호스트는 qa.ypbooks.co.kr와 m-qa.ypbooks.co.kr로 설정했으며, 이러한 경로로 요청이 오면 /back_order로 라우팅하도록 설정했습니다. pathType의 경우 Prefix로 설정해 경로가 /back_order로 시작하는 모든 요청을 해당 서비스로 라우팅하도록 합니다.

Vue 라이브러리 첫 사용

1<!-- orders/NowdreamDashboard.vue -->
2<template>
3  <section class="order-dashboard">
4    <NowdreamFilterPanel
5      v-model:status="filters.status"
6      v-model:receiving-method="filters.receivingMethod"
7      v-model:branch-only="filters.branchOnly"
8      @submit="fetchOrders"
9    />
10
11    <NowdreamTable
12      :orders="orders"
13      :busy="isLoading"
14      @bulk-release="handleBulkRelease"
15    />
16
17    <PaginationBar
18      v-if="pagination.total > 0"
19      v-bind="pagination"
20      @change="handlePageChange"
21    />
22  </section>
23</template>
24
25<script setup lang="ts">
26import { useNowdreamOrders } from '@/composables/useNowdreamOrders'
27
28const filters = reactive({ status: 'ALL', receivingMethod: 'ALL', branchOnly: false })
29const { orders, pagination, fetchOrders, releaseOrders, isLoading } = useNowdreamOrders(filters)
30
31const handleBulkRelease = async (selectedOrderNos: string[]) => {
32  if (!selectedOrderNos.length) return
33  await releaseOrders(selectedOrderNos)
34  fetchOrders()
35}
36
37onMounted(fetchOrders)
38</script>

1<!-- orders/components/NowdreamFilterPanel.vue -->
2<template>
3  <FormSection @submit.prevent="$emit('submit')">
4    <OptionField label="주문 상태" :items="statusOptions" v-model="modelValue.status" />
5    <OptionField label="수령 방법" :items="receivingOptions" v-model="modelValue.receivingMethod" />
6    <ToggleField label="미수령 주문만 보기" v-model="modelValue.branchOnly" />
7    <PrimaryButton type="submit">검색</PrimaryButton>
8  </FormSection>
9</template>
10
11<script setup lang="ts">
12const modelValue = defineModel<{ status: string; receivingMethod: string; branchOnly: boolean }>('status')
13</script>

1<!-- orders/components/NowdreamTable.vue -->
2<template>
3  <DataTable :rows="orders" :loading="busy" selectable @select-change="emit('bulk-release', $event)">
4    <template #default="{ row }">
5      <td>{{ row.orderNo }}</td>
6      <td>{{ row.statusLabel }}</td>
7      <td>{{ row.branchPickupLabel }}</td>
8      <td>{{ row.consultCount }}</td>
9      <td>
10        <StatusButton :status="row.status" @click="emit('bulk-release', [row.orderNo])" />
11      </td>
12    </template>
13  </DataTable>
14</template>
15
16<script setup lang="ts">
17defineProps<{ orders: OrderSummary[]; busy: boolean }>()
18defineEmits<{ (e: 'bulk-release', value: string[]): void }>()
19</script>