클라우드 서비스를 운영하는 것이 가용성과 확장성 측면에서 이점을 얻을 수 있다. 다만 무료가 아니며 편리함을 얻는 대신 상응하는 비용을 지불해야한다.

클라우드 서비스 만큼은 아니지만 이미 만들어진 도커 이미지를 이용하여 클라우드 서비스와 동일하지는 않지만 비슷한 효과를 누리기 위해 Docker를 서버에 설치하고자 한다.

또한 현재 토이 프로젝트가 가용성 및 확장성을 크게 고려하지 않아도 되기 때문에 Docker를 이용하고자 한다. (서비스가 커져 클라우드 서비스를 필요로 한다면 그 때 사용하면 된다.)

Goal

• 우분투 20.04에서 Docker를 설치하고 status를 확인해보자
• docker compose를 이용하여 Postgresql을 설치하자

우분투 20.04에서 Docker를 설치하는 방법

Docker를 설치하는 방법은 정말 간단히 공식문서에 적혀있는 그대로 따라하면 설치가 완료되는 것을 볼 수 있다.

이전 버전 삭제

혹시 이미 이전 버전의 도커가 설치되어 있다면 아래와 같은 명령어로 기존 설치 Docker를 제거할 수 있다.

sudo apt-get remove docker docker-engine docker.io containerd runc

도커 이미지, 컨테이너, 볼륨, 네트워크는 /var/lib/docker/에 저장되어 있으며 Docker를 제거 할 때 자동으로 제거되지 않는다. 새로 설치하고 기존의 데이터를 정리하려면 도커 엔진제거를 참조하면 된다.

Docker 설치

도커를 설치하는 흐름은 아래와 같다.

1. Docker Repository를 활성화 하기 위한 패키지 설치
2. Repository GPG 키를 가져온다.
3. Repository 설정
4. Docker 엔진을 설치한다.

1. Docker Repository를 활성화 하기 위한 패키지 설치.

Docker 저장소를 활성화 시키기 위해 패키지 설치 가능한 리스트를 최신화 후 필요한 패키지를 설치한다.

# 패키지 인덱스 최신화
sudo apt-get update

# 패키지 설치
sudo apt-get install ca-certificates \
                     curl \
                     gnupg

2. Repository GPG 키를 가져온다.

GPG 키를 추가하기 위해 공식문서에 있는 명령어를 입력한다.

sudo mkdir -m 0755 -p /etc/apt/keyrings
curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /etc/apt/keyrings/docker.gpg

3. Repository 설정

Repository 설정을 위해 공식문서에 있는 명령어를 입력한다.

echo \
  "deb [arch="$(dpkg --print-architecture)" signed-by=/etc/apt/keyrings/docker.gpg] https://download.docker.com/linux/ubuntu \
  "$(. /etc/os-release && echo "$VERSION_CODENAME")" stable" | \
  sudo tee /etc/apt/sources.list.d/docker.list > /dev/null

4. Docker 엔진을 설치한다.

설치 가능한 리스트를 최신화 후 도커 엔진을 설치한다. docker compose는 Docker 엔진을 설치할 때 plugin을 추가하여 추 후 별도로 설치하는 것이 아니라 같이 설치할 것이다.

sudo apt-get install docker-ce docker-ce-cli containerd.io docker-buildx-plugin docker-compose-plugin

Docker를 실행

Docker를 설치하고 실행하려면 아래와 같은 명령어를 입력하면 Docker가 실행된다.

sudo service docker start

Docker가 실행되고 정상적으로 Docker가 실행되고 있는지 확인하려면 service docker status명령어를 입력하면 현재 Docker의 서비스 상태를 알 수 있다.

# command
sudo service docker status

# result
● docker.service - Docker Application Container Engine
     Loaded: loaded (/lib/systemd/system/docker.service; enabled; vendor preset: enabled)
     Active: active (running) since Wed 2023-04-05 23:51:04 KST; 51min ago
TriggeredBy: ● docker.socket
       Docs: https://docs.docker.com
   Main PID: 25710 (dockerd)
      Tasks: 28
     Memory: 383.0M

# command
docker --version

# result
Docker version 23.0.3, build 3e7cbfd

# command
docker compose version

# result
Docker Compose version v2.17.2

여기서 특이한 점은 docker compose를 별도로 설치했을 때는 docker-compose명령어를 이용하여 docker compose를 사용하였었는데 plugin으로 설치를 하니 docker compose를 이용하여 사용할 수 있는 것을 볼 수 있다.

Docker compose를 이용하여 Postgresql 설치하기

명령어로 Postgresql을 Docker로 실행할 수 있지만 추 후 인프라를 재 구축 하거나 할 때 동일한 환경 구축을 위하여 Docker compose로 작성하여 실행하고자 한다.

또한 컨테이너가 삭제되거나 다른 이슈로 인해 사용하지 못하게 되었을 경우를 대비하여 볼륨을 로컬에 잡아 다음 컨테이너가 실행되더라도 데이터를 보존할 수 있다. Docker compose는 아래와 같다.

version: "3"

services:
  # 서비스 명
  postgresql:
    # 사용할 이미지
    image: postgres:15.2
    # 컨테이너 실행 시 재시작
    restart: always
    # 컨테이너명 설정
    container_name: postgres
    # 접근 포트 설정 (컨테이너 외부:컨테이너 내부)
    ports:
      - "5432:5432"
    # 환경 변수 설정
    environment:
      # PostgreSQL 계정 및 패스워드 설정 옵션, 데이터베이스 설정
      POSTGRES_USER: root
      POSTGRES_PASSWORD: "password"
      POSTGRES_DB: test
    # 볼륨 설정
    volumes:
      - ~/data/postgres/:/var/lib/postgresql/data

docker-compose.yml이라는 파일을 생성 후 설정들을 적어주었으며 docker compose로 Postgresql을 설치할 때 추가할 수 있는 옵션들의 상세는 DockerHub - Postgresql에서 확인할 수 있다.

이제 작성한 docker-compose.yml를 아래 명령어를 이용하여 실행 후 결과를 확인할 수 있다.

# command
docker compose up -d

# command (실행 중인 컨테이너 확인)
docker ps

# result
CONTAINER ID   IMAGE           COMMAND                  CREATED        STATUS        PORTS                                       NAMES
66c26a700494   postgres:15.2   "docker-entrypoint.s…"   23 hours ago   Up 22 hours   0.0.0.0:5432->5432/tcp, :::5432->5432/tcp   postgres

References

• https://docs.docker.com/engine/install/ubuntu/

• https://hub.docker.com/_/postgres

추 후 API서버와 관리자 페이지에 대한 분기가 필요하기 웹 서버 하나가 더 필요하여 Nginx를 설치하고 설치하는 방법을 기록하고자 한다.

Goal

• 우분투 20.04에서 Nginx를 설치하고 index 화면을 띄워보자

우분투 20.04에서 Nginx를 설치하는 방법

Nginx를 설치하는 방법은 간단하다 아래와 같은 명렁어를 입력해주면 끝이다.

sudo apt update # 설치 가능한 리스트 최신화
sudo apt install nginx # Nginx 설치

위와 같은 명령어를 치고 -v 명령어와 함께 입력하면 잘 설치 된 것을 볼 수 있다.

nginx -v
nginx version: nginx/1.18.0 (Ubuntu) # 작성일 기준 1.18.0 설치

Nginx를 실행

Nginx를 설치하고 실행하려면 아래와 같은 명령어를 입력하면 nginx가 실행된다.

sudo service nginx start

Nginx가 실행되고 정상적으로 Nginx가 실행되고 있는지 확인하려면 service nginx status명령어를 입력하면 현재 Nginx의 서비스 상태를 알 수 있다.

# command
sudo service nginx status

# result
 nginx.service - A high performance web server and a reverse proxy server
     Loaded: loaded (/lib/systemd/system/nginx.service; enabled; vendor preset: enabled)
     Active: active (running) since Tue 2023-04-04 21:00:24 KST; 11s ago
       Docs: man:nginx(8)
    Process: 10335 ExecStartPre=/usr/sbin/nginx -t -q -g daemon on; master_process on; (code=exited, status=0/SUCCESS)
    Process: 10341 ExecStart=/usr/sbin/nginx -g daemon on; master_process on; (code=exited, status=0/SUCCESS)
   Main PID: 10346 (nginx)
      Tasks: 7 (limit: 2333)
     Memory: 6.7M
     CGroup: /system.slice/nginx.service
             ├─10346 nginx: master process /usr/sbin/nginx -g daemon on; master_process on;
             ├─10347 nginx: worker process
             ├─10348 nginx: worker process
             ├─10349 nginx: worker process
             ├─10350 nginx: worker process
             ├─10351 nginx: worker process
             └─10352 nginx: worker process

위에 status를 토대로 확인하면 Master Process가 하나 생성된 것을 볼 수 있으며 Master Process과 관리하는 Worker Process가 생성된 것을 확인할 수 있다. Nginx가 설치 되었을 때 default로 정의 된 설정 파일을 확인해보면 worker_processes auto;와 같이 되어있다.

통상적으로 worker_processes auto;를 그대로 사용하거난 Worker Process를 Cpu 코어 수와 동일하게 설정을 한다. (코어 수 보다 더 높게도 할당이 가능하다.)

Index 화면 확인하기

기본적으로 Nginx를 설치하면 80포트를 이용하여 index 페이지에 접근이 가능해진다. Http 프로토콜을 이용하여 도메인을 입력하면 기본적으로 80포트에 접속이 된다.

어떻게 index 화면이 보여질 수 있는 건가에 대해서는 Nginx가 설치 되었을 때 default로 정의 된 설정 파일을 확인하면 알 수 있다.

# nginx.conf
http {
   # ...
    include /etc/nginx/conf.d/*.conf;
    include /etc/nginx/sites-enabled/*;
}

# /etc/nginx/sites-enabled/default
server {
   # ...
    listen 80 default_server;
    listen [::]:80 default_server;
    root /var/www/html;
    index index.html index.htm index.nginx-debian.html;
   # ...
}

# Command
ls /var/www/html/

# Result
index.nginx-debian.html

nginx.conf파일에 include /etc/nginx/sites-enabled/*;로 인해 /etc/nginx/sites-enabled에 있는 파일들이 nginx.conf이 포함되게 되었다.

/etc/nginx/sites-enabled에는 default 설정 파일이 들어 있으며 서버 블록을 확인해보면 80포트로 들어올 때 index를 바라보게 되어있으며 index 화면에 이용될 문서들은 index.html index.htm index.nginx-debian.html;로 정의되어 있다.

그럼 마지막으로 /var/www/html경로에 어떠한 파일이 들어있는지 확인해보면 index.nginx-debian.html가 설치되어 있는 것을 볼 수 있다.

Cafe24 가상서버호스팅에서 Nginx를 설치하던 도중 발생한 문제

가상호스팅 서버에서 발생한 문제 및 해결

apt update, apt install nginx 명령어 실패

Nginx를 설치하기 위해 apt update를 이용하여 설치 리스트 최신화를 진행 후 Nginx를 설치하려 하였는데 아래와 같은 Error가 동일하게 발생하였다.

해결

방화벽 outbound 설정에서 외부로 나가는 포트가 전부 열려있지 않아서 내부 -> 외부 접속이 막혀있었던 것이 문제였음.

방화벽 outbound에서 외부 접속에 필요한 port를 open해서 해결

References

• https://www.nginx.com/

• https://www.popit.kr/%EC%8A%A4%ED%83%80%ED%8A%B8%EC%97%85-%EA%B0%9C%EB%B0%9C%EC%9E%90-%ED%98%BC%EC%9E%90-%EB%B9%A0%EB%A5%B4%EA%B2%8C-%EC%8B%B8%EA%B2%8C-%EC%84%9C%EB%B2%84-%EA%B5%AC%EC%B6%95%ED%95%98%EA%B8%B0-1%ED%8E%B8/

해당 글은 보며 진행하실 분들은 미리 Apple Developer 계정을 등록하고 진행해주시면 감사하겠습니다. - Apple Developer

Problem

Flutter로 개발한 App을 ios simulator에서만 실행하기에는 실제 핸드폰에서 어떻게 동작하는지 디버깅하기 어려움

Goal

• Flutter iphone 개발환경 구축
• Flutter App을 iphone에 빌드해서 테스트 하여 해결하기
• Error가 발생 한다면 해당 내용 기록하기

핸드폰과 mac을 연결하기

테스트를 하고자 하는 핸드폰과 mac을 연결하면 아래와 같이 핸드폰에 현재 mac을 신뢰하겠냐는 Alert이 나오게 된다.

"신뢰"를 선택하면 Finder에서 연결 된 핸드폰이 리스트에 생성된 것을 확인할 수 있으며 핸드폰의 정보들을 mac에서 확인이 가능해진다.

프로젝트에 ios 계정 등록하기

Flutter 프로젝트에서 아래와 같은 명령어를 입력하면 해당 프로젝트를 Xcode에서 열 수 있다.

open ios/Runner.xcworkspace

명령어를 입력하면 Xcode에서 프로젝트가 열리게 되며 핸드폰과 mac을 연결하기에서 등록한 핸드폰을 선택할 수 있게 된다.

연결한 핸드폰을 선택하고 실행하려고 하면 아래와 같은 Error문구를 확인할 수 있다.

Error문구에 나와있는대로 "Runner"에는 개발 팀(개인)의 서명이 반드시 필요하다는 문구이다. 해당 Error는 AppleID를 "Runner"에 등록함으로 쉽게 해결할 수 있다.

AppleID를 "Runner"에 등록하는 방법은 2가지가 있다.

1. Xcode의 "Settings"의 "Accounts"탭에서 등록하는 방법.
2. "Singing & Capabilities" 에서 등록하기

AppleID를 등록한 후 "Singing & Capabilities"에서 등록한 계정을 선택해주면 해당 Error가 없어진걸 확인할 수 있다.

핸드폰에서 개발자 모드 활성화 하기

Flutter로 빌드 된 App을 실행하려면 핸드폰에서 개발자 모드가 활성화 되어있어야 한다. 개발자 모드가 활성화 되어 있지 않으면 아래와 같은 Error를 만날 수 있다.

일반적으로 설정 > 개인정보 보호 및 보안 > 개발자 모드에서 활성화 할 수 있다.

하지만 개발자 모드가 보이지 않는 경우도 있을 것이다. 해당 관련 글들을 찾아보니 Apple Developer에 등록된 기기에만 활성화가 된다는 글들이 있었다.

필자는 프로젝트에 ios 계정 등록하기를 설정 후 확인해 보니 해당 메뉴가 활성화 되어 있었다.(테스트 할 핸드폰이 Apple 개발자 계정에 등록되어 있다.)

개발자 모드를 활성화 하면 재부팅이 되며 활성화 시킬 것인지에 대한 컨펌창이 뜨게 된다. 해당 컨펌창에서 활성화 후 핸드폰 암호를 입력하면 정상적으로 개발자 모드가 활성화 된다.

개발자 모드가 정상적으로 활성화 되면 "Developer Mode disabled"가 사라진 것을 볼 수 있다.

테스트 핸드폰에 현재 Apple 개발자 신뢰

개발자 모드까지 활성화 하고 빌드하면 정상적으로 실행될 것으로 예상했지만 그렇지 못했다. 테스트 할 핸드폰에 빌드까지는 가능할지 모르겠지만 Flutter로 개발한 App은 실행되지 않는다.

프로젝트에 ios 계정 등록하기에서 등록한 개발자 계정을 신뢰하지 못한다는 alert를 만나게 된다.

1. Xcode Error

   

2. 테스트 핸드폰 Alert

   

해결방법은 간단하다 프로젝트에 ios 계정 등록하기에서 등록한 개발자 계정을 테스트 할 핸드폰에서 신뢰 설정을 해주면 된다.

일반 > VPN 및 기기 관리에 들어가면 "개발자 앱" 밑에 위에서 등록한 개발자 계정이 보일 것이다.

개발자 개정을 탭하여 신뢰 설정을 할 수 있다.

iProxy 설정

개발자 등록, 개발자 신뢰까지 진행하였으니 정상적으로 되겠지? 생각하였지만 또 하나의 Error가 발생하게 된다.

iProxy Error가 발생하는 이유는 Flutter 개발 도구 중 iOS 앱을 실행할 때 사용하는 도구가 컴퓨터 보안 설정 때문에 차단되었을 때 발생하게 된다.

문제가 발생하면 위의 사진과 같이 iproxy 개발자를 확인할 수 없다는 메시지 (macOS cannot verify the developer of “iproxy”)가 표시된다.

해결방법은 mac의 시스템 환경설정 (System Preferences) > 보안 및 개인 정보 보호 (Security & Privacy)로 들어가보면 화면 내 다음에서 다운로드한 앱 허용 (Allow apps downloaded from)을 보면 iproxy가 차단되었다는 메시지를 확인할 수 있을 것이다.

여기에서 허용(Allow anyway) 버튼을 눌러 iproxy를 허용해 주면 해당 Error를 해결할 수 있다.

빌드 후 확인

Xcode에서 테스트 핸드폰을 설정 후 실행을 해보자. 실행은 아래의 사진과 같이 플레이 버튼 처럼 생긴 버튼을 선택하면 현재 선택 된 핸드폰에 빌드를 시작한다.

빌드가 완료되면 테스트 핸드폰에 Flutter App이 설치가 되고 실행되게 된다. 성공해서 너무 기쁘다 :)

추가적으로

Flutter App을 핸드폰에서 테스트 하려면 가장 중요한 건 mac OS의 최신 소프트웨어와 Xcode의 최신버전이라 생각이 든다...!

최신이 아닐 경우 Xcode에서 지원 하는 ios버전에 한계가 있어 정상 적인 테스트가 어려워 질 수 도 있다. 실제로 이번 글을 쓰면서 해당 Error를 만났다.

위 Error를 해결하기 위해서는 iOS-DeviceSupport에서 DeviceSupport를 다운받아 추가하는 방식도 있지만 최신 버전에 대해서는 지원이 바로바로 되지 않기 때문에 Xcode의 최신 버전으로 진행하는게 좋다.

위 사진이 mac OS 버전과 Xcode의 버전 충돌이 발생한 Error이다. 이 Error 또한 이번 글을 쓰면서 만난 Error이다.

이 2개의 Error는 mac OS와 최신 Xcode를 사용하면 쉽게 해결할 수 있는 Error이다. 그렇기 때문에 최신 Xcode와 Xcode에서 요구하는 버전을 맞춰서 진행하는 것이 좋을 것 같다.

Reference

• https://es1015.tistory.com/480

• https://www.androidhuman.com/2021-07-14-flutter_ios_iproxy

• https://code-boki.tistory.com/110

• https://github.com/iGhibli/iOS-DeviceSupport/tree/master/DeviceSupport