KimSangLab

1. 도커란?

  리눅스의 응용 프로그램들을 소프트웨어 컨테이너 안에 배치시키는 일을 자동화하는 오픈 소스 프로젝트 

  (출처 : 위키백과)

2. 설치 

  해당 명령을 우분투 터미널(Terminal)에 입력 한다. 

    #저장소 정보 최신화

  2.1 sudo apt-get update

    # 도커 작동에 필요한 패키지 설치 

  2.2 sudo apt-get install apt-transport-https ca-certificates curl software-properties-common

    # Docker GPG 키 추가

  2.3 curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo apt-key add -

    #도커 저장소 정보 추가(arch=값은 설치 환경에 따라 다름) 

  2.4 sudo add-apt-repository "deb [arch=amd64] https://download.docker.com/linux/ubuntu bionic stable"

    #도커 저장소 정보를 추가 했기 때문에 실행 해야 도커 관련 정보 수집 가능 

  2.5 sudo apt-get update

    #도커 최신 버전 설치 

  2.6 sudo apt-get install docker-ce docker-ce-cli containerd.io

 3. 명령어 

    링크 참조 =>  docs.docker.com/engine/reference/commandline/docker/

설치 방법 참조

  => docs.docker.com/engine/install/ubuntu/

pandas는 데이터 조작 및 분석을 위한 파이썬 라이브러리 

pandas.pydata.org/

자주 사용하는 유용한 함수 2가지 정리 

1. info()

 => 데이터프레임의 각 열의 이름, 데이터 갯수와 타입 등 정보를 출력

2. describe()

 => 열에 대한 통계를 출력(평균, 최소, 최대, 표준편차 등)

넘파이 배열은 True, False 값을 통해 행을 선택 할 수 있다. 

ex)

 arr = np.array(['A', 'B', 'C', 'D',])

 print(arr[[True, True, False, False]])

 => ['A' 'B'] 

github.com/indiespirit/react-native-chart-kit

프로젝트 진행 중 그래프 출력을 해야하는 로직이 있어 react-native-chart-kit 을 사용함. 

여러가지 그래프 출력 함수를 제공하지만 가장 기본인 LineChart를 사용하였으며, 그래프 작성시 필요한 값은  datasets->data 배열에 저장해둠.

이 data 배열을 동적으로 변경해야하는 경우 아래 코드와 같이 이전 값을 복사 한 뒤 data 배열 값 업데이트 후 setState 함수를 통해 변경된 값을 적용하면 화면이 랜더링 되면서 변경된 값으로 새로운 그래프를 출력함. 

단말(안드로이드) <-> 서버 통신을 통해 인증 및 데이터를 송수신 하는 App 을 개발하던 중 특정 단말기(안드로이드)에서 통신이 안되는 문제가 발생하여 원인을 찾던중 안드로이드 9.0 파이(Pie)로 업데이트 되면서 API 주소, 이미지 주소 등 네트워크 경로가 https 가 아닌 http로 되어 있기 때문에 발생하는 문제로 확인됨. 

안드로이드 9.0 파이는 https 를 사용하도록 강제하며 주소가 http인 경우 통신이 안되는 문제가 발생하여 해결 방법을 정리 하고자 함. 

해결 방법 1 

 => App 내에서 통신에 사용되는 주소를 http -> https 로 변경한다. 

해결 방법 2

 => res/xml/network_security_config.xml 파일을 생성하고 하단 내용을 기입한다. 

  => AndroidManifest.xml 파일을 아래 처럼 변경한다. 

해결 방법 3

 => AndroidManifest.xml 파일에 usesCleartextTraffic 관련 옵션을 추가 한다. 

해결 방법은 대략 3가지 정도가 있는것으로 확인 했으며 해당 프로젝트는 3번 방법을 통해 통신이 정상 작동 하는것을 확인 했지만 1번 방법이 가장 좋을것 같아 추후에 API 주소를 변경하고자 함. 

출처 : https://stackoverflow.com/questions/45940861/android-8-cleartext-http-traffic-not-permitted

Fork한 Repository 를 최신으로 동기화하는 방법은 다음과 같다. 

 1. 원본 Repository 를 Remote Repository 로 추가 해야한다. 

  => git remote add [Repository Name] [Repository Address]

  => git remote -v 로 등록된 Repository 목록을 확인 할 수 있다. 

2. git fetch 명령을 통해 최신 내용을 가져온다. 

  => git fetch [Repository Name] 

3. 최신 내용을 master branch 또는 원하는 branch로 merge 한다. 

  => git checkout [branch name] (merge 할 branch를 변경 하고 싶은 경우 사용)

  => git merge [Repository Name]/[Branch] 

4. 위 내용은 Local Repository에 적용한 것이므로 push 를 통해 Remote Repository에도 적용 시켜주어야 한다. 

  => git push [Repository Name] 

LifeCycle API는 컴포넌트가 브라우저에 나타날때, 사라질때, 업데이트 될때 호출되는 API를 말한다. 

1. constructor

  => 컴포넌트가 새로 만들어 질때 호출되는 함수 

2. componentWillMount

  => 컴포넌트가 화면에 출력되기 직전에 호출되는 함수. v16.3 에서는 해당 API가 deprecated 됨.

3. componentDidMount

  => 컴포넌트가 화면에 출력될때 호출되는 함수. 외부 라이브러리 연동 및 데이터 요청등에 주로 사용.

4. componentWillReceiveProps 

  => 새로운 props를 받게 되었을때 호출. 주로 state -> props에 따라 변해야 하는 로직을 작성함. 새로 받게될 props는 nextProps로 조회 가능 하며 this.props는 변경전 값임. 

5. componentWillUnmount

  => 등록한 이벤트 제거 및 사용한 라이브러리 dispose등 호출하는데 이용함.

1. props 

  => 부모 컴포넌트가 자식 컴포넌트에게 주는 값. 자식 컴포넌트는 받아온 props 값 수정 불가 

  => 받아온 값은 this. 키워드를 통해 확인 가능함.

  => static defaultProps 를 통해 기본 props 설정 가능 

2. state 

  => 컴포넌트 내부에서 선언하며 내부에서 값 변경 가능함. 

  => state = { 변수 : 값} 형태로 선언함.

  => state 값을 변경하고 싶은 경우 this.setState 를 사용. 해당 함수를 거치면 컴포넌트가 렌더링 되도록 설계 되어 있음.

1. let / const 

  => const 로 변수를 정의하면 해당 변수에는 값을 재할당 할 수 없다. 

  => let 또는 var로 선언된 변수는 재할당 가능하며, let으로 선언된 변수는 선언된 블록에서만 사용 가능하다.

2. 모듈 불러오기 

  => 컴포넌트와 자바스크립 모듈을 내보내기 위해 CommonJS 모듈 문법을 주로 사용 하지만 ES6 모듈 문법에서는 export 와 import 문법을 사용한다.

  => import Component from 'Path'

       class MyComponent extends Component{

      .....

      } 

       export default MyComponent;

3. 비 구조화 

  => react는 import 할때 리액트 객체 자체가 넘어 온다. 

    import React from "react";

    let Component = React.Component; 를 아래 문법으로 대체할 수 있다. 

  => import React, {Component} from "react";

리액트 네이티브가 지원하는 모든 UI 요소를 살펴볼수 있다.

꼭 분석 해볼것!!