7P by studroid 2021-08-26 | favorite | 댓글 7개

크로스 플랫폼 개발 프레임워크인 Flutter로 만든, 주짓수 대회용 점수판을 공개해봅니다 :)

- GitHub Pages에 실행 가능한 웹 버전이 있습니다.
- Flutter로 만들었기에 각종 환경(PC, 안드로이드, iOS)에서 동작 가능한 버전으로 빌드할 수 있습니다.

동작하는 기능 리스트는 다음과 같습니다.

- 타이머: 시작/일시정지/시간 변경/6분으로 되돌림
- 소리: 타이머 시작 시, 종료 시, 리셋 후 다시 시작 시 삐~! 소리 출력
- 선수 이름 입력
- 각 선수마다 4점/3점/2점 단위의 점수 올리기/내리기
- 각 선수마다 Advantage/Penalty 부여
- 총점 계산
- 점수판 리셋

이걸 만든 이유는 다음과 같습니다.

- 이런저런 이유로...! Flutter에 흥미를 느껴 학습을 하고 아아주 간단한 앱을 만들어본 적이 있었는데요
- 주짓수를 1년 정도 배우고 있었는데, 제가 다니던 도장에서 대회를 열게 됐습니다.
- 대회에서 사용할 점수판이 모바일 앱으로는 있는데, 유용하게 쓸 만한 데스크탑 앱이 없다는 얘기가 나왔고 (=선수 또는 관계자들이 점수를 확인할 수 없고, 심판도 안내 부담)
- 제가 개발을 한다는 사실을 알던 분들께서 반 장난으로 '어, 이거 만드실 수 있지 않아요!?'
- 근데 이 말을 듣고 문득 Flutter가 진짜 효용을 발휘할 아이템이라는 생각이 들어...!
- 주말에 만들어서 대회에서 쓰게 됐고, 지금도 쓰이고 있습니다.

기존 점수판과의 차이는
- 기능상으로는 거의 같습니다.
- 다만 브라우저에서 확인할 수 있고, 브라우저 사이즈에 따라 상하좌우 크기가 다 바뀝니다.
- 즉 모바일 포함 어디서나 사용할 수 있는 점수판입니다.
- 스크린 높이값에 따라 글씨 크기가 동적으로 바뀝니다.

Flutter에서 쓰이는 GetX라는 라이브러리를 사용해 상태 관리를 했고,
개발 구성의 복잡도는 높지 않은 편이라, 컴포넌트 기반으로 MVC 패턴을 사용해 UI/Logic/Data를 분리해 코드를 만들었습니다.

Flutter의 기반 언어인 Dart로 만들어져 있고, 한번 살펴보시고 각종 의견과 피드백 & 어떠한 관심이든 주시면 매우 감사하겠습니다!!

Flutter로 Web개발을 말로만 들었지 첨봅니다.
개발자도구로보니깐 Web을 개발한다기보단
브라우저에서 돌아가는 App을 만든것 같네요.
대단하십니다.~~ 능력자!!

@misolab 맞습니다, 캔버스에 그리는 식이라 완전히 그냥 앱을 얹어놓은 거죠...

사실 저도 Flutter Web 개발을 말로만 들은 후, Flutter로 블로그를 만들어봐야겠다! 생각했지만 이 생각은 고이 접어뒀습니다...

기본적으로 검색 엔진에 걸리질 않겠더라고요....;

아마 구글 검색 엔진은 해주지 않을까요? 괜히 이상한 검색봇들은 내용을 못가져갈테니 오히려 더 청정구역이 될지도요... ^^;

그럴 수도 있겠는데요...!? ㅎㅎㅎ 저도 관심을 가지고 계속 보고 있는데, 빠르게 발전 중이니 기대해볼 법한 듯합니다 ㅎㅎ

구글봇은 크롬기반이어서 어느정도 가능하다고는 하는데요.
SEO 제대로 하려면 봇용 HTML 버전을 따로 만들어주라는 얘기가 대부분인듯 합니다.

아쉽게도 주짓수를 전혀 몰라서..
근데 대회에서 쓰신다고 하셨으니, 리더보드 형태로 기존 점수 기록을 저장할 수 있으면 좋지 않을까 생각해봤습니다.
선수별로 로그인을 하거나 해서, 선수 별 히스토리도 가능할 것 같아서요.

그리고, 제가 자주 쓰는 앱중에 보드게임 플레이 기록앱인 BG Stats 라는 앱이 있는데,
특정 상대랑 싸웠을 때 몇번/몇점차이로 이겼는지 등, 상대별 승률 통계를 보여주는게 기억이 납니다.
https://www.bgstatsapp.com/

@xguru

우와, 선수 이력 관리까지 가능한 플랫폼으로 진화할 수 있겠는데요...! 인사이트 넘치는 의견 감사합니다!!

BG Stats, 보드게임 플레이 기록 앱이라니...! 저도 몇 가지 한정으로 보드 게임을 꽤 좋아하는 편인데, 엄청난 앱이네요...!

주짓수에도 점수가 있다 보니, 정말 참고할 만한 컨텐츠가 많은 거 같습니다.

참고 리소스까지 정말 감사합니다!!