군대를 갔다와서 컴퓨터를 사고나니 플러터 버전이 달라져있어 프로젝트를 처음부터 다시 만들기로 했다. 그래서 새 컴퓨터에서 새 개발환경을 다시 세팅해 기존 소스코드를 참고하여 처음부터 개발을 시작했다. 방학이 끝나고 개강한 뒤 학교 기숙사로 왔다. 데스크탑을 가져올까 하다가 그냥 노트북만 들고왔는데, 노트북에는 플러터 2.0 버전과 구버전의 안드로이드 스튜디오가 깔려 있는 상황 2021년에 처음 이 앱을 개발하던 시기의 개발환경이 세팅되어 있는 상태였다. 안드로이드 스튜디오에서 제공하는 flutter 업데이트 기능을 이용해 flutter를 업데이트하고, chocolate 를 이용해 dart-sdk 도 설치했다. flutter doctor 를 검색해보니 분명 자바가 이미 깔려있는데 java version 을..
악보에 태그 기능을 달면 더 좋겠다는 아이디어가 생각났다. 블로그 태그 같이 자유롭게 여러개를 다는 기능보다는 작성자가 직접 난이도와 곡 장르를 정해진 태그 중 골라서 매기는 기능이다. 이 기능이 추가되면 사용자들이 좀 더 편하게 악보를 찾을 수 있을 것이다. 난이도와 장르를 구분하지 않고 이렇게 enum 하나에 묶은 뒤, 각 값마다 태그의 배경색과 보여질 내용을 하드코딩했다. 난이도와 장르를 enum 하나에 묶은 이유는 Flutter의 Chip 이라는 기본 위젯을 가볍게 커스터마이징해서 Tag 라는 커스텀 위젯을 만들었는데, 이 Tag 라는 위젯에 TagContent 라는 하나의 enum 을 넘겨서 장르와 레벨을 모두 표현하고 싶었기 때문이다. enum을 구분하면 위젯도 GenreTag, LevelTa..
기본적인 기능은 어느정도 만들어졌다고 생각해서 플레이스토어에 한번 출시해보기로 마음먹었다. 구글 개발자 계정은 전에 만들어두었다. 근데 앱을 등록하는 절차가 정말 복잡했다. 앱 정보 뿐만 아니라, 미국 세금 관련 정보, 국내 결제 정보 같은 것도 입력해야하는데 낯선 부분이 정말 많았다. 앱 아이콘을 간단하게 만드는 방법을 검색해서 피그마로 만들었다. 그래픽 이미지는 어디에 쓰이는 건지 모르겠다. 앱 링크 공유하면 나오는 이미지라는데 해보니까 앱 아이콘으로 나오던데..? 1학년때 디디입 수업을 들으면서 앱 아이콘 디자인 과제를 해본 게 조금 도움이 되었다. 진짜 너무 힘들었던 수업인데 이럴 때 도움이 되네.. 스크린샷을 올려준다. 같은 태블릿 스크린샷인데 10인치에 사이즈가 안맞는다고 안올라가서 당황했다...
지금까지는 아이디어를 결과로 보여준다는 느낌으로, 떠오르는 생각들을 바로 구현해 나갔었다. 설계를 해보려고 했는데 머릿속에 다 정리된 내용을 손으로 다시 하나하나 옮기려니 단순작업을 하는 느낌이었기 때문에 의지가 생기지 않았다. 그러다 그룹 기능을 구현하던 중 고민거리가 생겼다. 내가 의도하는 그룹의 기능은 일종의 밴드 그룹같은 느낌이다. 특정 유저끼리 모여서 그룹을 구성하면 그 그룹에서 매주 정기공연을 한다고 하자. 그럼 매주 정기 공연마다 연주할 악보 셋리스트가 달라질 것이다. 그래서 그룹을 만들면 일정을 만들고, 매 일정마다 어떤 악보들을 넣을지 고를 수 있도록 기능을 만들었다. 예를 들어, 위 화면 같은 경우, 테스트 라는 일정에서 '내 손을 잡아' 의 악보를 넣은 상황이다. 이렇게 일정마다 악보..
말출을 나오면서 컴퓨터를 하나 새로 장만했다. 60만원대 정도로 적당히 샀는데, 게임도 잘 돌아가고 개발 환경도 아주 좋아졌다ㅎㅎ 밖에서 개발하는 김에 오랜만에 입대직전까지 진행했던 이 프로젝트를 이어서 해보려고 했다. 아아... 플러터 SDK 버전이 달라서 그런지 스택오버플로우를 검색해가며 Gradle 파일을 수정해봤는데 뭔가 문제가 있는 듯 하다. 이전에 개발하면서 사용했던 라이브러리 일부도 deprecated 되면서 사용을 권장하지 않게 되었다. 2년동안 방치했더니 그동안 너무 많은 것이 바뀌어버렸다. 이걸 하나하나 수정을 하기에는 힘들어 보이기도 하고, 이 프로젝트를 너무 오랫동안 방치한 탓에 나도 이 프로젝트의 코드 구조를 까먹어 버린 상태라 이왕 이렇게 된 거 다시 구조도 복기할 겸 코드를 새..
이 앱의 메인 기능인 악보에 대한 CRUD 구현이 모두 끝나서 주변 기능들을 구현하기 시작했다. 1. '좋아요', Key 조절 기능 추가 악보 뷰어 페이지에서 악보에 좋아요를 누를 수 있도록 버튼을 만들고, 마이페이지에서는 내가 좋아요 표시한 악보를 모아서 볼 수 있도록 했다. 이를 위해서 자동 스크롤 UI 위치를 하단으로 수정했다. 좋아요 버튼을 상단 앱바에 넣고 싶었기 때문이다. 그리고 하단에 자동 스크롤 UI만 덩그러니 넣으니 허전해서 마침 구현하려고 했었던 악보 키를 조절하는 버튼도 넣었다. UI가 나름 괜찮아졌다 ㅎㅎ 지금 악보는 내가 미리 좋아요 표시를 해두어서 색이 칠해진 하트 모양이다. 좋아요를 표시하지 않은 악보는 색이 칠해져 있지 않다. 지금 포스팅을 쓰면서 생각해보니 하트 색을 빨간색..
원래는 악보를 구성할 때, 페이지 별로 구성하는 것을 생각했었다. verse 페이지 작성하고, chorus 페이지 작성하고, bridge 페이지를 각각 만든다음 '전체' 페이지에는 각 페이지에 작성한 코드를 이리저리 조합해서 만들자! 이게 내 처음 아이디어였는데, 생각보다 '전체' 페이지에서 각 페이지의 코드를 합치는게 복잡했다. 단순히 각 페이지의 코드를 읽어서 붙이는 것이라면 상관없겠지만, (사실 이것도 구현하기가 너무 귀찮았다.) 이왕 각 페이지의 코드를 참조하는거, '전체페이지의 코드'와 '각 페이지의 코드' 를 서로 연동해서 전체 페이지에서 수정한 코드가 각 페이지에서도 수정되고, 각 페이지에서 수정한 코드가 전체에서도 수정되도록 하고 싶었다. 이걸 구현하려면, 결국 모든 코드셀에대해 Globa..
악보에 대해 CRUD 구현을 완료했다. 그리고 백엔드를 오라클 클라우드를 이용한 리눅스 서버에서, BaaS인 파이어베이스로 이전했다. Firebase 로 이전한 배경 악보에 대해 수정과 삭제를 진행하기 위해서는 악보를 작성한 작성자를 구분할 수 있어야 한다. 유저 인증 기능을 손수 구현한다면 내가 생각하기에 DB에 아이디와 비밀번호를 저장해놓고 사용자가 입력하면 입력값을 DB의 데이터와 단순 비교하여 체크하는 방식으로 했을 것이다. 비밀번호의 경우, 데이터를 그대로 저장하는게 아니라 해시를 사용한다고 들었다. 또 여기저기에서 주워들은 이야기로는 토큰이니 세션과 쿠키니 그런 것으로 유저 인증을 한다고 들었는데, "아이디 + 비밀번호 + 해시" 이 3가지 조합외에 기술을 사용하는 이유는 아직 와닿지 않았다...
악보 편집 기능의 핵심 기능을 완성했다. 3일 동안의 커밋 내역이다. 변경사항이 정말 많다. 3일동안 밥먹고 자는 시간 빼고 플러터로 코딩만 했다... (코딩 : 아키텍처 고안 : 디버깅,플러터 공부 = 3 : 2 : 5 정도 인 듯하다.) 1. DB에 코드를 저장하고, 저장한 코드를 불러오는 기능을 구현했다. 딱 '코드'만 저장하는게 아니라 코드를 포함한 줄 건너뜀과 같은 부분도 저장하도록 했다. 2. 코드셀을 보여줄 때, 높이가 높아지면 아래 코드가 키보드와 버튼 UI에 가려지는 문제를 수정했다. 원래 Scaffold() 위젯의 body 속성으로 코드셀을 넣어주고, 커스텀키보드와 버튼UI를 bottom 속성에 넣었었다. 그런데 bottom 속성은 기본적으로 body위에 스택처럼 덮어서 UI를 보여주는..
코드 구성요소 분류하기 이틀동안, 커스텀 키보드로 입력한 코드 구성요소를 따로따로 저장하고 저장한 요소를 조합하여 코드로 띄우는 기능을 만들었다. 이때 코드 구성요소를 저장하는 방법때문에 삽질을 많이 했다.. 코드 구성요소는 다음과 같다. 루트, 루트#/b, 루트 텐션, 마이너, 마이너텐션, 메이저, 메이저텐션, 텐션#/b, 텐션, ASDA, ASDA텐션, 베이스, 베이스#/b 이렇게 구성요소가 매우 많은 데에는 텐션의 위치가 여러군데 가능하기 때문이다. C2 와 같은 코드는 루트가 C이고, 루트 텐션이 2인 것으로 보았다. 루트 텐션과 그냥 텐션을 나눈 이유는 간단하다. C2(#9) 과 같은 코드를 작성하기 위해서이다. ASDA는 add, sus, dim, aug 의 첫글자를 따서 지었다. 저 4가지 ..
