도커를 사용해보자 아주 멋지게..Docker....

😎어제는 계산기를 만들었는데..

이미 어느정도 구조가 짜여있는 자바스크립트 코드를 건드리는건 처음이었다.
그리고.. 내가 처음부터 설계하면서 짜는거보다
이미 짜여있는걸 건드리는게 훨씬 어렵더라
괜히 취업하면 하루종일 코드만 보게한다는게 아니구나

머리로는 어떻게 돌아가는지 이해가 되는데
정확히 이 변수는 어떤 역할을 하는지 이 변수는 뭔지에 대해서 감이 안잡히니까
네이밍 컨벤션이 협업을 할 때엔 많이 중요하겠구나.란 생각이 들었음

그냥 처음부터 짜고 싶었으나..
기능테스트를 하는 부분이 있고 그게 함수명, 변수명, html 클래스명 등을 기반으로 평가하길래
엄.. 그냥 건드리지말자! 라는 결론에 도달했다.

그런데 또 다른 사람이 짠 코드를 보다보니 나는 상상 못한 방법도 하나 배우게 되었다.

if (action === 'calculate') {
  console.log('계산 버튼');
  // 계산기의 화면에 calculate 함수의 결과를 출력합니다.
  display.textContent = calculate(firstNum, operatorForAdvanced, display.textContent);
  previousKey = 'calculate';
}​

바로 이부분이었는데 저 로직은 간단히 생각하면
화면에 표시되고 있는 값과 계산 값을 계산해주는 함수를 호출시켜서 반환받은 값을
다시 화면에 표시하게 해주는 부분이다.

난 저 발상을 못하고 화면에 있는 값을 재활용하려면 다른 변수를 만들어줘야하려나..?
라고 생각하고 있었는데 약간 콜럼버스의 달걀 같은 느낌이었다.

변수에 자기 값을 재 사용해서 재할당하는 방법 자체가 어색한 건 아닌데
왜 생각을 해내지 못했을까 사실 저건
a = a+1 같은거랑 똑같은거 아님? 

---

😎 도커와...친해져보자..

https://www.docker.com/

https://www.docker.com/

위 링크로 접속하고 너무 눌러보고 싶은 버튼들을 운영체제에 맞게 선택해주면 되겠다.
그런데 Window 다운로드도 있다니? 뭐지? 윈도우도 지원해줄것을 암시하는것인가?

전 윈도우를 사용하기 때문에 윈도우를 위한 exe 파일을 다운로드 받았습니다.

아주 잘 설치가 되었네요

그런데.. 반드시 윈도우에서 로그아웃해야한다고하네요

재부팅을 시켜야하나봅니다. 뭐.. 알겠어요 재부팅 하면 되죠 뭐

재부팅 해보니 이런 창이 뜨는군요

섭스크립션서비스... 뭐 유료구독서비스가 있는건가?

어쨌든 Accept 안해주면 실행을 안해주니까.. 인정해주도록하겠습니다.

아주 예쁜 UI네요

튜토리얼도 있군요!

먼저 레포지토리를 클론해오는 작업이 필요하다고 합니다.

튜토리얼에서 조차도 뭔갈 잘못했는지 일단 오류가 잔뜩 발생하네요

아무튼 로그인은 해야할테니 회원가입과 로그인을 진행해봤습니다.

ok.. 돈 벌어야하니까... 맞죠..

무료 플랜이 있는것에 감사합니다

sign in에 성공했습니다.

---

😎Docker 익스텐션 설치

도커 익스텐션은 도커파일을 작성할 때 문법적인 힌트를 얻을 수 있다고 한다.
사실 나도 잘 모름 그냥 깔면 좋을 거 같은거임

---

😎npm init??

npm init -y​

소스트리 설치 후 모든 것을 GUI로 해결하는 허수개발자 냠냠맨
init은 초기화라는 것을 아주 예전에 따라치며 배워놓고 이제서야 리마인드하게되었다.

---

😎express를 설치하고 간단한 서버를 시작해보자

const express = require("express");
const app = express();

app.get("/", (req, res) => {
    res.send("반가워요 도커드웨건!");
});

app.listen(8080, () => console.log("Server is started"));

 

express는 이전 줌 클론코딩해보기에서 한번 써본 친구다.
로컬호스트 8080 포트에 간단한 텍스트를 출력해주는 코드이다. 

그런데 문득 그냥 Go live와 같이 실행하면 로컬호스트 3000을 사용하는데
왜 8080인지 궁금해졌다 궁금하지 않나요?

로컬호스트는 컴퓨터 내부에서만 사용되는 주소이고

8080포트는 http 프로토콜을 사용하는 웹 서버에서 자주 사용된다.

그렇군용

근데 express에 대해서 항상 궁금해지는거같다.

그냥 관용적으로 익스프레스를 변수에 담아놓고...

또 그걸 호출해서 변수에 담고...

그럼 .get()메서드를 쓸 수 있고 그래 좋다.. 근데 난 어떻게 굴러가는지가 궁금하다고

 

https://expressjs.com/ko/starter/hello-world.html

Express "Hello World" 예제

하는 사람을 위해 이미 사이트가 있군요

쭉 한번 봐야겠습니다.

---

😎 npm install과 npm ci의 차이?

npm install

npm ci

둘 다 package.json에 명시된 라이브러리들을 설치하는 것을 도와주는 명령어이지만
npm install을 가장 최신 버전으로 인스톨해주고
npm ci는 package-lock.json에 명시된 실제 작업했을 당시의 버전을 토대로 인스톨해줍니다.

버전관리가 중요할 때에는 npm ci가 훨씬 더 좋겠군요!

---

😎간단한 도커파일을 작성해봅시다.

도커파일은 레이어 개념이 있어서 빈번히 내용이 변경되는 파일들의 copy는 아래줄에 작성하는게 좋다네요

각 명령어마다 다 의미가 있지만... 그건 알아서 찾아보기로 합시다.

---

😎docker build -f Dockerfile(자기가 작성한 도커파일이름) -t (fun-docker 이부분은 자유) .

docker build -f Dockerfile -t fun-docker .

 

터미널에 위 명령어를 실행하는것으로 빌드를 해봅시다.

굉장히 어썸하네요
그와중에 제가 작성한 명령어들이 위에서부터 아래로 순차적 실행되는걸 확인할 수 있었습니다.

---

😎docker images 

docker images 명령어를 통해 도커안에 어떤 파일,폴더들이 있는지 볼 수 있습니다.
아까 -t 명령어 안에 넣어준 fun-docker라는 텍스트가 레포지토리항목에 들어간걸 볼 수 있군요!
aipine/git은 아까전에 튜토리얼로 생성한 레포지토리를 가리키는 것 같습니다

---

😎docker run -d -p 8080:8080 fun-docker / docker ps

근데 저 뒤에 붙는 -d , -p 무엇을 암시하는 것일까요

-d는 detached 분리하다라는 뜻
-p는 port - publishing 으로 포트를 지정해주는 것이군요
host 기기에 있는 포트와 컨테이너에 있는 포트를 각각 :의 좌항 우항으로 구분해서 연결해주는걸 의미하는군요

당연히 마지막은 어떤 레포지토리를 실행시킬건지에 대한 내용이 들어가는걸로 보이네요
명령어를 쳐보니 뭔가 굉장히 긴 숫자와 알파벳의 조합이 나오는걸 볼 수 있었읍니다.

---

😎docker ps

현재 실행 중인 도커 컨테이너의 목록을 보여주는 명령어입니다.
실행 중인 모든 컨테이너의 정보를 확인할 수 있으며, 다음과 같은 정보를 포함합니다.

CONTAINER ID: 컨테이너 식별자
IMAGE: 컨테이너를 생성할 때 사용한 도커 이미지
COMMAND: 컨테이너에서 실행 중인 명령어
CREATED: 컨테이너가 생성된 시간
STATUS: 컨테이너의 상태 (실행 중인지, 정지된 상태인지 등)
PORTS: 컨테이너에서 열린 포트와 호스트와의 매핑 정보
NAMES: 컨테이너의 이름

오... 그렇군요

---

😎docker logs (container id)

바탕 화면\fds>docker logs (제 소중한 컨테이너 아이디)
Server is started

컨테이너의 로그를 확인할 수 있는 명령어네요!
저 Server is started는 제가 서버가 시작하면 콘솔에 찍히도록
console.log() 메서드를 이용해 지정해둔 내용입니다

---

😎도커 프로그램에도 반영되었나..??

오.. 반영되었습니다.
제가 도커를 실행시켜서 그런건지 funny_tu의 status는 running 중이군요!
굉장히 신기하네요

---

😎 Git은 Git Hub에 그럼 Docker는..?

docker는 docker hub에 올려주면 된다 ㄷㄷ
docker와 계정이 연동되는건지 전 이미 docker 아이디와 같은 아이디가 로그인 되어있네요

가장 누르고 싶은 걸 누르면 얼추 맞다.. 그것이 사용자 편의니까..

Create repository 를 클릭해줬습니다.

옆에 도커 커맨드로 어떤 명령어 같은걸 제공해주는데

To push a new tag to this repository라고 하네요

docker tag fun-docker:latest xionwcfm/docker-example:latest

전 위와 같이 명령어를 넣어줬습니다.

이미지 ID가 동일한 레포지토리 xionwcfm/docker-example이 생겼네요!!

---

😎 docker login

docker login
Authenticating with existing credentials...
Login Succeeded

Logging in with your password grants your terminal complete access to your account.
For better security, log in with a limited-privilege personal access token. Learn more at https://docs.docker.com/go/access-tokens/

dockerhub에 push를 해주기 위해선 우선 docker login을 선행해야하는군요
로그인이 안되어있는 경우엔 유저네임과 패스워드를 넣어야하지만
전 이미  갖고있는 로그인 정보를 가지고 로그인을 해줬다는걸로 보이네요

---

😎docker push를 통해 업로드를 해보자

docker push xionwcfm/docker-example:latest 
The push refers to repository [docker.io/xionwcfm/docker-example]
0df32d6fcebc: Pushed
7dd6d133482e: Pushed
63d3e19a969e: Pushed
75436167a2b8: Pushed
67246b9bbb93: Mounted from library/node
a1ce792246f9: Mounted from library/node
af1fa49a98d8: Mounted from library/node
7cd52847ad77: Mounted from library/node
latest: digest: sha256:c9a6b77ff9723e9465d531c3050d42ee97ab88a949a0a3c7fc8c181c2a78a8fa size: 1990

오....오.....................
잘 되었는지 docker hub로 가서 확인을 해보겠습니다.

아무것도 없던 제 레포지토리에 latest 태그가 달린 게 하나 생겼네요

정말 어썸합니다.

뭔가 엄청 간단한 찍먹만 해본 느낌인데도 슬슬 어지럽네요

약간 깃 처음 배울때랑 비슷한 느낌?

흑흑흑

---