DoRun-DoRun!

📊목차

No	내용
1	💁프로젝트 소개
2	👷웹 서비스 소개
3	🔍기술 스택
4	💡주요 기능
5	📂프로젝트 구성도
6	👪개발 팀 소개
7	📱프로젝트 소개 및 영상
8	💻실행방법

💁프로젝트 소개

프로젝트 명	DoRun-DoRun
진행기간	2024.02.29 ~ 2024.04.02 (34일)
팀명 / 팀원	final / 6명(프론트 3명, 백 3명)
github 주소	https://github.com/ghtjd1358/DoRun-DoRun
배포 주소	https://43.201.109.188.sslip.io/

👷웹 서비스 소개

DoRun-DoRun은 만화 , 영화 다양한 캐릭터를 활용한 영어 교육 사이트로, AI로 학습된 캐릭터와 대화를 통해 영어를 재미있게 배울 수 있습니다.

사용자는 본인의 수준에 따라 단계별로 난이도를 조절할 수 있으며, 단계를 선택하면 AI가 사용자 레벨에 맞는 문장을 랜덤으로 제시합니다. 이를 학습한 후, 캐릭터와 대화할 때 학습한 문장을 활용하여 미션을 클리어하면 다음 단계로 진행할 수 있습니다.

사용자는 자신의 수준에 맞게 미션을 분류하고, 미션을 수행할 때마다 도전과제가 점점 더 어려워지며 다양한 문장들이 생성됩니다. 이러한 미션은 영어 학습을 체계적으로 도와줍니다.

또한, 캐릭터와의 대화 내용을 기록하여 마지막으로 어디까지 진행했는지, 어떤 대화를 나누었는지 쉽게 확인할 수 있습니다.

추가적으로, DoRun-DoRun은 퀴즈 기능을 제공합니다. 사용자는 랜덤으로 배치된 문장을 해석에 맞춰 영어 단어를 클릭하여 순서대로 맞추는 퀴즈를 풀 수 있습니다.

🔍기술 스택

#Front-end

-BUILD

-LIBRARY

-NPM

#Back-end

-DevOps

-DataBase

#Cooperation Tools

💡주요 기능

기능	내용
만화 및 영화 캐릭터 활용	다양한 만화와 영화 캐릭터를 활용하여 영어 학습을 더욱 재미있게 만들어 줍니다. 사용자들은 친숙한 캐릭터들과 대화를 통해 영어를 배울 수 있습니다.
AI 기반 대화	AI로 학습된 캐릭터와의 대화를 통해 영어를 자연스럽게 연습할 수 있습니다. 사용자는 캐릭터와 대화하며 미션을 수행하고, 학습한 문장을 활용할 수 있습니다.
단계별 난이도 조절	사용자는 본인의 수준에 맞게 난이도를 조절할 수 있습니다. 각 단계에서 AI가 사용자 레벨에 맞는 문장을 랜덤으로 제시합니다.
미션 기반 학습	미션을 완료하면 다음 단계로 진행할 수 있습니다. 미션을 수행할 때마다 도전과제가 점점 더 어려워지며 다양한 문장들이 생성됩니다. 이로써 체계적인 영어 학습이 가능합니다.
대화 내용 기록	캐릭터와의 대화 내용을 기록하여 사용자가 어디까지 진행했는지, 어떤 대화를 나누었는지 쉽게 확인할 수 있습니다.
퀴즈 기능	사용자는 랜덤으로 배치된 문장을 해석에 맞춰 영어 단어를 클릭하여 순서대로 맞추는 퀴즈를 풀 수 있습니다. 퀴즈를 통해 학습한 내용을 복습하고 확장할 수 있습니다.

📂프로젝트 구성도

아키텍처(Architecture)

폴더 구조(client)

client
├─ node_modules
├─ public
|   ├─ chracters
|   └── mission
├─ src
│   ├─ api
│   ├─ assets
│   │     └── CSS
│   ├─ components
│   │     ├─ Cheerio
│   │     ├─ Footer
│   │     ├─ Guide
│   │     ├─ Header
│   │     ├─ HeaderNav
│   │     ├─ Login
│   │     ├─ Mypage
│   │     ├─ MypagePW
│   │     ├─ NotFound
│   │     ├─ Preview
│   │     ├─ PreviewContent
│   │     ├─ ReviewContent
│   │     ├─ SidebarNav
│   │     ├─ Spinner
│   │     ├─ TabButton
│   │     ├─ TabContent
│   │     ├─ TeamsOfService
│   │     ├─ UserData
│   │     └─ Wordquiz
│   ├─ pages
│   │    ├─ talk
│   │     │   ├─ ChatList
│   │     │   └── Popup
│   │     ├─ About
│   │     ├─ Chat
│   │     ├─ Hone
│   │     ├─ Learn
│   │     ├─ Myroom
│   │     ├─ Review
│   │     └─ Talk
│   ├── store
│   │     └─ features
│   │            ├─ loginSlice
│   │            ├─ signupSlice
│   │            ├─ userIdChecklice
│   └── utils
│         ├─ firework
│         └─ word
├─ Layout
├─ hooks
├─ .gitignore
└─ package.json

폴더 구조(server)

server
├─ gradle/wrapper
├─ src
│   ├─ main
│   │   ├─ java \ com \ example \ projectFinal
│   │   │                        ├─ config
│   │   │                        │     ├─ AwsConfig
│   │   │                        │     ├─ CorsConfig
│   │   │                        │     ├─ SecurityConfig
│   │   │                        │     └─ WebConfig
│   │   │                        ├─ controller
│   │   │                        │       ├─ ChatController
│   │   │                        │       ├─ MessageController
│   │   │                        │       ├─ PracticeController
│   │   │                        │       ├─ RoomController
│   │   │                        │       ├─ SpeechToTextController
│   │   │                        │       ├─ UserController
│   │   │                        │       └─ UserMissionController
│   │   │                        ├─ dto
│   │   │                        │    ├─ ChatDto
│   │   │                        │    ├─ MessageDto
│   │   │                        │    ├─ RoomDto
│   │   │                        │    ├─ UserDto
│   │   │                        │    └─ UserMissionDto
│   │   │                        ├─ entity
│   │   │                        │      ├─ Message
│   │   │                        │      ├─ MissionEntity
│   │   │                        │      ├─ Room
│   │   │                        │      ├─ User
│   │   │                        │      └─ UserMissionEntity
│   │   │                        ├─ jwt
│   │   │                        │    ├─ JwtAuthenticationFilter
│   │   │                        │    └─ TokenProvider
│   │   │                        ├─ repository
│   │   │                        │      ├─ MessageRepository
│   │   │                        │      ├─ MissionRepository
│   │   │                        │      ├─ RoomRepository
│   │   │                        │      ├─ UserMissionRepository
│   │   │                        │      └─ UserRepository
│   │   │                        ├─ service
│   │   │                        │      ├─ ChatService
│   │   │                        │      ├─ CorrectAi
│   │   │                        │      ├─ MessageService
│   │   │                        │      ├─ Pooh
│   │   │                        │      ├─ PracticeAi
│   │   │                        │      ├─ PracticeService
│   │   │                        │      ├─ RoomService
│   │   │                        │      ├─ S3Service
│   │   │                        │      ├─ STTService
│   │   │                        │      ├─ TTSService
│   │   │                        │      ├─ UserMissionService
│   │   │                        │      └─ UserService
│   │   │                        ├─ JacksonConfig
│   │   │                        └─ ProjectFinalApplication
│   │   └─ resource
│   │          └─ templates
│   │                  └─ test
│   └─ java \ com \ example \ projectFinal 
│                                 └─ ProjectFinalApplicationTests
├─ build.gradle
├─ gradlew
├─ .gitignore
└─ package.json

👪개발 팀 소개

이름	역할	개발 내용
한우리	Back-end, 팀장	-Chat-bison -Mission 기능 -Practice 기능
이정원	Back-end	-서버 구축 -보안 -TTS -User 관리
심세연	Back-end	-STT -ChatModel -Mission 기능
김상호	Front-end	-대화하기 목록 -룸 페이지
손호성	Front-end	-Redux-toolkit을 이용한 상태관리 -로그인, 마이페이지 구현 -마이페이지 생성, 수정, 삭제 기능 구현 -React-hook-form을 이용한 유효성 검사 -랜딩 페이지, error 페이지 구현 -퀴즈 기능 구현
한지혜	Front-end	-CSS 전반

📱프로젝트 소개 및 영상

AI와 대화하기

(마이크를 사용하지 않은 예. 감정에 따라 캐릭터의 표정이 바뀐다. 응답레이턴시는 총 3초.)

새로운 표현 배우기

(클라이언트의 수준에 맞는 문장표현과 연습할수 있는 다수의 랜덤한 예문을 AI가 만들어 준다.)

미션관리

(클라이언트가 캐릭터와 대화하는 도중 앞서 학습한 표현을 활용할 수 있도록 미션을 부여한다. 미션검사AI를 모델링하여 해당 표현을 활용했는지 검사하고, 성공시 빵빠레.)

문법 교정

(대화가 종료되면 문법 교정AI 모델이 대화 내역을 검사한다. 틀린 내역이 있으면 수정하여 준다.)

💻실행 방법

Client 실행

1. 원격 저장소 복제

$ git clone https://github.com/ghtjd1358/DoRun-DoRun.git

2. 프로젝트 폴더로 이동

$ cd frontend

3. 필요한 node_modules 설치

$ npm install

4. 개발 서버 실행

$ npm run dev

Main Server 실행

1. 원격 저장소 복제

$ git clone https://github.com/ghtjd1358/DoRun-DoRun.git

2. 프로젝트 폴더로 이동

$ cd backend

3. 프로젝트 빌드

$ gradlew clean build -x test

5. 개발 서버 실행

$ nohup java -jar projectFinal-0.0.1-SNAPSHOT.jar &

ghtjd1358 / dorun-dorun__publice-project Goto Github PK

dorun-dorun__publice-project's Introduction