[앱 출시 후기] One Percent : 국내주식 - 나만의 매매일지

[SeSAC 2기 iOS 앱 개발자 교육과정 수강중]

 

  2022년 9월 13일부터 (사실상 추석 전에 시작이었지만, 추석은 놀았기 때문에 패스!) 2022년 9월 30일까지 약 3주간 나의 첫 개인 앱 출시 기간을 가졌었다. 나는 국내 주식만을 다루는 매매일지 관련한 앱을 만들기로 했었고, 기획안과 사전 계획을 열심히 작성했다. 사용자들에게 매매일지뿐만 아니라 차트 패턴, 캔들 패턴, 수익률을 계산해 볼 수 있는 복리 계산기, 경제 뉴스 확인하기, 코스피 & 코스닥에 상장해 있는 종목명을 검색해서 매수/매도 추가하기 기능을 구현할 예정이었다. 아래는 Figma를 이용해 처음 앱 UI를 만들어 보았던 거다. 욕심만 많아서 이런 기능, 저런 기능 다 넣고 싶었지만..... 역시나 뺐던 기능도 매우 많다 ㅠ.ㅠ

 

웃긴 게 뭐냐면 Figma를 아예 처음 다운받아서 사용해봤다는 것이다! 🫠 (Figma에 소질이..?)

Figma를 이용한 사전 앱 UI 구성

 

  새싹 교육 과정을 시작한지 고작 2달이 되던 때 앱 출시를 한다는 소식을 들었고, 내가 할 수 있을까 하는 의문이 많이 들었다. 시작하기 전까지가 정말 두려웠고 걱정도 많았지만, 멘토님께서 팀을 구성해주셔서(비슷한 종류의 어플을 만드는 팀원들이 있어 좋았다^^) 서로 도우면서 완성해냈다. 이제부터 겪었던 일들에 대해 하나하나 써보려고 한다...!  (파트별로 나눴습니다!)

나의 첫 앱 출시! [1%]

 

---

1. 런치 스크린과 OnBoarding 화면

 

• 어려웠던 점
  1. 위치 권한 승인 띄우기 : 예전에 배웠던 CoreLocation과 CLLocationManager를 이용한 위치 불러오기가 어려웠었다. OpenWeatherAPI와 카카오 주소 API를 사용해서 사용자 위치에 따른 날씨를 띄워주기 위해서는 위치 권한이 승인이 되어야 하는데, checkCurrentLocationAuthorizationStatus 함수에 언제 어디서 무엇을 넣어주어야 하는지 감이 잘 안 왔다. 그래서 restricted, denied 되었을 때는 Alert을 띄워주고, authorizedWhenInUse일 때 API를 호출하는 식으로 구현했다.
  2. OnBoarding 페이지 : 내가 구현하고 싶었던 것은 3개의 페이지로 구성되어 있는 페이지뷰 컨트롤러인데 페이지컨트롤의 값이 마지막에 도달하였을 때만 '시작하기'를 띄워주고 싶었다. '시작하기' 버튼을 1번, 2번 페이지에는 숨겨놨다가 마지막 페이지에 도달했을 때 bottomMargin을 조절해서 띄워주는 방식으로 구현했다. (맞는 방식인지 모르겠다...)
  3. 알림 설정하기 : 맨 처음에 알림 설정을 했을 때 알림이 막 15개, 6개, 3개 등 이상하게 불규칙하게 알람이 왔었다. 왜 이렇게 오는지 전혀 보이지 않다가 출시 전에 알게 되었다... 매매일지 VC의 Viewdidload에 함수를 불러놓았다...😅 멍충이...
• 아쉬운 점
  1. 알림 설정이 원래 아침 9시에 '국내장 개장 알림'을 주는 거였는데 공휴일과 주말을 빼고 알림을 보내고 싶었으나.. 실패했다! 
  2. 굳이 또 하나 뽑자면 'OnBoarding 화면 이미지를 조금 더 멋있는 거로 할걸... '이라는 생각 ^^
• 잘했던 점 
  1. 런치 스크린 화면을 앱 아이콘의 연장선 느낌으로 디자인했는데 너무 잘한 것 같다 ㅎㅎ
  2. 알림 설정을 시도한 게 잘했던 점 같다!! 
  3. 온보딩 페이지 마지막에만 '시작하기' 버튼을 띄워주는 아이디어도 좋았다!

---

2. 복리 계산기

 

• 어려웠던 점
  1. TextField의 숫자가 들어가는데 천의 자리마다 콤마를 찍어주는 방법이 어려웠었다. 이에 관한 내용은 블로그 포스팅으로 정리해놨다!
  2. 마찬가지로 블로그 포스팅으로 정리해놓은 내용인데, TextField안에 있는 콤마가 찍힌 숫자를 계산해주기가 까다로웠다.
  3. 복리 계산 단위 선택에서 연/월/일 복리를 선택할 수 있는데 isSelect를 사용해서 하려고 했으나 잘 안되었다.. 그래서 해결법으로 UIButton의 sender와 tag값을 이용해서 처리해주었다. 
• 아쉬운 점
  1. 계산하기 버튼의 위치가 맘에 안 든다... 그냥 복리 계산 결과 위에 계산하기 버튼을 놓고 누르면 Label의 값이 변하는 걸로 했으면 좋았을 텐데 하는 아쉬움이 있다.
  2. 원금과 이자율, 투자 기간에 TextField의 자릿수 제한을 걸지 못한 게 아쉽다. 향후 업데이트 때 꼭 설정해야겠다!
• 잘했던 점 
  1. 복리 계산기로 희망 회로를 돌릴 수 있게 한다는 아이디어가 맘에 들었다!
  2. 연 / 월 / 일 복리를 선택 시 투자 기간 레이블 옆에 해당하는 복리 계산 단위를 표현해주었다. (테스트 플라이트 때 피드백받은 내용)

---

3. 차트 패턴 & 캔들 패턴

 

• 어려웠던 점
  1. 차트 패턴과 캔들 패턴 모델을 직접 만들어서 데이터를 입력해주어야 했다... (완전 노가다..)
  2. 컬렉션 뷰의 헤더 설정하는 방법이 어려웠다. 테이블 뷰는 TableViewHeader가 있는 반면에 컬렉션 뷰는 UICollectionReusableView가 있었다. 
  3. 검색하기 기능을 추가했는데 차트 패턴만 나올때는 문제가 없었으나 캔들패턴 내용만 나올때는 차트패턴 헤더 공간이 남아있었다. 왜 안 없어지나 해보다가 header의 titleLabel의 Constraints를 스냅 킷의 updateConstraints를 사용해서 height을 조절했다. 
  4. 검색하기 기능 구현이 생각보다 어려웠다. searchBar의 textDidChange 함수에서 검색어가 차트 패턴과 캔들 패턴의 모델을 돌아서 포함하고 있으면 띄워주는 방식으로 구현했다.
• 아쉬운 점
  1. 차트패턴과 캔들패턴의 내용을 더 넣고 싶다... 많이 많이... 내가 아는 모든 패턴을 알려주고 싶다...!!
  2. 차트 패턴이랑 캔들 패턴에 관한 API도 있었으면 좋겠다...🥲
• 잘했던 점 
  1. 차트 패턴과 캔들 패턴에 대한 아이디어가 좋았다 ㅎㅎㅎㅎㅎㅎ
  2. 패턴 검색 기능을 추가한 것!!
  3. 컬렉션 뷰를 구성할 때 UICollectionViewCompositionalLayout을 따로 공부해서 구현했는데 훨씬 편한 것 같다!

---

4. 경제 뉴스 - 국내 & 세계 증시

 

• 어려웠던 점
  1. 뉴스 기사 Title의 내용이 네이버 뉴스 검색 API를 이용해서 불러오는 거였는데 리턴 값이 HTML 마크다운이 표시 되어 있었다..."<b>국내 증시<\/b>는 간밤 미국 국채금리 하락 등에 따라 반등한 뉴욕 <b>증시<\/b>의 영향을 받았다." 그래서 이 HTML 마크다운을 없애기 위해서 한 2시간은 쏟은 거 같다...  아래와 같이 함수를 하나 만들어줘서 Cell에 설정할 때 text 내용에 htmlEncodedString 해줬다!
  2. 네이버 뉴스 검색 API의 리턴값 문제였는데 또 한 가지는 Date 형식의 문제였다. pubDate의 리턴 값이 "Tue, 04 Oct 2022 16:18:00 +0900" 이런 식으로 받아졌는데 저 뒤에 +0900이 TimeZone인건 알겠는데 데이트 포맷 방식이 어떻게 이루어진지 삽질 좀 하다가 "+0900"이 zzz라는 것을 알게 되었다!! "EEE, dd MMM yyyy HH:mm:ss zzz"

extension String {
    
    init?(htmlEncodedString: String) {
        
        guard let data = htmlEncodedString.data(using: .utf8) else {
            return nil
        }
        
        let options: [NSAttributedString.DocumentReadingOptionKey: Any] = [
            .documentType: NSAttributedString.DocumentType.html,
            .characterEncoding: String.Encoding.utf8.rawValue
        ]
        
        guard let attributedString = try? NSAttributedString(data: data, options: options, documentAttributes: nil) else {
            return nil
        }
        
        self.init(attributedString.string)
    }

• 아쉬운 점
  1. 국내 증시와 세계 증시 뉴스를 불러올 때 페이지 네이션을 구현했으면 좋았을 텐데 하는 아쉬움이 남는다.
  2. 추후 업데이트할 때 뉴스 저장하기 기능도 추가하려고 한다! 즐겨찾기 추가처럼 뉴스 기사도 저장할 수 있었으면 좋았을 텐데 하는 아쉬움이 남는다.
  3. 뉴스 검색도 구현하고 싶었으나... 시간상의 문제로 패스했다.
• 잘했던 점 
  1. TabMan 오픈소스 라이브러리를 이용해서 국내 증시, 세계 증시 탭을 나누어서 표현했다!
  2. SFSafariViewController라는 것을 이용해서 url을 Safari로 띄워줬다. 
  3. 뉴스 폰트가 조선일보 폰트인데 너무 맘에 든다😎

 

5. 대망의 매매일지 메인 화면

 

• 어려웠던 점
  1. 매매일지 추가하기 페이지에서 종목명을 검색하는 기능 구현이 어려웠다. 종목명은 공공데이터 API를 이용해 코스피, 코스닥에 상장되어 있는 종목들을 불러와서 테이블 뷰에 뿌려주었다.
  2. 종목명 검색하기 테이블 뷰에서 선택된 셀의 종목명이 매매일지 추가하기 종목명에 데이터를 전달하는 방법이 까다로웠다. 구글링을 통해서 delegate를 이용한 데이터 전달 방식으로 구현했다.
  3. Realm을 이용한 값 저장이 까다로웠다. 매수일 때 매도일 때 isBuy라는 Bool타입의 변수를 하나 만들었는데 sender.tag 값이 0일 때 매수, 1일 때 매도로 isBuy의 Bool 결괏값을 바꿔주었다.
  4. 매매일지 화면에서 종목을 추가하면 전일 종가를 표시해주는 기능을 구현했는데, 전일 종가를 불러오는 API에서 Date를 현재 날짜에서 가장 가까운 값 1개만 불러오도록 해서 표현했다.
• 아쉬운 점 
  1. 설정하기에서 오픈소스 라이브러리를 AcknowList라는 오픈소스를 이용해서 하려고 했지만 잘 안돼서 테이블 뷰로 그냥 만들었다. (훨씬 깔끔한 것 같기도..?)
  2. 종목을 추가하고 나서 셀 클릭 시 상세 뷰를 띄워주고 싶었다. 공공데이터 API 중에 전일 종가뿐만 아니라, 그날 상한가, 하한가도 알려주고, 전일 대비 얼마나 떨어졌는지도 알려주기 때문에 이러한 내용을 상세 뷰에 넣고 싶다.
  3. 시도하다가 실패한 것이 있는데 바로 종목 추가에 관한 Realm 데이터 수정이었다. 
     1. 만약 종목명이 같은 종목을 추가할 때 매수이면 수량과 평균 체결 단가와 총평가액을 더해주고, 매도이면 체결 단가에는 변함이 없기 때문에 수량만 빼준다.
     2. 하지만 만약 사용자가 매도를 먼저 한다면?? 매도 물량이 매수 물량보다 많을 수 없다! - 분기 처리 필요
     3. 그리고 새로운 종목에 대해서 매도를 먼저 할 수 없다.
     4. 공공데이터 API를 이용해 현재 실시간 주가를 가져올 수 없기 때문에 실시간 수익률을 제공할 수 없다.
• 잘했던 점 
  1. 종목명을 직접 검색해서 TextField에 넣어주는 기능이 좋았다!
  2. 매수인지 매도인지 Button 색을 다르게 표현해서 종목 추가했을 때 눈에 잘 띄게 만들었다.
  3. 매매일지 메인 화면에서 사용자 위치에 따른 날씨를 표현해주는 게 좋았다.
  4. 설정하기 메뉴 구성이 좋다. 푸시 알림 설정 시 설정창으로 이동하고 문의하기와 리뷰 남기기 기능도 구현했다.

---

 

🔥 최종 느낀 점 

• 내가 직접 처음부터 끝까지 Group을 나눠서 VC과 View를 따로 만들어서 관리하고 겹치는 View들은 CustomView를 만들어서 일괄적으로 처리하고, Extension을 이용한 화면 전환 관리, String과 Int, Float에 대한 함수를 설정했다. 처음이었으면 상상도 못 했을 내 모습을 보니 조금은 성장했다는 모습에 뿌듯하다. 개인 앱 출시를 끝내고 나니 홀가분함도 있지만 더욱 열심히 해야겠다는 생각이 든다. 한참 모자라고 아직 모르는 부분이 너무 많다. 오픈소스 라이브러리에 너무 의존하는 것 같아서 URLSession과 MVVM 패턴에 대해 복습해야겠다!! (사실 다 까먹은 것 같기도 하다)
• 이제는 스토리보드가 불편하다. 오히려 코드로 작성하는 게 더 편하고 관리하기도 편한 것 같다!! 
• NetWorkAPI 사용이 이제는 익숙하다. API 가이드만 봐도 어떻게 불러올지, json타입으로 받으면 어떻게 불러와야 할지 다 알겠다. 하지만 아직 XML 형식의 데이터는 다뤄본 적 없어서 다뤄보고 싶다.(오픈소스 이용하면 쉽다던데..)
• 코드를 작성하면서 항상 깔끔하게 작성하고 싶어서 최대한 겹치는 부분은 func으로 만들어서 처리하려고 했으나... 현실은 하드코딩하고 있었다... 더 많이 고민해보고 개선해보고 싶다!
• 생각보다 뺀 기능들이 많다. 처음에는 백업/복구와 수익률 표시와 종목 상세페이지 등 많은 기능이 빠졌으나 꼭 구현해보고 싶다.
• 사실은 앱 출시 기간 동안 너무 힘들었다. 항상 2-3시 넘어서 잤고, 완전 올빼미가 되어있었다. 아침에 일어나면 눈은 퉁퉁 부어서 쌍꺼풀이 생기고, 쉴 때도 머릿속엔 엑스 코드가 둥둥 떠다니니 제대로 쉬지도 못했던 것 같다. 앱 UI가 눈앞에 아른거렸고, 자면 뒤처질 것 같다는 불안함이 컸다. 남들은 이만큼 했는데 나만 안 하는 것 같고, 항상 비교하며 지냈던 것 같다. 그래서 원래 다니던 주짓수 체육관을 더 열심히 다녔다! 가서 운동하다 보면 코딩 생각은 안 나고 리프레쉬하며 버텼다! 젭에서 동기들과 또 으쌰 으쌰 하면서 힘냈던 것 같다.
• 복습이 진짜 중요하다는 걸 깨달았다. 앞으로 복습 진짜 철저히 할 거다!
• 마지막으로 제일 아쉬움이 남는 부분은 개발 공수 계산과 Iteration에 따른 개발일지 작성을 제대로 안 했다는 점이다... 어느 순간 "내일 써야지!"가 시작되면서 아예 손을 놓아버렸다... 다음 앱 출시할 땐 Iteration도 여유 있게 짜고, 개발일지도 열심히 쓰겠다!!!
• 생각보다 일찍 앱 출시가 마무리된 것 같아서 좋았다. 출시 완료 후엔 긴장이 풀렸는지 하루는 시름시름 앓았다. 체하기도 하고, 몸살 기운도 있었으나, 주말 동안 천안에 놀러 갔다 왔는데 싹 나았다!!😎
• 역시 우리 멘토님들 대단하신 것 같다...👍 앞으로 더 열심히 하겠습니다...🔥

 

 

 

 

 

 

🍎 One Percent - 국내주식 : 나만의 매매일지 앱 소개 노션 링크

https://alike-cucumber-a6f.notion.site/One-Percent-d1d31282d7b145fba21711b3fa7d6b27

One Percent - 국내주식 : 나만의 매매일지

 

 

🍎 One Percent - 국내주식 : 나만의 매매일지 앱 다운로드 링크

https://apps.apple.com/kr/app/one-percent/id1645004697

‎one percent