K코딩

전 포스팅때 OSI 7계층이 뭔지 개념 잡았었는데 안본사람은 보고오면 이번글 이해하기 편함 링크 걸어줌

[OSI 7계층 1편]개념 + 알아야 하는 이유

OSI 7계층중 첫번째 물리계층을 알아볼껀데 궁금한사람있음?

이런거보면 호기심가지고 궁금해 해야 훌륭한 개발자가 되는거임

물리 계층은 쉽게 설명해서 '길'임

물건을 다른 곳으로 보내려면, 물건이 이동할 수 있는 '길'이 있어야 할꺼 아닙니까

자동차는 달릴 수 있는 도로, 기차는 철도, 비행기는 하늘길 이런게 없으면

물건을 목적지까지 보낼 수가 없지 않겠습니까

물리계층은 네트워크에서 데이터를 주고받을 수 있는 '길'을 만들어 줌

여기서 '길'이라는건 전선(랜선), 광섬유(광케이블), 전파(wifi) 같은 물리적인 매체임

이 길을 통해서 데이터를 전송할 수 있는 신호(0과 1)가 이동함

물리 계층을 만들려면 어째야 겠습니까?

인터넷선 연결하거나 와이파이 연결하는게 물리계층 만든거 아니에요? 맞습니다

자동차나 기차가 물건을 싣고 이동하듯이, 물리 계층에서는 데이터가

전기 신호나 빛(광케이블)같은 형태의 자동차를 타고 물리적인 길을 통해 가서

목적지에 도착함

도로가 있어야 차가 다닐 수 있듯이, 물리 계층이 있어야 그 위에서 데이터가 이동을 할꺼 아닙니까

어떤 분들은 도로 없이도 자동차는 비포장도로 달릴 수 있는데요? 라고 말 할수 있는데

그런 사회 부적격자 비슷한 분들은 여기 없을꺼라고 생각합니다

그럼 물리 계층의 역활을 하는건 무엇이냐면

컴퓨터로 예를 들면 랜카드가 하는거임

즉 정리해보면

물리 계층은 네트워크에서 데이터를 주고받기 위해 신호가 지나가는 물리적인 길을 만들어 주는건데

이 '길'이란걸 만드는법이 

전선(랜선), 광섬유(광케이블), 전파(와이파이) 이런 물리적은 수단을 이용해서

그거를 가따가 연결하는게 물리계층 만든거임

길이 잘 만들어져 있어야지 데이터가 이동을 해서 전달이 잘 될꺼 아닙니까

훌륭한 개발자가 되기위해선 항상 왜?가 중요하지 않겠습니까?

OSI 7계층이 뭔지 부터 알아 봅시다.

국제표준기구ISO가 만든 국제네트워크의 표준임,

각 계층이 특정한 기능을 담당해 데이터를 처리하고 전달함

위 사진을 보면

데이터를 다른 컴퓨터나 이런곳으로 보내기 위해서

택배 포장하는거랑 비슷하지않음?

7계층부터 1계층까지 각 계층을 지나면서 데이터를 보내기위해 택배 포장하듯이 필요한 헤더 정보들이 붙음

마지막 1계층까지 가면 00010011011 이런 식으로 컴퓨터가 인식할수있는 언어로 바뀜

0과 1로 이루어진 신호로 변환된것이 데이터를 보내기위해서 택배 포장이 끝난거라고 생각하면 쉬움 

반대로 수신 측에서는 1계층 컴퓨터언어를 받아서 택배 포장을 해체하듯이

헤더 정보들을 제거함 최종 7계층까지 도달하면 원본 데이터를 얻을 수 있음

따라서 OSI 7계층 모델은 데이터를 포장하고 해체하는 일련의 과정으로 이해할 수 있음

그럼 이게 왜?! 만들어졌는지 보자면

다국적 택배 시스템을 비유해서 보면 이해하기 쉬움

각 나라의 택배 회사들이 서로 다른 방법으로 물건을 포장하고 배달함 이러면 문제점이

운송장도 다르고 포장 규칙도 다르고 이래서 물건이 중간에 길을 잃거나 잘못 전달되거나 손상되거나 할 수 있겠죠?

세계 곳곳에 택배를 보내려면 모든 나라가 같은 규칙으로 택배를 포장하고 배달해야

원활하게 물건을 주고 받을 수 있음

택배를 데이터로 바꿔서 데이터를 원활하게 주고 받을려고 국제 네트워크 표준규칙을 만듬

그 규칙 이름이 OSI 7계층임

택배를 안전하게 배송하기 위해서 여러 단계가 필요함 예를들어서 포장 → 운송 → 세관통과 → 배달

OSI 7계층도 이런 식으로 비슷하게 데이터를 보내고 받을 때 각 단계마다 필요한 작업을 정해놨음

택배 안전하게 받을려고 = 데이터 원할하게 주고 받을려고 

OSI 7계층 ㅇㅋ 대충 알겠음 그럼 우리가 이걸 왜?! 알아야함?

이건 건물 짓기에 비유하면 쉬움

건물을 지을땐 여러 분야의 전문가들이 필요함

기초공사하는사람, 목공전문가, 전기전문가, 인테리어전문가 등등 각자 맡은 역활이 있고

각 분야 전문가들이 단계별로 투입돼서 건물을 지음

OSI 7계층에서도 마찬가지로 데이터를 주고 받는 여러 과정이 나눠져 있음

각 계층마다 건물을 짓는 단계처럼 한 계층은 데이터를 전기 신호로 바꾸고,

다른 계층은 데이터를 목적지로 안전하게 보냄

건물을 짓는 도중에 문제가 생기면 기초공사, 전기, 인테리어 등등 중에서

어디가 문제가 생겼는지 알기쉽겠지 않음?

OSI 7계층도 알고있으면 어디 계층에서 문제가 생겼는지 쉽게 찾아 내고 해결 할 수 있지 않겠음?

결론적으로 네트워크 통신도 각 계층의 역할과 기능을 이해하면 데이터를

더안전하고 효율적으로 주고 받을 수 있고, 문제가 생겼을 때 빠르게 해결할 수 있음

서버와 클라이언트 진짜 쉽게 설명함

식당을 예로 들어봄

클라이언트는 사용자임

식당에서는 손님이 클라이언트임

컴퓨터에서 클라이언트는 장치,프로그램등이 있는데

장치는 데스크톱,노트북,스마트폰 등이 있고

프로그램은 웹 브라우저(ex:크롬)가 있음

서버는 식당에서 서빙하는 종업원임

즉 서빙하는 사람을 서버라고 부를 수 있음

 손님이 식당에서 종업원을 불러서 메뉴를 주문하는것이

클라이언트가 서버에 요청하는 행위임

클라이언트의 주문을 받은 서버는 주방장에게 가서

메뉴를 이야기하고 주방장이 만든 음식을

다시 클라이언트에게 가져다 줄꺼임

이게 서버가 하는 역활임

이걸 IT스럽게 말하면

클라이언트가 데이터를 요청하면 서버는 데이터베이스에 가서

클라이언트가 요청한 데이터를 가져와서 클라이언트에게 보내주는 역활을 함

이게 클라이언트와 서버와 데이터베이스의 관계임

서버는 데이터베이스 뿐만아니라

클라이언트와 또다른 클라이언트끼리도 데이터를 주고 받을수있게

연결해주는 역활도함

웹서버와 게임서버의 차이점을 보기전에

서버가 무엇인지 전 포스팅에서 다뤘음

[1]<서버>와 <클라이언트> 개념정리

우선 공통점을 보면

그럼 차이점을 보겠음

게임 서버에서 중요한 내용은

상황에따라 낮은 지연시간의 실시간 통신과 동기화를 지원해야한다는 점이 있음

서버라는걸 만들었으면

그게 24시간 작동하게 해야할꺼 아님?

내컴퓨터에 서버 시작해놓고 24시간 켜놓을꺼임?

그러다가 컴터 다운되거나 서버 먹통 되는지 24시간 감시하고있다가

먹통되면 재시작하고 평생 컴터앞에 그렇게 앉아 있을거임?

현실적으로 불가능 하기때문에 클라우드 서비스를 사용함

클라우드 서비스는 다른 큰 회사의 서버실에 있는 컴터 한대를 돈주고 빌려서

내서버 띄어 놓는거임

유명한 클라우드 서비스 중에 하나가 AWS임

이건 주소임

https://aws.amazon.com/ko/?nc2=h_lg

AWS에서 여러가지 상품형태로 컴터를 팔고있는데

그중에 가장유명한게

EC2임

이게 뭐냐면 컴터 한데 빌리는 상품인데

거기에 서버에 필요한 라이브러리 이것저것깔고 서버 키면 끝임

단점이 터미널로 서버띄우고 이것저것하는게 오래걸리고

서버 맛가면 자동 재시작 해야하니 PM2 이런 라이브러리 세팅해야하고

문제생기면 해결도 알아서 해야함

그래서 더좋은 상품이 있는데

AWS Elastic Beanstalk 임

얘는 코드만 올리면 알아서 EC2 인스턴스 하나빌려서

npm install 눌러주고 서버띄어주고

무료도메인도 하나 연결해주고

Nginx로 reverse proxy도 넣어주고

유저 많아지면 확장도 쉽게 가능하고
버전관리도 해주고 서버다운시
자동으로 재시작 여러번 시도해주고
그냥 업로드만 하면 끝임
가격도 그냥EC2 요금이랑 같음

AWS는 새계정생성 + 새 카드 등록하면
1년간 무료로 저사양 컴 한대 빌려줌

- 경쟁업체들의 비슷한 상품은
구글의 App Engine,
마이크로소프트 Azure의 App Service
가 있음

파이어베이스 세팅코드

// Firebase SDK 라이브러리 가져오기
import { initializeApp } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-app.js";
import { getFirestore } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";
import { collection, addDoc } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";
import { getDocs } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";


// Firebase 구성 정보 설정
const firebaseConfig = {
        본인 설정 내용 채우기 
};


// Firebase 인스턴스 초기화
const app = initializeApp(firebaseConfig);
const db = getFirestore(app);

// Firebase 구성 정보 설정은 파이어베이스 에서 만든 데이스 페이지에서

왼쪽상단 메뉴버튼 > 프로젝트 개요톱니바퀴 > 프로젝트설정 >

SDK 설정 및 구성

에서 구성 클릭 > 보드 복사해서 붙혀넣기

데이터 저장하기

$("#id").click(async function () {
    let doc = {};//<저장할 데이터
    await addDoc(collection(db, "콜렉션이름"), doc);//<db의 컬렉션명 입력
    alert('저장완료'); //알럿알림
    window.location.reload(); //윈도우 새로고침
})

데이터 불러오기

      //데이터 불러오기
      let docs = await getDocs(collection(db, "albums"));
      docs.forEach((doc) => {
        let row = doc.data();
        console.log(row);//가져온데이터 콘솔창에 표시
        /**  이곳에 메이크카드를 넣으세요   */
      });

개념정리
Express와 가장 많이 사용하는 웹소켓 라이브러리인 Socket.IO

서버와 실시간 양방향 통신을 할수있음

설치 방법

터미널에 npm install socket.io 입력

사용 세팅법

1 . 서버파일 상단에  세팅코드 입력

const { createServer } = require('http')
const { Server } = require('socket.io')
const server = createServer(app)
const io = new Server(server)

2 . app.listen(어쩌구) 라고 써은던 코드를 server.listen(어쩌구)으로 바꿔셈

app.listen(생략)
server.listen(생략)

3 . 웹소켓 사용을 원하는 html 파일에 이걸 넣어서 socket.io 라이브러리 설치

<script src="https://cdn.jsdelivr.net/npm/socket.io@4.7.2/client-dist/socket.io.min.js"></script>
<script>
  const socket = io() 
</script>

사용법 정리

io.on [ 이벤트리스너 ]

서버는 누가 웹소켓 연결시 특정 코드를 실행하고 싶으면 위처럼 작성해두면 됩니다.

io.on('connection', (socket) => {
  console.log('websocket 연결됨')
})