300번 만들었어요. 가위바위보 웹 앱.

만든 응용 프로그램


방법


이것은 가위바위보를 보낸'손'프로그래밍 전투의 응용 프로그램이다.
예를 들면 돌만 나오는 A 군의 프로그램.
B군의 프로그램은 주먹과 주먹을 번갈아 나갑니다.
300번을 치면...
B군이 이겼습니다.
이렇게 가위바위보 알고리즘을 생각하고 싸우는 응용 프로그램.

예제


A군의 프로그램
HAND = 0
B군의 프로그램
HAND = 1
if COUNT % 2 == 0:
    HAND = 0
싸우라고 하면

결과는 이렇다.
이것은 인터넷에서 놀 수 있는 응용 프로그램이다.

시스템 구성


이번에 사용한 물건은 다음과 같다.
  • Vue.js
  • Buefy
  • AWS
  • serverless framework
  • dynamodb
  • firebase
  • circleCI
  • 프런트엔드에는 Vue 및 Beufy가 사용됩니다.
    같은 화면을 자주 만들어서 바삭바삭하게 만들었어요.
    백엔드에서 우리는 서버리스 프레임워크에서 AWS 서비스를 구축했다.
    접근이 불안정한 서비스가 될 수 있기 때문에 이 프레임워크를 사용했습니다.
    관리와 인증은 Firebase를 사용했습니다.
    사실 AWS니까 다 정리하는 게 좋을 것 같아요.
    Firebase는 무료로 사용할 수 있기 때문에 이걸 사용했습니다.
    공짜 틀도 있고 전부 공짜예요.
    원래 RDB를 쓰려고 했는데 돈이 없어서 억지로dynamodb로 했어요(반성)

    기능


    가위바위보 프로그램


    가위바위보 알고리즘을 실시할 때, 우리는 시스템 변수를 준비하기로 결정했다.
    변수 이름
    유형
    개요
    HAND
    Intger
    0~2의 수치를 대입하면 고조키파가 나온다
    WIN
    Intger
    이긴 수
    LOSE
    Intger
    음수
    DROW
    Intger
    사랑의 수량
    P
    List
    자기가 보낸 손 이력서.
    E
    List
    상대편 경력
    COUNT
    Intger
    대전 횟수
    만약 네가 100번 졌다면, 너는 돌멩이 같은 프로그램을 쓸 수 있을 것이다
    HAND = 1
    if LOSE >= 100:
        HAND = 0
    

    인코딩 화면


    하이라이트와 들여쓰기 기능을 원하기 때문에 이번에는'Codemirror'를 사용했습니다.
    Vue에서 사용할 때 "vue-codemirror"를 사용하면 단일 구성 요소에서 사용할 수 있기 때문에 매우 편안하게 할 수 있습니다.

    순위 기능


    차트의 실시는'일로레딘'을 사용했다.
    이로레틴은 대전형 경기에 사용되며 상대적인 강도를 평가한다.
    이에 따라 이번 차트에서는 여기에 투고한 프로그램이 모두 적중해 순위가 결정됐다.
    참조: 순환
    https://ja.wikipedia.org/wiki/%E3%82%A4%E3%83%AD%E3%83%AC%E3%83%BC%E3%83%86%E3%82%A3%E3%83%B3%E3%82%B0

    인증 기능


    이번에는 한 사람이 여러 프로그램을 투고하지 못하도록 인증 기능을 추가했다.
    Github에서 인증할 수 있도록 Firebase Authentication을 사용했습니다.

    감상


    자신이 구상한 물건이 모두 나왔기 때문에 매우 만족스럽다.
    다만 안전성과 가위바위보 절차가 완비되지 않을 수 있기 때문에 앞으로도 운영과 개발을 하고 싶다.

    좋은 웹페이지 즐겨찾기