variousSorting

다양한 정렬 알고리즘을 선택하고 숫자를 입력하면 정렬되는 과정을 시각화하는 웹서비스입니다.

목차

• 기술 스택
• 시작하기
• 기능
• 정렬 알고리즘 설명
• 지원

기술 스택

Backend

Frontend

Development Tools

시작하기

시스템 요구사항

• Java 17 이상
• Spring Boot 3.x
• Gradle 8.x
• Node.js 18 이상 (React 개발 환경용)
• npm 9.x 이상 또는 yarn

설치 및 실행

1. 저장소 클론

git clone https://github.com/yourusername/variousSorting.git
cd variousSorting

2. 백엔드 실행

./gradlew bootRun

3. 프론트엔드 실행

cd src/main/frontend
npm install
npm start

4. 브라우저에서 http://localhost:3000 접속

기능

6가지 정렬 알고리즘 시각화

• 선택 정렬 (Selection Sort)
• 삽입 정렬 (Insertion Sort)
• 버블 정렬 (Bubble Sort)
• 병합 정렬 (Merge Sort)
• 힙 정렬 (Heap Sort)
• 트리 정렬 (Tree Sort)

시각화 기능

• 실시간 정렬 과정 시각화
• 단계별 상세 설명
• 변수 상태 추적
• 활성 요소 하이라이팅
• 정렬 속도 조절
• 일시정지/재생 기능
• 단계별 이동 기능

메인 화면

• 정렬 알고리즘 선택
• 배열 입력/수정
• 정렬 과정 시각화
• 단계별 설명
• 변수 상태 표시

컨트롤 패널

• 정렬 시작/정지
• 속도 조절
• 단계 이동
• 배열 수정

정렬 알고리즘 설명

선택 정렬 (Selection Sort)

배열을 순회하면서 가장 작은 원소를 찾아 맨 앞으로 이동시키는 방식으로 정렬합니다.

삽입 정렬 (Insertion Sort)

배열의 각 원소를 이미 정렬된 부분 배열의 적절한 위치에 삽입하여 정렬합니다.

버블 정렬 (Bubble Sort)

인접한 두 원소를 비교하여 큰 값을 뒤로 보내는 과정을 반복하여 정렬합니다.

병합 정렬 (Merge Sort)

배열을 반으로 나누고 각 부분을 정렬한 후 병합하는 과정을 재귀적으로 수행합니다.

힙 정렬 (Heap Sort)

배열을 최대 힙으로 구성한 후 루트 노드와 마지막 노드를 교환하며 정렬합니다.

트리 정렬 (Tree Sort)

이진 탐색 트리를 구성한 후 중위 순회하여 정렬된 결과를 얻습니다.

지원