ChoboIT

개발 중이던 Android 앱의 특정 기능들을 다른 ReactNative 앱과 결합할 일이 생겼다. 그래서 가장 먼저 Android 앱에서 필요한 기능들을 하나의 라이브러리 모듈로 통합을 해두었고, ReactNative 앱에서 생성된 Android Project 에 모듈을 Import 해주었다. 해당 모듈에는 필요한 기능들을 모두 사용하는 Activity 까지 넣어두었기 때문에, ReactNative 앱에서 Activity 를 호출해주기만 하면 됐다. 다만, 본 글에서는 ReactNative 에서 Android Project 를 생성하고, Android Project 내에서 ReactNative 에서 사용할 수 있는 함수를 어떻게 만들고, 호출하는지에 대해 정리한다. 1. Create React Nati..

JWT 는 JSON Web Token 의 약자로, 서버 API 를 호출할 때 토큰으로 주로 사용된다. JWT 는 크게 Header, Payload, Signature 라 불리는 세 개의 부분으로 나눌 수 있다. Header 에는 인코딩 알고리즘과 토큰의 타입을 정의하는 내용을 담고 있고, Payload 는 JWT 에 넣고 싶은 데이터를 가진다. 마지막으로, Signature 는 Header 와 Payload 의 내용을 검증할 때 사용한다. JWT 문자열을 생성하는 것은 jwt.io 홈페이지에서 해볼 수 있다. 이제 본 글의 목적에 맞게 JWT 문자열을 디코딩하여, 인코딩 했을 때의 JSON 값들을 추출하는 코드를 구현해보자. 우선, 디코딩을 하고자 하는 JWT 값을 선정한다. 본 글에서는 jwt.io 페..

Android App 뿐만 아니라, 화면을 보여주는 전자 제품들의 대부분은 디스플레이 출력에서 많은 전력을 소모한다. 심지어 Android App 은 적은 배터리 용량으로 돌아가기 때문에, 배터리 효율을 위해서 디스플레이가 자동으로 꺼지도록 설정이 되어있다. 하지만, 앱을 개발하다보면 디스플레이가 자동으로 꺼지지 않도록 하고 싶은 경우가 존재한다. 예를 들어, 영화나 동영상 감상을 할 때나, 어떤 작업을 하다가도 생각할 시간이 자주 필요한 상황이다. 그럴 때는 Android Device 가 Awake 상태를 유지하도록 해줘야한다. 출처 : https://developer.android.com/training/scheduling/wakelock 1. 대안책 1-1) DownloadManager 만약 앱이 ..

개발을 하다보면 예상치 못한 에러를 자주 마주하게 된다. 보통 Android 앱을 개발할 때, 가상 머신이나 실제 기기를 PC 와 연결하여 Android Studio 의 Logcat 이나 Run 창을 확인하면서 에러의 내용을 파악하고, 그에 맞게 코드를 수정한다. 그런데, Logcat 이 가끔씩 연결이 끊겨서 실시간으로 로그를 볼 수 없는 경우나 디버깅 모드가 지원되지 않는 기기에 APK 를 설치하여 테스트해야하는 경우 등, PC 와 연결하지 못한 상태에서 에러가 발생하는 경우도 흔하다. 그럴 때는 보통 전후 과정을 확인하고, 어디에서 오류가 발생했을 지 추측을 하여 에러를 잡는다. 하지만, 에러문을 직접 눈으로 확인하지 못하기 때문에 불확실한 추측으로 코드를 수정하게 될 수도 있다. 게다가, 디버그 상..

Firebase 와 Android App 을 연동하면, Firebase 에서 제공하는 다양한 서비스들을 이용할 수 있다. 앱 크래쉬나 ANR 종료 등을 리포트 받을 수 있는 Firebase Crashlytics, 푸쉬 알림을 보낼 수 있는 Firebase Cloud Messaging(FCM), 각종 통계 수치를 볼 수 있는 Firebase Analytics 등등... Firebase 와 연동하여 다양한 서비스들을 제공 받을 수 있다. 위에 예로 든 서비스 외에도 다양한 서비스들을 Android App 과 연동하기 위해서는 Firebase Console 에서 "google-service.json" 파일을 발급 받아서 App 프로젝트 내에 넣어줘야한다. 이제 Firebase 와 Android App 을 연동..

RadarChartView 직접 만들기 : 2. Creating a View Class RadarChartView 직접 만들기 : 1. CustomView Overview 개발을 하다보면 외부 라이브러리를 쓰기 보다는 직접 필요한 라이브러리를 만들어서 쓰고 싶은 낭만(?) 같은게 생긴다. 특히, 필자는 나만의 CustomVie choboit.tistory.com 이전 글에서는 CustomView 클래스를 만드는 방법에 대해 정리했다. 이번 글에서는 CustomView 에서 직접 그려보는 방법에 대해 정리한다. 본 글은 Android Developer 공식 문서를 기반으로 작성한다. 출처 : https://developer.android.com/develop/ui/views/layout/custom-vie..

RadarChartView 직접 만들기 : 1. CustomView Overview 개발을 하다보면 외부 라이브러리를 쓰기 보다는 직접 필요한 라이브러리를 만들어서 쓰고 싶은 낭만(?) 같은게 생긴다. 특히, 필자는 나만의 CustomView 를 만들고 싶다는 생각이 Android 를 처음 choboit.tistory.com 지난 글에서는 CustomView 에 대한 이론적인 내용을 다뤄보았다. 이번에는 CustomView 를 만드는 기본적인 방법에 대해 기술한다. 출처(공식 문서) : https://developer.android.com/develop/ui/views/layout/custom-views/create-view 1. Overview 잘 만들어진 CustomView 는 마치 잘 만들어진 Cl..

1. Device Brand import android.os.Build val deviceBrand = Build.BRAND 2. Device Manufacturer import android.os.Build val deviceManufacturer = Build.MANUFACTURER 3. Device Model Name import android.os.Build val deviceModel = Build.MODEL 4. Device ID import android.provider.Settings val deviceId = Settings.secure.getString(context.contentResolver, Settings.Secure.ANDROID_ID) 5. Android OS Version ..

본 글은 W3C 의 MusicXML 공식 문서를 기반으로 작성한다. 이전 글은 MusicXML 의 기초적인 내용을 정리했다. 이번 글에서는 MusicXML 의 구조에 대해 알아보고, 더 많은 MusicXML 문법을 정리한다. 1. Adapting Musical Scores to a Hierarchy 이전 글에서 다뤄봤던 예시 악보는 한마디만 있는 간단한 악보였다. 이번에는 더 많은 Part 와 더 많은 Measure(마디) 로 이루어진 악보를 예시로 삼아서 학습한다. 보통 XML 은 계층구조로 데이터를 표시하지만, 실제 악보는 계층 구조보다는 격자(Lattice) 구조에 가깝다. 그렇다면 MusicXML 은 XML 과 실제 악보 간의 구조적 차이를 어떻게 극복하였는지 알아보자. MusicXML 은 2가지..

본 글은 W3c 의 MusicXML 4.0 문서를 기반으로 작성하였습니다. 링크 : https://www.w3.org/2021/06/musicxml40/tutorial/introduction/ Introduction | MusicXML 4.0 MusicXML 4.0 > Tutorial > Introduction Introduction MusicXML is a digital sheet music interchange and distribution format. The goal is to create a universal format for common Western music notation, similar to the role that the MP3 format serves for record www.w..

본 글은 MusicXML 을 공부하던 중, 에 대한 이해를 위해서 "음자리표" 와 관련된 지식이 필요하다 생각되어 따로 정리하게 되었다. 혹시나 음악과 관련된 배경 지식이 전무하거나 잘 모르는 개발자들을 위해 정리하면 좋을 것 같아 본 글을 쓰게 되었다. 본 글의 목표는 MusicXML 의 에 대한 이해를 돕기 위함이므로, "음자리표"에 대해 깊이 있는 지식을 기술하지 않는다. 1. 우리가 보통 보게 되는 음자리표 보통 주변에서 악기를 다룰 줄 안다고 하면, 피아노, 플룻, 바이올린, 드럼, 기타, 베이스 등등이 흔하다. 그 중에서 "음자리표" 를 가장 많이 사용하는 악기는 클래식 음악 쪽으로, 피아노, 플룻, 바이올린 등이 해당된다. 대표적인 예시로 든 3개의 악기는 공통적으로 "높은음자리표" 를 사용..

1. AngularJS ( Angular 1.+ ) - 2010.10 AngularJS 는 이름에서 알 수 있듯이 JavaScript 를 기반으로 만들어진 오픈 소스 프론트엔드 웹 애플리케이션 프레임워크이다. 싱글 페이지 애플리케이션 개발 중에 마주치는 여러 문제들을 해결하기 위해 개발되었다. 2009년에 Google 직원인 Misko Hevery 와 Adam Abrons 가 공동 개발하였으며, 현재는 Google 뿐만 아니라 개별 커뮤니티 및 여러 회사에 의해 유지보수 되고 있다. [ 싱글 페이지 애플리케이션 (SPA)] Sing-Page Application 은 서버로부터 완전히 새로운 페이지를 불러오지 않고, 현재의 페이지를 동적으로 다시 작성함으로써 사용자와 소통하는 웹 애플리케이션이나 웹 사이트..

[Ionic] Ionic Angular 입문 및 Photo Gallery 앱 만들기 Cross-Platform Mobile App Development: Ionic Framework Ionic Framework's app development platform builds amazing cross-platform mobile, web, and desktop apps all with one shared code base and open-.. choboit.tistory.com 이전 글에서 Ionic 에 대한 전반적인 지식과 첫 가이드 앱인 Photo Gallery 앱을 웹 버전으로 만들어보았다. 사진을 찍고, Grid 형태의 앨범으로 찍은 사진을 보여주며, 촬영한 사진을 Filesystem 에 저장하는 것까..

Cross-Platform Mobile App Development: Ionic Framework Ionic Framework's app development platform builds amazing cross-platform mobile, web, and desktop apps all with one shared code base and open-web standards. ionicframework.com Android 와 iOS 뿐만 아니라 웹까지 다양한 멀티 플랫폼의 애플리케이션을 개발할 수 있는 프레임워크들이 있다. ReactNative, Ionic, Xamarin, Flutter 가 있다. 그 중에서 Ionic 에 대한 공부를 해볼 예정이다. Ionic 은 Apache Cordova 를 사용하..

FTP 를 통해 원격 서버의 코드를 다운 받을 일이 생겨서 Mac 에서 사용할 수 있는 FTP 프로그램들을 알아보았다. 그 중에서 Mac 의 FTP 프로그램은 Cyberduck 이 대표적이라는 말을 듣고, Cyberduck 을 접하게 됐다. 무료 버전을 쓸까 했지만, App Store 에서 단돈 3만원에 판매를 하고 있어서 과감히 유료 버전을 구매했다. 1. EC2 서버와 연결 1-1) [새 연결] 클릭 1-2) [SFTP (SSH File Transfer Protocol)] 선택 1-3) 서버 주소, 사용자 이름, 비밀번호 입력 EC2 서버의 주소라 하면, "ec2-" 로 시작해서 "~.amazonaws.com" 으로 끝나는 주소가 있을 것이다. 해당 주소를 복사해주면 된다. 그리고, 서버에 접속 가능..

개발 환경 - M1 Macbook (2021) - macOS Monterey 12.3.1 보통 원격 서버에 접속할 때, 터미널 프로그램을 사용해서 접속한다. 필자는 iTerm 을 사용해서 SSH 원격 접속을 하며, 터미널 창에서 명령어를 통해 원격 서버를 뒤적뒤적 한다. 그런데, 원격 서버에 있는 서버 코드를 수정하거나, 읽어야할 때 터미널 창은 조금 불편하다. Vi 나 Nano 가 있기는 하지만, VSCode 와 같은 에디터에 적응된 필자는 터미널에서 코드를 읽는게 불편했다. 그렇다고 원격 서버에 VSCode 를 설치해서 사용하자니, 뭔가 아깝다는 생각이 들었다. 그래서 원격 서버의 폴더나 파일들을 VSCode 에서 바로 볼 수 있고, 수정이 가능한 환경 구축이 가능하지 않을까 찾아보게 되었다. 가능한..

개발을 하다보면 외부 라이브러리를 쓰기 보다는 직접 필요한 라이브러리를 만들어서 쓰고 싶은 낭만(?) 같은게 생긴다. 특히, 필자는 나만의 CustomView 를 만들고 싶다는 생각이 Android 를 처음 접한 순간부터 존재했다. 하지만, 이것저것 공부해야한다는 핑계로 미루다 지금이라도 결심을 하고 진행해보려한다. 살짝 나만의 스터디 프로젝트 같은 느낌으로 진행할 예정이다. 먼저, CustomView 에 대한 이론(Overview)을 살펴본 후, RadarChart 를 출력하는 RadarChartView 를 만든다. 그리고, 필자의 최종 Goal 은 "MusicXML 파일을 악보로 출력하는 악보뷰를 만드는 것"이다. 불가능할지도 모르고, 거대한 삽질을 하게될지도 모른다. 하지만, 삽질하는 과정도 재밌기..

지난 글에서는 Zoom SDK 를 초기화하고, Video SDK 의 Session 을 생성하는 방법까지 정리했다. 이번 글에서는 생성된 Session 에서 Video Rendering 을 추가해보고, 그 외에 기능들에 대해 정리한다. 1. Render a User's Video Zoom SDK 를 사용하는 목적은 대부분 화상 회의 기능을 구현하기 위해서이다. 그리고 화상 회의 기능의 핵심은 회의실 생성, 그리고 "회의 참여자들의 모습을 보여주는 기능" 이다. Video SDK 는 당연하게도 회의 참여자의 모습을 보여주는 기능을 제공한다. Video Rendering 을 구현하기 위해서는 다음의 작업 과정들이 필요하다. Session 에 참여한 사용자들의 ZoomVideoSDKUser 객체 획득 각 사용자..

지난 글에서 Zoom Video SDK 가 어떤 SDK 인지에 대해 정리했다. 이번 글에서는 Video SDK 를 사용하는 기초적인 방법에 대해 정리한다. 본 글은 공식 문서의 Essential Guides 를 기반으로 정리한다. 0. Integrate SDK Zoom Marketplace 에서 Video SDK 를 활성화한 계정으로 로그인을 한 뒤, SDK 페이지에서 SDK 를 다운 받는다. 좌측에 있는 플랫폼을 선택하고, 가장 최신 버전의 SDK 를 [Download] 한다. 본 글은 Android 에서 Video SDK 를 적용시켜보는 과정을 정리할 것이기 때문에, Android 의 SDK 를 다운로드 받았다. SDK 만 있는 것이 아니라, 샘플 앱 자체가 다운로드 된 것을 확인할 수 있다. 여기서..

Android Zoom Meeting SDK 2 : Integrate SDK 공식 문서 URL : https://marketplace.zoom.us/docs/sdk/native-sdks/introduction 지난 글에서는 Zoom SDK 에 대해 간단히 알아보고, 데모 앱 중 하나인 "sample" 앱을 실행시켜보았다. 이제는 Zoom Meeting.. choboit.tistory.com 약 한달 전, Android Zoom Meeting SDK 를 적용해본 경험을 글로 게시한 적이 있다. 그 때는 Zoom Meeting SDK 를 사용한 것이었고, Meeting SDK 에서 UI 커스텀까지 해보려 했으나, 좀 더 커스텀이 자유로운 SDK 가 있어서 Meeting SDK 는 중도 하차했다. 커스텀이 더..