사용자의 관심사와 테스트를 통한 영어 실력을 기반으로 CNN 뉴스를 추천해주고 학습을 지원합니다.
- 뉴스 속 문장의 발음을 듣고 쉐도잉하며 스피킹 실력 향상
- 발음 점수 측정을 통해 영어 발음 개선
- 뉴스 스크립트의 해석본를 제공하여 독해 역량 향상
- 레벨에 맞는 영단어와 한글의미를 제공하여 단어 실력을 향상
- 학습한 영상에 대한 단어 테스트를 통해 이해도 평가
- 사용자 관심사와 실력에 맞는 학습 영상 추천
- 학습 통계를 시각적으로 확인하며 성과 확인 및 동기부여
- 커스텀 단어장 및 영상 학습 기록을 제공하여 진행 상태 파악
- 최신 뉴스의 학습자료(영상과 스크립트)가 매일 업데이트되도록 자동화
- CEFR 레벨시스템에 따른 어휘 빈도수와 평균 문장 길이에 따른 영상 난이도 판별
- 영어 실력의 중요성은 현대사회에서 점점 더 부각
- 듣기, 말하기, 쓰기, 읽기를 한번에 해결
- 정확한 문법, 또렷한 발음, 일정한 속도
- 다양한 주제, 시사적 안목 확장
| 최동헌 (팀장/FS) | 김하은 (팀원/FS) | 이민주 (팀원/FS) |
|---|---|---|
| 인프라, 학습 기록 구현 | 인프라, 레벨 시스템 | 검색 기능, 회원 관리 |
| 이은지 (팀원/FS) | 유혜승 (팀원/FS) | 차다운 (팀원/FS) |
|---|---|---|
| 학습 진행 관련 기능 | 데이터 수집 및 관리 | 뉴스 추천 알고리즘 |
| 초기화면 |
|---|
 |
| 정보입력 |
|---|
 |
| 관심영상 |
|---|
 |
| 레벨테스트 |
|---|
 |
| 최근 학습 뉴스와 추천 뉴스 |
|---|
 |
| 카테고리별 조회 |
|---|
 |
| 제목과 문장에서 키워드로 검색 |
|---|
 |
| 스크립트 |
|---|
 |
| 발음평가 |
|---|
 |
| 영어사전 팝업창 |
|---|
 |
| 단어장 |
|---|
 |
| 학습통계 |
|---|
 |
| 시험 문제 |
|---|
 |
| 채점 결과 |
|---|
 |
| 학습 상태별 영상 |
|---|
 |
| 커스텀 단어장 |
|---|
 |
- scrapetube를 사용하여 16만개의 CNN 유튜브 영상 크롤링
- selenium, apscheduler를 통해 새로 올라온 CNN 유튜브 영상을 하루 단위로 자동 크롤링
- 스크립트 없는 데이터 제거
- nltk.sent_tokenize를 통해 발화 단위의 스크립트 타임라인을 문장 단위로 변경
CNN 홈페지의 카테고리 기반 카테고라이징 모델
➡ CNN 홈페이지에서 제공하는 기사 양이 한정적 + 카테고리 별 편차
➡ 데이터 증강을 통해 기사 양 늘리고 편차 극복
➡ 임베딩을 통해 단어를 밀집 벡터로 매핑
➡ 평균 풀링을 통해 고정 크기의 벡터 생성, 완전 연결 레이어를 통해 분류 수행
→ 모델 정확도 약 90%
아래의 두가지 지표를 혼합하여 난이도 선정
| 단어 난이도 | 영상 난이도 |
|---|---|
| CEFR 유럽연합 공통언어 표준등급 | Flesh-Reading Ease Score |
| A1 - A2 - B1 - B2 - C1 - C2 | 범위 0~100 계산식 206.835 - 1.015* (문장당 평균 단어 길이) - 84.6 * (평균 단어 수) |
학습한 뉴스들과의 유사도를 토대로 뉴스 추천
| TF-IDF 벡터화 & 코사인 유사도 | 추천 알고리즘 |
|---|---|
| 🤍 TF (단어 빈도) 특정 단어가 문서 내에 얼마나 자주 등장하는지 나타내는 값 🤍 DF (문서 빈도) 다른 문서에서 특정 단어가 얼마나 자주 등장하는지 나타내는 값, 특정 단어를 가진 문서의 수 🤍 코사인 유사도 두 벡터값 사이 코사인 각도 |
🤍 사용자의 레벨과 동일한 레벨을 가지는 비디오를 필터링 🤍 학습기록의 각 뉴스와 전체뉴스와의 유사도 측정 🤍 높은 유사도를 가지는 뉴스 9개를 추출 🤍 학습기록이나 레벨이 업데이트되면 추천 뉴스도 업데이트 |
ElasticSearch를 활용하여 검색 기능 최적화
- 제목 기준 검색, 스크립트 기준 검색 기능 제공
- Monstache를 사용하여 Video 데이터가 저장된 MongoDB와 실시간 연동
- 역색인(Inverted Index)을 통한 문자열 검색 속도 최적화
FE 폴더 구조
📦frontend
┣ 📂.vscode
┣ 📂node_modules
┣ 📂public
┃ ┣ 📂badge
┃ ┣ 📂level
┣ 📂src
┃ ┣ 📂api
┃ ┃ ┣ 📜badge.js
┃ ┃ ┣ 📜eventBus.js
┃ ┃ ┣ 📜history.js
┃ ┃ ┣ 📜http.js
┃ ┃ ┣ 📜recommendations.js
┃ ┃ ┣ 📜scraping.js
┃ ┃ ┣ 📜search.js
┃ ┃ ┣ 📜sentence.js
┃ ┃ ┣ 📜study.js
┃ ┃ ┣ 📜test.js
┃ ┃ ┣ 📜user.js
┃ ┃ ┣ 📜video.js
┃ ┃ ┣ 📜voca.js
┃ ┃ ┗ 📜youtubeSetup.js
┃ ┣ 📂assets
┃ ┃ ┣ 📂gifs
┃ ┣ 📂components
┃ ┃ ┣ 📂common
┃ ┃ ┃ ┣ 📜CategoryVideoList.vue
┃ ┃ ┃ ┣ 📜DefaultHome.vue
┃ ┃ ┃ ┣ 📜Header.vue
┃ ┃ ┃ ┣ 📜NonLoginHome.vue
┃ ┃ ┃ ┗ 📜RecommVideoList.vue
┃ ┃ ┣ 📂history
┃ ┃ ┃ ┣ 📜CompletedVideo.vue
┃ ┃ ┃ ┣ 📜LearningVideo.vue
┃ ┃ ┃ ┗ 📜Voca.vue
┃ ┃ ┣ 📂study
┃ ┃ ┃ ┣ 📜PopupDictionary.vue
┃ ┃ ┃ ┣ 📜Quiz.vue
┃ ┃ ┃ ┣ 📜QuizResult.vue
┃ ┃ ┃ ┣ 📜Script.vue
┃ ┃ ┃ ┣ 📜Shadowing.vue
┃ ┃ ┃ ┣ 📜Title.vue
┃ ┃ ┃ ┣ 📜VideoPlayer.vue
┃ ┃ ┃ ┗ 📜Voca.vue
┃ ┃ ┗ 📂user
┃ ┃ ┃ ┣ 📜RegisterInfoComponent.vue
┃ ┃ ┃ ┣ 📜RegisterLevelComponent.vue
┃ ┃ ┃ ┣ 📜RegisterLevelDetailComponent.vue
┃ ┃ ┃ ┣ 📜RegisterLevelResultComponent.vue
┃ ┃ ┃ ┗ 📜RegisterVideoComponent.vue
┃ ┣ 📂router
┃ ┃ ┗ 📜index.js
┃ ┣ 📂stores
┃ ┃ ┗ 📜userStore.js
┃ ┣ 📂views
┃ ┃ ┣ 📂common
┃ ┃ ┃ ┣ 📜HomeView.vue
┃ ┃ ┃ ┣ 📜SearchView.vue
┃ ┃ ┃ ┗ 📜VideoView.vue
┃ ┃ ┣ 📂history
┃ ┃ ┃ ┗ 📜HistoryView.vue
┃ ┃ ┣ 📂level
┃ ┃ ┃ ┗ 📜LevelView.vue
┃ ┃ ┣ 📂study
┃ ┃ ┃ ┣ 📜QuizView.vue
┃ ┃ ┃ ┗ 📜StudyView.vue
┃ ┃ ┗ 📂user
┃ ┃ ┃ ┣ 📜MyPageView.vue
┃ ┃ ┃ ┗ 📜RegisterView.vue
┃ ┣ 📜App.vue
┃ ┣ 📜config.ini
┃ ┣ 📜index.css
┃ ┗ 📜main.js
BE 폴더 구조
📦backend
┣ 📂gradle
┃ ┗ 📂wrapper
┣ 📂src
┃ ┣ 📂main
┃ ┃ ┣ 📂java
┃ ┃ ┃ ┗ 📂com
┃ ┃ ┃ ┃ ┗ 📂ssafy
┃ ┃ ┃ ┃ ┃ ┗ 📂cnnect
┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂badge
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂controller
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂dto
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂entity
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂repository
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂service
┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂config
┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂exception
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂code
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂dto
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📜GlobalException.java
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📜UnAuthorizedException.java
┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂oauth
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂controller
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂jwt
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂filter
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂repository
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂service
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂token
┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂recommendation
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂controller
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂dto
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂entity
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂repository
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂service
┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂result
┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂search
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂controller
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂dto
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂entity
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂repository
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂service
┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂user
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂controller
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂dto
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂entity
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂repository
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂service
┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂userHistory
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂controller
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂dto
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂entity
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂repository
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂service
┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂userSentence
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂controller
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂dto
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂entity
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂repository
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂service
┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂video
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂controller
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂dto
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂entity
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂repository
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂service
┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂voca
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂controller
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂dto
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂entity
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂repository
┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂service
┃ ┃ ┃ ┃ ┃ ┃ ┗ 📜CnnectApplication.java
┃ ┃ ┗ 📂resources
┃ ┃ ┃ ┗ 📜application.properties
DATA 폴더 구조
📦data
┣ 📂conf
┣ 📂data
┃ ┣ 📂csv
┃ ┃ ┗ 📜result.csv
┃ ┣ 📂ipynb
┃ ┃ ┣ 📜categorize.ipynb
┃ ┃ ┣ 📜level_video.ipynb
┃ ┃ ┗ 📜word_video.ipynb
┃ ┣ 📂json
┃ ┃ ┣ 📜addCategory.json
┃ ┃ ┣ 📜addDifficulty.json
┃ ┃ ┣ 📜cnnect_baseData.json
┃ ┃ ┗ 📜cnnect_final.json
┃ ┗ 📂py
┃ ┃ ┣ 📜category_model.h5
┃ ┃ ┣ 📜config_reader.py
┃ ┃ ┣ 📜crawling.py
┃ ┃ ┣ 📜sample.json
┃ ┃ ┣ 📜script_category.py
┃ ┃ ┣ 📜script_info.py
┃ ┃ ┣ 📜script_level.py
┃ ┃ ┗ 📜videoId.py
┣ 📂recommendation
┃ ┣ 📜config_reader.py
┃ ┣ 📜recommendedNewsByScript.py
┣ 📂test
┃ ┣ 📜leveltest.py
┃ ┣ 📜videotest.py
┣ 📜app.py
┣ 📜Dockerfile
┗ 📜requirements.txt