2023-Winter-Bootcamp-Team-K

🐣Talk-Taka

아이들의 “오늘 하루 있었던 일”을 주제로 캐릭터와 음성채팅으로 대화를 나누며 하루를 돌아보고 기록해주는 서비스

🔗Medium

It's English.ver!

🎥Demo

Sign up and Login	Main Page

Real-time Conversation with Character	Photo Capture

Generating Illustrated Diary Based on Conversation	Viewing Past Diaries

🖥️System Architecture

🛠️Tech Stack

Frontend

Backend

Storage

Monitoring

DevOps

Tool

🗄️DataBase

📤API

📺Monitoring

🧑🏼‍💻How To Start

1. Clone Repository

$ git clone https://github.com/2023-Winter-Bootcamp-Team-K/talk-taka.git

2. Backend 환경변수 및 my_settings.py 설정

talk-taka/.env

# django
SECRET_KEY=

# mysql
DB_USERNAME=
DB_DATABASE=
DB_USER_PASSWORD=
DB_ROOT_PASSWORD=

# openai
OPENAI_API_KEY=

# aws S3
AWS_ACCESS_KEY_ID=
AWS_SECRET_ACCESS_KEY=
AWS_STORAGE_BUCKET_NAME=
FILE_URL=

# STT, TTS
CLOVA_STT_ID=
CLOVA_STT_SECRET=
CLOVA_TTS_ID=
CLOVA_TTS_SECRET=

#CELERY 
CELERY_BROKER_URL=
CELERY_RESULT_BACKEND=
CELERY_ACCEPT_CONTENT=
CELERY_TASK_SERIALIZER=
CELERY_RESULT_SERIALIZER=

talk-taka/backend/backend/config/my_settings.py

from pathlib import Path
import os
from dotenv import load_dotenv
load_dotenv()

BASE_DIR = Path(__file__).resolve().parent.parent


DATABASES = {
    'default': {
        'ENGINE': ,
        "NAME": ,
        "USER": ,
        "PASSWORD": ,
        "HOST": ,
        "PORT": ,
        'OPTIONS': {
                    'charset': 'utf8mb4',
                },
        "time-zone": "Asia/Seoul"
    },
}

SECRET_KEY = {
    
}

3. docker-compose 실행

talk-taka/

$ docker-compose -f docker-compose.deploy.yml up --build -d

📂Directory

Click


|-- backend
|   |-- Pipfile
|   |-- README.md
|   |-- backend
|   |   |-- Dockerfile
|   |   |-- Pipfile
|   |   |-- apps
|   |   |   |-- __init__.py
|   |   |   |-- admin.py
|   |   |   |-- apps.py
|   |   |   |-- chat_consumer.py
|   |   |   |-- models.py
|   |   |   |-- routing.py
|   |   |   |-- serializers.py
|   |   |   |-- tasks.py
|   |   |   |-- tests.py
|   |   |   |-- urls.py
|   |   |   `-- views.py
|   |   |-- config
|   |   |   |-- __init__.py
|   |   |   |-- asgi.py
|   |   |   |-- celery.py
|   |   |   |-- settings.py
|   |   |   |-- urls.py
|   |   |   `-- wsgi.py
|   |   |-- diary
|   |   |   |-- __init__.py
|   |   |   |-- admin.py
|   |   |   |-- apps.py
|   |   |   |-- models.py
|   |   |   |-- tasks.py
|   |   |   |-- tests.py
|   |   |   |-- urls.py
|   |   |   |-- utils.py
|   |   |   `-- views.py
|   |   |-- main
|   |   |   |-- __init__.py
|   |   |   |-- admin.py
|   |   |   |-- apps.py
|   |   |   |-- models.py
|   |   |   |-- tests.py
|   |   |   |-- urls.py
|   |   |   `-- views.py
|   |   |-- manage.py
|   |   |-- requirements.txt
|   |   |-- storage.py
|   |   |-- stt.py
|   |   |-- tts.py
|   |   `-- users
|   |       |-- __init__.py
|   |       |-- admin.py
|   |       |-- apps.py
|   |       |-- models.py
|   |       |-- serializers.py
|   |       |-- tests.py
|   |       |-- urls.py
|   |       `-- views.py
|   `-- monitoring
|       |-- grafana
|       |   |-- Dockerfile
|       |   |-- grafana.ini
|       |   `-- provisioning
|       |       |-- dashboards
|       |       |   |-- Docker\ Prometheus\ Monitoring.json
|       |       |   `-- dashboard.yml
|       |       `-- datasources
|       |           `-- datasource.yml
|       `-- prometheus
|           `-- prometheus.yml
|
|-- frontend
|   |-- Dockerfile
|   |-- index.html
|   |-- package.json
|   |-- public
|   |   `-- mockServiceWorker.js
|   |-- src
|   |   |-- App.tsx
|   |   |-- LoadingFallback.tsx
|   |   |-- PrivateRoute.tsx
|   |   |-- api
|   |   |   |-- calender
|   |   |   |   `-- calender.ts
|   |   |   |-- config.ts
|   |   |   `-- diary.ts
|   |   |-- assets
|   |   |   |-- SVG.tsx
|   |   |   |-- img
|   |   |   |   |-- 404.png
|   |   |   |   |-- BlackMic.png
|   |   |   |   |-- Chat_bg.png
|   |   |   |   |-- Cover.png
|   |   |   |   |-- DefaultBookCover.png
|   |   |   |   |-- DefaultResultImage.png
|   |   |   |   |-- Diary_Text.png
|   |   |   |   |-- Diary_Text_P.png
|   |   |   |   |-- Diary_bg.png
|   |   |   |   |-- F5.png
|   |   |   |   |-- HeartBubble.png
|   |   |   |   |-- LoadingQuaka.png
|   |   |   |   |-- LoginPage_p_bg.png
|   |   |   |   |-- Login_bg.png
|   |   |   |   |-- MainBG.png
|   |   |   |   |-- Main_bg.png
|   |   |   |   |-- Mic.png
|   |   |   |   |-- QuitIcon.png
|   |   |   |   |-- QuitIcon2.png
|   |   |   |   |-- SpeakingQuakka.png
|   |   |   |   |-- book.png
|   |   |   |   |-- checkb.png
|   |   |   |   |-- diaryRightSide.png
|   |   |   |   |-- introP.png
|   |   |   |   |-- mainP.png
|   |   |   |   |-- mingcute_voice-fill.svg
|   |   |   |   |-- t.png
|   |   |   |   |-- \354\235\270\355\212\270\353\241\234\355\216\230\354\235\264\354\247\200.png
|   |   |   |   `-- \354\277\274\354\271\264.png
|   |   |   `-- lottie
|   |   |       |-- Animation\ -\ 1704999772308.json
|   |   |       |-- Load.json
|   |   |       `-- Mic.json
|   |   |-- components
|   |   |   |-- calender
|   |   |   |   |-- Calender.tsx
|   |   |   |   `-- CalenderStyle.tsx
|   |   |   |-- common
|   |   |   |   |-- AudioRecorder.tsx
|   |   |   |   |-- Btn.tsx
|   |   |   |   |-- Camera.tsx
|   |   |   |   |-- CharComponent.tsx
|   |   |   |   |-- ChatHistoryInfo.tsx
|   |   |   |   |-- ChatInfo.tsx
|   |   |   |   |-- Chatting.tsx
|   |   |   |   |-- ChattingResult.tsx
|   |   |   |   |-- Diary.tsx
|   |   |   |   |-- Face.tsx
|   |   |   |   |-- LoginInput.tsx
|   |   |   |   |-- MyMessage.tsx
|   |   |   |   `-- OpponentMessage.tsx
|   |   |   |-- gif
|   |   |   |   |-- Loading.tsx
|   |   |   |   |-- Mic.tsx
|   |   |   |   `-- Voice.tsx
|   |   |   `-- modal
|   |   |       |-- CameraModal.tsx
|   |   |       |-- ImageModal.tsx
|   |   |       |-- LoadingModal.tsx
|   |   |       `-- Modal.tsx
|   |   |-- hooks
|   |   |   `-- useInput.ts
|   |   |-- main.tsx
|   |   |-- mocks
|   |   |   `-- servers.ts
|   |   |-- pages
|   |   |   |-- BookCover.tsx
|   |   |   |-- ChatPage.tsx
|   |   |   |-- DiaryPage.tsx
|   |   |   |-- Forbidden.tsx
|   |   |   |-- IntroPage.tsx
|   |   |   |-- LogInPage.tsx
|   |   |   |-- MainPage.tsx
|   |   |   |-- Result.tsx
|   |   |   `-- SignupPage.tsx
|   |   |-- router.tsx
|   |   |-- stores
|   |   |   |-- chat.ts
|   |   |   `-- toggle.ts
|   |   |-- styles
|   |   |   `-- GlobalStyle.ts
|   |   |-- utils
|   |   |   `-- cookie.ts
|   |   `-- vite-env.d.ts
|   |-- tsconfig.json
|   |-- tsconfig.node.json
|   |-- vite.config.ts
|   `-- yarn.lock
|-- init-letsencrypt.sh
|-- docker-compose.deploy.yml
|-- docker-compose.yml
`-- nginx
    |-- Dockerfile
    |-- nginx.conf
    `-- nginx.deploy.conf