업사이드에 차세대 웹 기술인 PWA(Progressive Web App)을 적용하였습니다. PWA를 적용하게 되면 데이터 캐싱, 오프라인 작업, 앱 설치, 푸시 등의 기능이 가능합니다. 이 기능들을 모두 사용하는 것은 아니지만 미래를 대비하여 미리 적용해봤습니다. 그 결과 캐싱으로 인한 데이터 절약과 웹앱 설치, 서비스 업데이트 시 업데이트 알림이 가능하여 사용자에게 더 편리한 기능을 제공하게 되었습니다. 추후 가능하다면 푸시 기능도 적용할 예정입니다.

암호화폐 거래소 업사이드에서 암호화폐로 다양한 상품을 구입할 수 있는 크립토샵 개발 모바일 상품권 판매 업체인 스마트콘, 니콘내콘과 연동하여 해당 업체의 상품을 리스팅하고 상품정보 확인, 상품 구매 & 선물하기, 구매내역 확인, 환불 등 쇼핑몰과 유사한 기능들을 구현하였습니다. 주로 query-string을 활용하여 필터 리스팅을 보여주었고 상품 가격은 실시간으로 거래소의 암호화폐 가격과 연동하여 보여주고 구매할 수 있도록 구현하였습니다.

리액트를 활용하여 업사이드 개발 중 React에서 눈여겨보던 hook 기능이 정식 업데이트 되자 빠르게 적용하였습니다. 초기엔 hook 기능을 잘못 이해하여 제대로 적용하지 못하였으나 여러가지 샘플들을 학습하여 이해한 후 기존의 최적화가 되지 않은 코드와 새롭게 개발하는 기능 등 필요하다고 생각되는 곳을 class 기반에서 컴포넌트에서 hook 기반으로 성공적으로 마이그레이션 하였습니다. 불필요하거나 중복 된 코드들이 많이 줄어 간결해져서 미약하나마 코드 크기가 줄어들고 렌더링 속도도 빨라졌습니다.

거래소 회원 간에 등록된 SMS만을 이용하여 암호화폐를 전송할 수 있는 기능 입니다. 기존의 복잡한 암호화폐 송금 방식을 좀 더 간편하게 하기 위해 상대방의 휴대폰 번호와 실명만을 이용하여 OTP 인증 후 암호화폐를 즉시 송금하는 방식 입니다.

업사이드 런칭 후 시간적 여유가 생겨 그동안 바빠서 하지 못했던 코드들을 정리했습니다. 여럿이 동시다발적으로 작업을 진행하다보니 중복된 코드가 많았는데 그 중에 경고, 모달 창들이 제각각 만들어져있어 공통 컴포넌트로 만들어 공유하였습니다. 또한 source-map-explorer를 활용하여 크기가 큰 라이브러리나 불필요한 라이브러리들을 대체하여 전체적인 코드 사이즈를 2/3로 줄였습니다. 마지막으로 loadable-components를 활용하여 동적으로 필요한 컴포넌트를 불러오도록하여 초기 구동속도를 절반으로 줄였습니다.