개발 환경

X2BEE의 개발을 위한 안정적인 개발 환경을 구축하는 방법에 대해 설명합니다.


사용 라이브러리 정보

명칭

버전

용도

명칭

버전

용도

JRE System Library

17

웹 어플리케이션 구동에 필요한 자바 런타임 라이브러리

Spring Boot Framework

3.3.1
(Spring Framework 6.1.10)

서버 로직 전반을 담당하는 프레임워크

Mybatis-spring-boot-starter

3.0.3

데이터베이스 연결 및 쿼리 처리를 위한 라이브러리

Logback

1.5.6

로깅을 위한 라이브러리

lombok

1.18.32

반복되는 메소드를 Annotation을 사용해서 자동으로 작성해주는 라이브러리

google-owasp-java-html-sanitizer

20240325.1

XSS 방지 필터

React 프로덕션용 라이브러리(dependencies)

axios

1.7.7

API 호출을 위한 HTTP 클라이언트 라이브러리

firebase

10.14.0

Firebase 서비스 연동

react

18.3.1

React 기반 UI 라이브러리

zustand

4.5.5

상태 관리를 위한 경량 라이브러리

@auth0/auth0-react

2.2.4

Auth0를 이용한 인증 기능 구현

@dnd-kit/core

6.1.0

드래그 앤 드롭 구현을 위한 라이브러리

@emotion/react

11.13.3

Emotion 스타일링 라이브러리의 React 통합

@fontsource/nanum-gothic

5.1.0

나눔고딕 폰트 제공

@mui/material

5.16.7

Material-UI를 이용한 UI 컴포넌트 라이브러리

@react-pdf/renderer

3.4.5

PDF 생성 및 렌더링

@dnd-kit/sortable 8.0.0
@dnd-kit/utilities 3.2.2
@emotion/cache 11.13.1
@emotion/styled 11.13.0
@fontsource/barlow 5.1.0
@fontsource/ibm-plex-sans-kr 5.1.0
@fontsource/public-sans 5.1.1
@fullcalendar/core 6.1.15
@fullcalendar/daygrid 6.1.15
@fullcalendar/interaction 6.1.15
@fullcalendar/list 6.1.15
@fullcalendar/react 6.1.15
@fullcalendar/timegrid 6.1.15
@fullcalendar/timeline 6.1.15
@hookform/resolvers 3.9.0
@iconify/react 5.0.2
@minimal-kit/next-ts file
@mui/icons-material 5.16.7
@mui/lab 5.0.0-alpha.173
@mui/material 5.16.7
@mui/material-nextjs 5.16.6
@mui/styled-engine-sc 6.1.4
@mui/system 6.1.4
@mui/types 7.2.18
@mui/x-charts 7.21.0
@mui/x-data-grid 7.21.0
@mui/x-data-grid-premium 7.21.0
@mui/x-date-pickers 7.19.0
@mui/x-date-pickers-pro 7.19.0
@mui/x-license 7.21.0
@mui/x-tree-view 7.21.0
@stomp/stompjs 7.0.0
@supabase/supabase-js 2.45.4
@tiptap/core 2.8.0
@tiptap/extension-code-block 2.8.0
@tiptap/extension-code-block-lowlight 2.8.0
@tiptap/extension-image 2.8.0
@tiptap/extension-link 2.8.0
@tiptap/extension-placeholder 2.8.0
@tiptap/extension-text-align 2.8.0
@tiptap/pm 2.8.0
@tiptap/react 2.8.0
@tiptap/starter-kit 2.8.0
@types/lodash 4.17.10
@types/sockjs-client 1.5.4
apexcharts 3.54.0
autosuggest-highlight 3.3.4
aws-amplify 6.6.4
cookies-next 4.3.0
cross-env 7.0.3
dayjs 1.11.13
dotenv 16.4.5
embla-carousel 8.3.0
embla-carousel-auto-height 8.3.0
embla-carousel-auto-scroll 8.3.0
embla-carousel-autoplay 8.3.0
embla-carousel-react 8.3.0
exceljs 4.4.0
framer-motion 11.11.7
i18next 23.15.2
i18next-browser-languagedetector 8.0.0
i18next-resources-to-backend 1.2.1
jodit 4.2.43
jose 5.9.6
js-yaml 4.1.0
lowlight 3.1.0
mui-one-time-password-input 2.0.3
next 14.2.15
nprogress 0.2.0
react-apexcharts 1.4.1
react-daum-postcode 3.1.3
react-dom 18.3.1
react-dropzone 14.2.3
react-hook-form 7.53.0
react-i18next 14.1.3
react-joyride 2.9.2
react-lazy-load-image-component 1.6.2
react-map-gl 7.1.7
react-markdown 9.0.1
react-organizational-chart 2.2.1
react-phone-number-input 3.4.8
react-router-dom 6.26.2
rehype-highlight 7.0.0
rehype-raw 7.0.0
remark-gfm 4.0.0
simplebar-react 3.2.6
sockjs-client 1.6.1
sonner 1.5.0
styled-components 6.1.13
stylis 4.3.4
stylis-plugin-rtl 2.1.1
swr 2.2.5
turndown 7.2.0
x2bee-core filesrc/lib/x2bee-core
yet-another-react-lightbox 3.21.6
zod 3.23.8

React 개발용 라이브러리 (devDependencies)

@typescript-eslint/parser

7.18.0

TypeScript를 지원하는 ESLint 파서

eslint

8.57.1

코드 품질 및 스타일 검사

prettier

3.3.3

코드 포맷터

typescript

5.5.4

TypeScript 개발 환경

@svgr/webpack

8.1.0

SVG를 React 컴포넌트로 변환

@iconify-icon/react 2.1.0
@next/eslint-plugin-next 14.2.15
@types/autosuggest-highlight 3.2.3
@types/jsonwebtoken 9.0.7
@types/node 20.16.11
@types/nprogress 0.2.3
@types/react 18.3.11
@types/react-dom 18.3.0
@types/react-lazy-load-image-component 1.6.4
@types/stylis 4.2.6
@types/turndown 5.0.5
@typescript-eslint/eslint-plugin 7.18.0
eslint-config-airbnb 19.0.4
eslint-config-airbnb-typescript 18.0.0
eslint-config-prettier 9.1.0
eslint-import-resolver-typescript 3.6.3
eslint-plugin-import 2.31.0
eslint-plugin-jsx-a11y 6.10.0
eslint-plugin-perfectionist 2.11.0
eslint-plugin-prettier 5.2.1
eslint-plugin-react 7.37.1
eslint-plugin-react-hooks 4.6.2
eslint-plugin-unused-imports 3.2.0

 

프로젝트 패키지 구조

 1. src/main/java

  • 프레임워크 공통 클래스 패키지: 프로젝트 관련 설정, 예외처리, DB관련 속성, 보안, 유틸 클래스 포함

  • API 관련 비즈니스 로직 클래스 패키지: Controller, Service, Dao, Entity 클래스

 

 2. src/main/resources

  • 프레임워크 설정 패캐지: dev/local 별 datasource 설정, 로깅 설정, 기타 설정 파일

  • API 관련 쿼리 패키지: 프로젝트 내에서 사용될 쿼리 파일

  • View 템플릿 패키지: Front-end html 파일과 error html 파일

  • 기타 설정 패키지: 프로젝트 전체 appliation.yml 파일 및 설정 파일

다음 콘텐츠

로컬 개발 환경 설정하기