NginX 를  현재 서버에 설치해서 사용하는 경우, 서버의 이곳 저곳에 nginx 관련 정보들이 흩어져 있게 됩니다.

Docker로 설정할때 어려운 부분들이죠.

이를 한번 정리해보고자합니다.

0. 우선 nginx container를 하나 생성

docker run -d --name tmp-nginx nginx

docker cp 명령어를 사용하여 container의 /etc/nginx/nginx.conf 파일을 현재 프로젝트 폴더의 ./nginx/nginx.conf 로 옮긴다.

1. nginx.conf 

docker cp tmp-nginx:/etc/nginx/nginx.conf ./nginx/nginx.conf

2. config.d

docker cp tmp-nginx:/etc/nginx/conf.d ./nginx

docker-compose 파일 작성하기

services:
  api_gateway:
    image: nginx
    volumes:
      - ./nginx/nginx.conf:/etc/nginx/nginx.conf
      - ./nginx/conf.d/:/etc/nginx/conf.d
    ports:
      - 8080:80
  mywebserver:
    build: ./mywebserver
  myapiserver:
    build: ./myapiserver

Tip

1. Docker-Compose 는 어디에 있나?

docker desktop을 설치하고 나서 docker-compose 를 찾으려고 하면 안찾아져요.

이유는 path가 안걸려 있어서 그래요.

mac에서 보면 docker와 compose 의 위치가 상이합니다. (왜 이렇게 해놨는지는... 저도잘..)

docker: /Applications/Docker.app/Contents/Resources/bin/docker

docker-compose: /Applications/Docker.app/Contents/Resources/cli-plugins/docker-compose

아무튼 그래서 docker-compose를 terminal에서 실행하려면, PATH에 추가해주는 것이 좋겠죠.

export PATH="~~~~:/Applications/Docker.app/Contents/Resources/bin:/Applications/Docker.app/Contents/Resources/cli-plugins:$PATH"

windows나 linux는 또다른 위치 입니다.

[Ubuntu]

docker-compose: usr/lib/docker/cli-plugins/docker-compose

docker: /usr/bin/docker /usr/lib/docker /etc/docker /usr/local/bin/docker /usr/libexec/docker

2. Dockerfile 에서 npm build 시 error 발생하면 바로 볼수 있는 방법

RUN npm run build || cat npm-debug.log

Nivo 

https://nivo.rocks/components/

Google Fonts

https://fonts.google.com/

 VPC의 구성

VPC(Virtual Private Cloud)는 AWS의 사용자 젖용 가상 네트워크 입니다.

각 지역별 리즌들이 있고 이 리즌 내에 VPC를 구성 하는 것이죠.

VPC내에 하나 이상의 서브넷을 구성할 수 있습니다.

기본 VPC는 Amazon VPC를 사용하기 시작하는 경우 각 AWS 리전에 기본 VPC가 있습니다. 기본 VPC는 각 가용 영역의 퍼블릭 서브넷, 인터넷 게이트웨이 및 DNS 확인 활성화 설정과 함께 제공됩니다. 따라서 기본 VPC로 Amazon EC2 인스턴스를 즉시 시작할 수 있습니다. 기본 VPC에서 Elastic Load Balancing, Amazon RDS, Amazon EMR 같은 서비스를 사용할 수도 있습니다.

VPC를 생성할 경우

다음 절차에 따라 Virtual Private Cloud(VPC)를 생성합니다. VPC에서 AWS 리소스를 생성하려면 먼저 VPC에 서브넷, 라우팅 테이블, 게이트웨이와 같은 추가 리소스가 있어야 합니다

ECS

ECS 는 docker 와 달리 bridge network 를 기본 사용하지 않습니다.
host network 를 사용합니다.
즉, 하나의 Task Definition 에서 정의된 컨테이너들은 동일한 EC2 내에 호스트 네트워크를 그대로 사용한합니다.
따라서 localhost 로 컨테이너간 통신이 가능합니다.

실행 에러 exec format error

만약 실행시 위와 같은 에러가 발생했다면 아마 나처럼 M1, M2 macOS 를 사용중일 것입니다.
AWS 도 차츰 arm 아키텍처를 적극지원하지만, 아직은 대다수의 환경이 amd64(intel) 로 되어 있는 것은 어쩔 수없습니다.

원인
docker image build 는 M1 (arm64) 에서 했기 때문에 arm64 이미지를 생성한 상태고, ECS Fargate 아키텍쳐는 x86_64 (amd64) 기 때문입니다.
즉 이미지를 만든 provider와 task executor 실행 환경이 다르기 때문에 발생한 문제입니다.

Docker

• Virtual Machine : 간단히 표현하면 가상화된 PC (OS 포함)
• Container : 가상화된 운영 환경, OS 위에 가상화된 어플리케이션 실행환경

• Docker Image : 이미지를 바탕으로 container를 만듬
• Dockerfile ⇒ [Build] ⇒ Image 생성 ⇒ [Run]⇒ Container 실행

• Docker Container 상태 변화

[Service] 
Environment="HTTP_PROXY=http://proxy.example.com:80" 
Environment="HTTPS_PROXY=https://proxy.example.com:443" 
Environment="NO_PROXY=localhost,127.0.0.1"

 

Control Docker with systemd

Many Linux distributions use systemd to start the Docker daemon. This document shows a few examples of how to customize Docker’s settings. Start the Docker daemon Start manually Once Docker...

docs.docker.com

 

Configure Docker to use a proxy server

If your container needs to use an HTTP, HTTPS, or FTP proxy server, you can configure it in different ways: In Docker 17.07 and higher, you can configure the Docker...

docs.docker.com

{
 "proxies": {
   "default": {
     "httpProxy": "http://proxy.example.com:3128",
     "httpsProxy": "https://proxy.example.com:3129",
     "noProxy": "*.test.example.com,.example.org,127.0.0.0/8"
   }
 }
}

저의 리눅스에서 테스트 했을때 정보입니다.

{
 "proxies": {
   "default": {
     "httpProxy": "http://proxy.example.com:80",
     "httpsProxy": "https://proxy.example.com:443",
     "noProxy": "localhost,127.0.0.1"
   }
 }
}

http://hardworkers.tistory.com/150

react 시작하기!!

http://nepi.tistory.com/entry/React-%EC%8B%9C%EC%9E%91

node js 튜토리얼....렁!!!

https://velopert.com/node-js-tutorials

 react , redux , express 등

https://developer.mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript

db 는 mongo db

[Webpack]

web 성능개선을 위해 매우 중요!!!

https://webpack.js.org/

http://webpack.github.io/docs/node.js-api.html

webpack.config.js [configuration 파일]

- devtool : 개발환경 관련해서 설정하는 부분.!!!

   - 'source-map'  : bundle.js 등 으로 합쳐진 코드를 디버깅하기에는 무척 난해함, 

     개발할때 original source와 mapping 시켜서 디버깅 할 수 있도록 도와주는 툴

 ---- https://survivejs.com/webpack/building/source-maps/

--- 디버깅을 위해서는 source map이 중요합니다.!!!

- debug...

https://webpack.js.org/concepts/    : 컨셉 page 한눈에 알수 있음.ㅋ

디버깅 환경에서 실행하기.!!!

webpack.config.js 파일에

devtool:'source-map',

을 추가하기!!

npm run development

[김 땡땡]

어제 제가 redux-persist라고 redux 데이터 새로고침해도 유지되게 라이브러리 붙였는데요

window analyzer/system analyzer 등 모든화면에서 괜찮은데 

memo list에서 새로고침하면 lockup 비스무리하게 되더라구요

어제보다가 모르겠어서 말긴했는데;; 혹시 여유되시면 한번 봐주세요 

새로고침 안했을때는 잘 동작하는데 그화면에서 새로고침하면 bottom navigation이 안먹고 memo 추가하는것도 안되고 락업처럼 되더라구요 

redux-persist 적용되고 개발하기 완전 편해짐 

-----------------------------------------

[이 땡땡]

packsge.json 파일에서 build부분에 아래처럼 webpack 뒤에 --watch 붙이고

"build": "babel server --out-dir build --presets=es2015 && webpack --watch",

webpack.config.js 파일에서 plugins 내용을 기존꺼 대신

plugins:[

  new webpack.HotModuleReplacementPlugin()

]

이렇게 바꾸면 빌드속도가 20초에서 3초정도로 주는거같네요

-----------------------------------------------------