개요

안드로이드 스튜디오 IDE에서 쉽게 아이콘 이미지를 얻어오는 방법을 찾아서 포스팅합니다.  

저같은 경우 주로 사용되는 픽토그램 이미지를 https://material.io/ 사이트를 자주 이용했었는데요, IDE 내에서도 쉽게 이미지 리소스를 검색하고 프로젝트에 적용할 수 있는 좋은 방법이 있습니다.

먼저 안드로이드 스튜디오 상단 바의 Tools > Resource Manager 탭을 선택하여 하단의 이미지와 같이 Resource Manager 탭을 띄워줍니다.

이후 Resource Manager 탭 하단의 + 버튼을 선택하여 Vector Asset 탭을 선택해줍니다.

선택 시 아래와 같이 Asset Studio 라는 윈도우창이 뜨게됩니다.

Asset Type : Clip Art 타입을 선택해줍니다.

Name : 아이콘 이름을 설정합니다.

Clip Art :  이미지 선택 시 아래의 Select Icon 윈도우 창이 뜨면서 필요한 이미지를 선택할 수 있습니다.

Size : 이미지의 사이즈를 조정합니다.

Color : 원하는 색상으로 이미지를 변환 할 수 있습니다.

Opacity : 이미지의 투명도를 설정할 수 있습니다.

위와 같이 아이콘을 설정 및 필요한 이미지로 가공 후 Next 버튼을 눌러줍니다. 이후 저장 위치를 확인 후 Finish 버튼을 눌러줍니다.

이후 아래의 이미지처럼 저장한 이미지를 불러와서 사용할 수 있습니다.

간단하게 IDE 자체적으로 제공하는 기능으로 이미지 리소스를 다운로드 하는 방법을 알아봤습니다. 

같은 안드로이드 개발자 분들께 도움이 되었으면 좋겠습니다 ^0^

RDP 사용 중 갑자기 연결에 실패하는 현상이 발생하여 해결 방법을 공유합니다.

먼저 해당 오류코드로 검색하여 아래의 솔루션을 수행했는데도 문제가 발생하는 경우 도움이 될 것 같습니다.

1. 제어판\시스템 및 보안\Windows Defender 방화벽\허용되는 앱 경로에서

원격 데스크톱

원격 지원

두가지 옵션을 활성화

2. 원격 데스크톱 연결 허용

3. 공유기 설정에서 RDP 포트포워딩

제 경우 내부 IP 주소가 변경되면서  등록해놓은 규칙의 IP와 현재 PC의 IP와 달라지면서 연결에 실패했었습니다. 

IP를 현재 PC와 동기화 시켜준 후 문제없이 동작하는 것을 확인했습니다.

AAR 라이브러리 개요

아래는 Android Developers 공식 문서에 소개된 AAR 라이브러리에 대한 설명입니다.

Android 라이브러리는 구조적으로 Android 앱 모듈과 동일합니다. Android 라이브러리에는 소스 코드, 리소스 파일, Android 매니페스트를 비롯하여 앱을 빌드하는 데 필요한 모든 항목이 포함될 수 있습니다.

하지만, 이 라이브러리는 기기에서 실행되는 APK로 컴파일되는 대신 Android 앱 모듈의 종속 항목으로 사용할 수 있는 Android 보관 파일(AAR)로 컴파일됩니다. JAR 파일과 달리, AAR 파일은 Android 애플리케이션에 다음과 같은 기능을 제공합니다.

AAR 파일에는 Android 리소스 및 매니페스트 파일이 포함될 수 있습니다. 이 파일에서는 자바 클래스 및 메서드 외에 레이아웃 및 드로어블과 같은 공유 리소스를 번들로 구성할 수 있습니다.

AAR 파일은 앱 모듈의 C/C++ 코드에서 사용할 C/C++ 라이브러리를 포함할 수 있습니다.

라이브러리 모듈은 다음과 같은 상황에 유용합니다.

활동, 서비스, UI 레이아웃 등 일부 구성요소를 동일하게 사용하는 여러 앱을 빌드하는 경우

여러 APK 변형(예: 무료 및 유료 버전)에 포함되는 앱을 빌드하며 두 버전에서 모두 동일한 핵심 구성요소가 필요한 경우

AAR 라이브러리는 안드로이드 개발자라면 build.gradle 파일에서 implementation (또는 api) 키워드를 통해 의존성에 포함하여 자주 사용하게 되는데, 필자가 소개하고자 하는 내용은 흔히 사용되는 오픈소스 라이브러리가 아닌 좀더 private한? 라이브러리를 구성했던 방법에 대해서 말하고자 합니다.

아래의 사진처럼 우리는 다양한 AAR 라이브러리를 사용하고 있습니다!

AAR 라이브러리 모듈 생성

1. File > New > New Module을 클릭합니다.

2. Create New Module 창이 표시되면 Android Library, Next를 차례로 클릭합니다.
3. 라이브러리에 이름을 지정하고 라이브러리의 코드를 위한 최소 SDK 버전을 선택한 후 Finish를 클릭합니다.

라이브러리가 생성되었다면, build.gradle 파일을 확인해보자.

//  어플리케이션을 라이브러리로 변환하여 사용하고 싶은 경우, 이 값을 위의 사진처럼 라이브러리로 변경하여 사용할 수 있다.
id 'com.android.application'

ExoPlayer2의 PlayerControlView가 일정시간이 지난 후 사라지는 현상이 있었다.

원인은 매우 간단했는데, 버그로 판단해서 버전도 변경해보고 여러가지 시도를 했었다.

xml 파일의 PlayerControllerView에 아래의 코드를 추가시켜준 후 문제가 발생하지 않았다.

        app:show_timeout="0"

Reference : https://stackoverflow.com/questions/51579006/exoplayer-show-playercontrolview-throughout-playback-of-audio-clip

VNC와 RDP

개요

팀 회의 도중 생소한 키워드를 정리하기 위해 글을 씁니다.

VNC vs RDP

VNC (Virtual Network Computing)

VNC는 RFB(Remote Frame Buffer)프로토콜 방식을 이용해 서버에서 보낸 화면 정보를 클라이언트에 설치된 그래픽 라이브러리를 이용해 그리는 방식이다.

• 사용을 위해 RFB를 전송 가능한 프로그램, 전달 받는 프로그램 (server, client)가 필요하다.
• 원격에서 화면을 보는 기능만 지원하며, 클라이언트 별로 세션을 가지지 못한다. (여러 PC에서 동시에 접속한다면 하나의 화면을 공유하게 된다.)
• VNC는 주로 클라우드 상에서 동작하는 서버 VM을 동작하기 위해서 사용하는 프로토콜이다.

RDP (Remote Desktop Protocol)

• 마이크로소프트에서 자체적으로 개발한 프로토콜이며 VNC와 다른점은 사전 설정에 따라 클라이언트 세션을 여러개 생성가능하다는점이다.
• 과거에는 Windows 운영체제만 지원했지만, 현재 Linux, mac, Android 등 다양한 운영체제를 지원한다.

Reference : https://selfish-developer.com/entry/VNC%EC%99%80-RDP

ICMP (Internet Control Message Protocol)

ICMP는 TCP/IP에서 IP 패킷을 처리할 때 발생되는 문제를 알려주는 프로토콜이다.
IP에는 오로지 패킷을 목적지에 도달시키기 위한 내용들로만 구성되어 있다.
따라서 정상적으로 목적지 호스트에 도달하는 경우에는 IP에서 통신이 성공하고 종료되므로 별도의 기능은 없다.

• 통신 유무 확인시 자주 사용되는 Windows의 ping 기능도 이 ICMP를 사용한다고 한다.
• 통신이 실패했을 떄 애러 메세지를 통해 통신에 실패하는 원인을 짐작할 수 있다.

개요

회사에서 서비스 개발 중 django server의 앞단에 nginx를 두자고 회의중에 말이 나왔었는데, 이 둘의 차이점을 좀 더 명확하게 정리하고파 포스팅 합니다.
포스팅 내용은 Youtube 우아한 테크 세미나의 알리님의 Web Server vs WAS를 참고했습니다.

Web Server란? (nginx, apache ..)

웹 브라우저(클라이언트)로 부터 HTTP 요청을 받아 HTML 문서와 같은 정적인 컨텐츠를 제공하는 프로그램

정적 컨텐츠?

• 요청 인자값에 상관없이 달라지지 않는 컨텐츠(html, css, image ..)
• 어느 사용자 요청이든 항상 동일한 컨텐츠

Web Server의 기능

• 클라이언트로부터 HTTP 요청을 받을 수 있다.
• 정적 컨텐츠(html, css, image ..)를 제공할 수 있다.
• 동적 컨텐츠 요청 시 Web Application Server로 요청을 전달할 수 있다.

Web Application Server란? (spring, django, flask ..)

DB 조회나 다양한 로직 처리를 요구하는 동적인 컨텐츠를 제공하기 위해 만들어진 프로그램

동적 컨텐츠?

• 요청 인자에 따라 바뀔 수 있는 컨텐츠

Web Application Server의 기능

• 클라이언트로 부터 HTTP 요청을 받을 수 있다. (* 대부분의 WAS는 Web Server 내장!!)
• 요청에 맞는 정적 컨텐츠(html, css, image)를 제공할 수 있다.
• DB조회나 다양한 로직 처리를 통해 동적 컨텐츠를 제공할 수 있다.

Web Server를 함께 사용하면 좋은 점은?

Web Application Server는 대부분 Web Server를 내장하고 있으므로, WAS만 활용해도 모든 요청을 처리할 수 있는게 아닐까? 라고 생각 할 수 있다.
왜 Web Server를 사용하는지 알아보자.

1. 책임 분할을 통한 서버 부하 방지

• 정적 컨텐츠는 Web Server, 동적 컨텐츠는 Web Application Server 에서 처리함으로서 서버의 부하를 방지 할 수 있다.

2. 여러 대의 WAS를 로드 밸런싱
   로드 밸런싱 : 서버에 가해지는 부하를 분산 해주는 기능

• 서버의 트래픽이 증가하여 더이상 요청을 받아들일 수 없다면 서버를 증설하여 이를 해결 할 수 있을것이다. 이 때 Web Server에서 여러 서버에 요청을 분산 시킬 수 있다.

3. 여러 대의 WAS Health Check

• 서버가 어떠한 오류로 인하여 요청을 받아들일 수 없는 상태가 된다면 오류가 발생한 서버로는 요청에 대해서 올바른 응답을 보내줄 수 없을 것이다. 이 때 Web Server 에서 WAS의 상태를 확인하여 오류가 발생한 WAS에는 요청을 전달하지 않도록 할 수 있다.

4. 보안

• 리버스 프록시 기능을 사용하여 외부에 서버의 IP를 노출시키지 않을 수 있다.

정리

서비스의 확장성, 안정성을 고려한다면 앞 단에 Web Server를 두는것이 유리할 수 있다.

소스트리에서 remote branch로 push 실패함.

오류로그에서 아래 링크가 있었음.

https://github.blog/2021-09-01-improving-git-protocol-security-github/

맥 개발환경에서 갑자기 소스트리에서 remote branch로 push되지 않는 현상 발생!

처음에는 이런 에러가 떴었다.

webview remote: Permission to username/repository.git denied to username. fatal: unable to access 'https://github.com/username/repository.git/': The requested URL returned error: 403 Completed with errors, see above

갑자기 권한 문제로 머 푸쉬가 안된다는 소리인거 같은디..

이후 소스트리 종료 후 재시작하고, 원격 저장소에서 같은 레포를 클론해봤는데 

/home/username/.ssh/config: line 4: Bad configuration option: IdentifyFile/home/username/.ssh/config: terminating, 1 bad configuration optionsfatal: The remote end hung up unexpectedly

요런 에러 발생!

ssh config 파일 쪽에서 문제가 있는 것 같아서 경로로 들어가서 파일을 봤따

cd /Users/username/.ssh

이 후 vi config 실행

이후 오류 로그에서 본 4번째 줄의 딱봐도 수상해보이는 IdentifyFile ~/.ssh/id_ed25519 를 주석처리 한 후 다시 push에 성공했다!!

Host *

  AddKeysToAgent yes

  UseKeychain yes

# IdentifyFile ~/.ssh/id_ed25519

# --- Sourcetree Generated ---

Host gogoadl-GitHub

        HostName github.com

        User gogoadl

        PreferredAuthentications publickey

        IdentityFile /Users/hyeonwoo/.ssh/gogoadl-GitHub

        UseKeychain yes

        AddKeysToAgent yes

# ----------------------------

하 이거때문에 한 한시간 버렸다 또...

같은 오류를 겪으시는 분들이 얼렁 해결하시길 ^0^

Slack을 통해 업무용 메신저를 사용할 경우 Github와 연동하여 Pull Request, Issue, push 이벤트등을 슬랙 채널으로 Notification을 보낼 수 있드라.. 이러케 하면 github와 연동된 이메일 계정이 아닌 Slack에서 Github에서 발생한 이벤트를 볼 수 있기때문에 매우 편안해진다!

먼저 Slack에 접속하여 좌측 하단의 앱 에서 앱 추가 버튼을 클릭한다

나는 이미 깃헙을 등록했으므로 깃헙이 있슴 ㅎㅅㅎ

이후 검색창에 Github 검색 후 선택해준다. 그러면 위처럼 앱 목록에 GitHub가 추가된다.

여기서 Connect Github Account를 선택해준다.

누르면 머 인증하고 코드 입력하라고 하는데 코드 입력해주면 댄다!

그럼 Github에서 Repository Access 권한같은게 뜨는데,

All repositories, Only select repositories 두가지 중 선택해야한다.

나는 처음부터 All repositories를 선택했지만, Only select repositories 선택 시 아마도 slack에서 접근가능한 repository를 선택가능한 것으로 보인다.

어쨌든 이까지 순탄하게 설정해주고 다시 Slack으로 돌아온 후 구독 할 레포지토리를 선택해주면 된다.

/github subscribe repositoryOwner/repositoryName 레포주인과 레포이름을 작성해주면 짜잔

기본적으로 issues, pulls, commits, releases, deployments에 대한 알림을 github으로 전송해준다!

테스트로 구독한 레포의 readme 파일을 변경했더니 정상적으로 Notification이 온것을 볼 수 있다.

Slack 채널에서 위와같이 세팅할 경우 협업자들의 PR, 이슈 생성 등을 빠르게 캐치가능하므로 좀더 편하게 작업 가능할것으로 보인다.

추가로 레포지토리의 owner가 아닐 경우 이런 알림을 받을 수 없는것으로 보인다. 아니면 어케하는지 알려주시구여..

owner에게 요청하여 편하게 작업하자!

새로운 프로젝트 생성 후 react-router-dom을 통해 라우팅 기능을 구현하려고 했는데, 의도한대로 동작하지 않는 상황이 있었다.

문제의 원인은 react-router-dom의 버전에 따라 사용방법이 상이할 수 있으므로, 버전에 맞는 방법을 사용하면 된다.

먼저 프로젝트의 package.json 파일에서 react-router-dom의 버전을 확인한다.

필자의 경우

6버전의 react-router-dom을 사용하고 있었으므로, 

버전에 맞는 방식으로 속성을 변경해준 후 정상적으로 작동했다.

      <BrowserRouter>
        <Navigation />
        <Routes>
          <Route path="" element={<Home />} />
          <Route path="about" element={<About />} />
        </Routes>
      </BrowserRouter>

path 속성의 / 제거

component 속성을 element로 변경