hwasuk528/TOBY

SSAFY 특화 프로젝트

JavaScript

🐇 토비의 당근 밭

삼성 청년 SW 교육

AI를 기반으로 한 미취학 아동 교육

프로젝트 기간 : 2024.02.19 - 2024.04.05 (7주)

📚 목차

1️⃣ [프로젝트 개요](#프로젝트 개요)
2️⃣ [서비스 소개](#서비스 소개)
3️⃣ 기술 스택
4️⃣ [SW Document](#SW Document)
5️⃣ [기능 소개](#기능 소개)
6️⃣ 사용 방법
7️⃣ [팀 소개](#팀 소개)
8️⃣ [설치 및 시작하기](#설치 및 시작하기)
9️⃣ 라이센스

🌳 프로젝트 개요

기획 기간 : 2024.02.19 - 2024.02.28

설계 기간 : 2024.02.28 - 2024.03.08

프로젝트 개발 : 2024.03.08 - 2024.03.29

테스트 기간 : 2024.03.29 - 2024.04.08

💡 서비스 소개

미취학 아동이 체험형 스토리를 통해 언어 및 올바른 행동양식을 학습하는 서비스

체험형 스토리에서 주된 사용 기술은 사물인식, 모션인식, 그림인식이 있다.

🎦 동영상

⚒️ 기술 스택

✓ Deploy

AWS EC2
Docker
Docker-compose
Nginx
Jenkins

✓ Front-End

Node JS
TypeScript
React
styled-components
Redux
EsLint
React-Query

✓ Back-End

Java 17
Spring Boot
Spring Security
Spring Data JPA
OAuth
JWT
Gradle
Python
Lombok

✓ DB

MySQL
Redis

✓ Collaboration

Git-Lab
Notion
JIRA
MattarMost
ERD Cloud
Figma
FigJam

✓ AI Model

Object Detection
Drawing
Emotion Detection

✏️ SW Document

📊 ERD Diagram

🏗 System Architecture

🔮 핵심기술

Spring Security
KafKa
AI모델 : inceptionV3, doodle, mobileNet

🚀 Git Flow

💾 기능 소개

로그인 화면

튜토리얼 처음 유저를 위한 안내페이지

메인 화면

AI모델 Object Quiz

AI모델 Emotion Quiz

AI모델 Drawing Quiz
분석 화면 (미완료)

스토리 클리어 기념사진 당근밭 화면

🐣 팀 구성

팀원

🎲 라이센스

주요 사용 라이브러리

react-signature-canvas
- https://www.npmjs.com/package/react-signature-canvas
react-webcam
- https://www.npmjs.com/package/react-webcam
react-calendar
- https://www.npmjs.com/package/react-calendar
react-datepicker
- https://www.npmjs.com/package/react-datepicker

참고 사이트