DongyoungKwon

Update README.md

Showing 1 changed file with 7 additions and 113 deletions
# Teleprompter-STT
<strong>Demo Link(Only work in chrome) 👉 [https://teleprompterstt.herokuapp.com](https://teleprompterstt.herokuapp.com)</strong>
# 자율 주행차의 영상 기반 차간거리 유지 개발
## Table of Contents
- [프로젝트 소개](#-프로젝트-소개)
- [주요 기능](#-주요-기능)
- [System Architecture](#-system-architecture)
- [Directory 구조](#-directory-구조)
- [설치 방법](#-설치-방법)
- [팀원](#-팀원)
- [Reference](#-reference)
- [License](#-license)
<br><br>
## 🎙 프로젝트 소개
<!--<img src="/uploads/8b4b3fdeebdb94e49dcce865c21c0dd0/GiF.gif" width="600" height="300" />-->
<br>
- <strong>음성에 맞춰 대본을 화면에 실시간으로 출력하는 프롬프터 서비스<strong/>
- <strong>Untact시대에 화상회의에서 편하게 발표할 수 있도록 도와주는 서비스<strong/>
<br><br>
## 📜 주요 기능
- [**Web Speech API**](https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API) && [**string-similarity API**](https://www.npmjs.com/package/) 사용
- Real-time Script Output
<br><br>
## 🏛 System Architecture
<!--<img src="/uploads/64f303d19f8a59d152bd8b4cbb0dca7b/Architecture.png" width="700" height="300" align="center"/>-->
<br><br>
## 🗂 Directory 구조
```bash
Teleprompter-STT
├── client ---> Front-end [React]
│ ├── public ---> 정적 파일 보관
│ │ ├── index.html
│ │ ├── manifest.json
│ │ └── robots.txt
│ ├── src
│ │ ├── components
│ │ │ └── Teleprompter.js ---> 음성인식 && 문장유사도 수행
│ │ ├── pages
│ │ │ ├── MainPage.js ---> 메인 화면
│ │ │ └── PrompterPage.js ---> 대본 출력 화면
│ │ ├── App.css
│ │ ├── App.js ---> Router
│ │ ├── App.test.js
│ │ ├── index.css
│ │ ├── index.js
│ │ ├── reportWebVitals.js
│ │ ├── serviceWorker.js
│ │ ├── setupTests.js
│ │ └── styles.js ---> PrompterPage.js Style
│ ├── .gitignore
│ ├── package-lock.json
│ └── package.json
├── .gitignore
├── LICENSE ---> MIT License
├── package-lock.json
├── package.json
├── README.md
└── server.js ---> Back-end [Node.js Express]
```
## 프로젝트 소개
* 딥러닝을 이용하여 저렴하고 데이터 처리가 용이한 카메라를 통한 영상인식 기술을 활용해 차간 거리를 일정하게 유지하며 주행하는 Adaptive Cruise Control기능을 구현한다.
<br><br>
## :keyboard: 설치 방법
#### ☝️ React & Express 서버 동시 구동 (Local Server로 동작)
##### client 폴더 이동
`$ cd Teleprompter-STT/client`
##### React에 필요한 모듈 설치
`$ npm install`
##### Teleprompter-STT 폴더 이동
`$ cd ..`
##### Node.js에 필요한 모듈 설치
`$ npm install`
##### React & Express 서버 동시 시작
`$ npm run dev`
<br>
#### ✌️ Express 서버로만 구동 (Heroku로 배포 가능)
##### client 폴더 이동
`$ cd Teleprompter-STT/client`
##### React에 필요한 모듈 설치
`$ npm install`
##### Build File 생성
`$ npm run build`
##### Teleprompter-STT 폴더 이동
`$ cd ..`
##### Node.js에 필요한 모듈 설치
`$ npm install`
##### Express 서버 시작
`$ npm run server`
<br><br>
## 👥 팀원
## 팀원
- 권동영 (2016110307)
- 김다솔 (2017110268)
<br><br>
## 📋 Reference
- [**Web Speech API**](https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API)
- [**string-similarity API**](https://www.npmjs.com/package/)
- [**Material-Ui**](https://material-ui.com/)
<br><br>
## 📋 License
Teleprompter-STT is [MIT licensed](./LICENSE).
<br><br>
[👆Back To The Top](#teleprompter-stt)
\ No newline at end of file
- 신동해 (2018110651)
<br><br>
\ No newline at end of file
......