swm-hackathon-4 / our-awesome-game

서울 열린데이터 광장에서 제공하는 우리말문제 데이터를 활용한 맞춤법 게임

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

센터가 좋아요

맞춤법 게임

목차

0. 팀 소개

1. 개요

2. 데이터베이스 스키마

3. 구성도

4. 백엔드 API 명세서

5. 동작 구현

6. 실행 화면

7. 바람

0. 👋팀 소개

image

  • 팀 이름 : 센터가 좋아요

  • 팀장 : 정혜일

  • 팀원 : 정혜일, 박창환, 김찬혁, 이상현, 오승진, 양성훈

  • 역할 :

프론트 백엔드
- 양성훈
- 김찬혁
- 오승진
- 정혜일
- 박창환
- 이상현



1. 📝개요

  • 공공데이터를 활용한 맞춤법 게임

인터넷에는 이런 문장이 유머로 떠돕니다. ‘마마잃은 중천공’, ‘일해라 절해라 하지 마’. 누리꾼들이 올린 실화에서 따온 문장들입니다. 남아 일언 중천금이 마마잃은 중천공으로, 이래라저래라 하지 마가 일해라 절해라 하지 마로 변형된 것인데요. 틀린 맞춤법의 극단적인 예시입니다.
다들 위의 문장들을 보고 웃으셨나요? 실소라도 흘리셨나요? 그렇다면 여러분은, ‘뵈요’/‘봬요’, ‘해도 되?’/‘해도 돼?’, ‘뭐에요?’/‘뭐예요?’. 둘 중 어떤 것이 옳은지 구별할 수 있으신가요?
이러한 문제점을 해결하기 위해 맞춤법 문제 공공데이터를 활용하여 맞춤법 게임을 통해 맞춤법 실력을 증진시키고자 이 프로젝트를 진행하였습니다.

2. 📋데이터베이스 스키마

DB 스키마
MySQL DB schema



3. 📈구성도

  • Usecase Diagram
usecase diagram
UseCase Diagram
  • Component Diagram
package diagram
Package Diagram



4. 백엔드 API 명세서

백엔드 Flask 서버 API 명세서

GET /getQuizList

서울 열린데이터 광장에서 제공하는 우리말 문제 데이터를 클라이언트 측에서 요청한 개수(num)만큼 무작위로 제공한다.

https://flask-awesome-game-rhmph.run.goorm.io/getQuizList?num=5

Request Params

num         int

Response

[
    {
        "PB": ""다음 ( )속의 띄어쓰기가 틀린 것은?",
        "CHOICES": "앞서 (지적한 바와) 같다.",
                           "우리는 이제 결사 항전을 (성언하는 바이다).",
                            "(내 능력 밖의) 일이다.",
                           "(공부 밖에) 모르는 학생이다."
        "ANS": 3
    },
    ...
]

POST /insertUser

클라이언트 측에서 사용자의 이메일, 닉네임, 점수 데이터를 받아 데이터베이스에 삽입한다. 새로운 사용자인 경우에는 데이터베이스에 삽입하고, 기존에 있는 사용자인 경우에는 클라이언트에서 요청한 점수가 데이터베이스에 있는 점수보다 크거나 같을 때만 해당 사용자의 닉네임과 점수를 갱신한다.

https://flask-awesome-game-rhmph.run.goorm.io/insertUser

Request Params

email         string
name         string
score         int

Response

  • 정상적으로 데이터베이스에 삽입 된 경우

{
    "status_code": 200,
    "result": True
}

  • 정상적으로 데이터베이스에 삽입되지 않은 경우

{
    "status_code": 400,
    "result": False
}

GET /getScoreList

유저의 닉네임과 점수를 제공한다.

https://flask-awesome-game-rhmph.run.goorm.io/getScoreList

Response

[
    {
        "NICK": "email_inputtemp12aa3",
        "SCORE": 1234
    },
    ...
]

5. 📐동작 구현

  1. 웹페이지에 접속 시 게임 UI가 나타남
  2. 게임시작 버튼을 누르면 getQuizList url을 통해 문제를 랜덤하게 가져옴
  3. 1문제에 10초의 제한시간을 주고 시간안에 풀지 못하거나 오답을 선택할 시 라이프 1개 감소함
  4. 라이프를 모두 소진했을 시 게임이 끝나고 닉네임과 이메일을 insertUser url을 통해 score와 사용자 정보를 업데이트함
  5. getScoreList url을 통해 랭킹을 가져옴

6. 👀실행 화면

메인 화면
메인 화면

게임 화면
게임 화면

정답 화면
정답 화면

오답 화면
오답 화면

사용자 정보 화면
사용자 정보 화면

랭크 화면
랭크 화면



7. 🎈바람

망가졌던 우리의 언어습관과 부족했던 맞춤법 지식을 게임을 통해 향상시키면서 재미도 느꼈으면 좋겠다. 맞춤법 게임을 통해 즐겁게 맞춤법 실력을 향상시킬 수 있게 되고 사회적으로 문제였던 맞춤법 문제를 해결할 수 있다.



image

About

서울 열린데이터 광장에서 제공하는 우리말문제 데이터를 활용한 맞춤법 게임


Languages

Language:JavaScript 68.9%Language:Python 15.8%Language:SCSS 9.9%Language:HTML 4.7%Language:Shell 0.7%