📌 서버와 클라이언트


서버(server)는 네트워크를 통해 요청된 정보나 서비스를 제공하는 역할을 합니다.
제공하는 대상은 클라이언트client로 사용자를 가리킵니다.

만약 웹 브라우저를 이용하는 client는 index.html 파일을 서버로 요청을 하면,
server는 이 요청에 대해 index.html을 브라우저로 응답합니다.

음식점의 손님과 서빙 직원을 대입하면 이해하기 쉬울 것 같습니다.
손님 = client은 음식을 주문 request하고
서빙 직원 = server는 주방에서 주문 받은 음식을 서빙 response합니다.


📌 서버 (Server)


앞에서 언급했듯 서버는 요청에 따른 응답 역할을 수행하는 호스트입니다.

서버를 로컬 컴퓨터에서 운영할 수도 있습니다.
하지만 서버를 운영하는데 드는 비용을 개인이 감당하기엔 무리가 있을 수 있습니다.
(도메인, 하루 종일 켜놓으면 전기세가.., 데이터베이스 등등...)

개인 프로젝트를 출시하거나, 공부를 목적으로 서버를 운영해야하는 경우
우리는 서버를 대신 운영해주는 곳에 맡길 수 있습니다.
서버를 빌린다고 하는 표현이 맞을 수도 있겠네요.

실제로 저의 프로젝트 사이트를 배포하는데 사용 중인 Netlify가 있으며,
자기소개 페이지의 주소처럼 github을 이용하는 방법도 있습니다.


📌 클라이언트 (Client)


그렇다면 클라이언트는 서버에 요청을 하는 호스트라고 볼 수 있습니다.
앞에서 식당에서 음식을 주문하는 손님으로 비유를 했는데요.

웹 브라우저를 통해 페이지를 이동하고, 글을 쓰고 삭제하고 수정하는 모든 행동을 하는 주체인 우리 (컴퓨터, 스마트폰 등 기기)가 클라이언트라고 할 수 있습니다.



📌 서버를 빌려보자! (Web Hosting)


앞서 말씀드린 서버를 빌리는 사이트에 대해 소개보려고 합니다.

우선 개발자 공부를 위해 한번씩은 들어봤을 Github 사이트 인데요.
제가 주절주절 설명하는 것보다 더 좋은 미디어가 있어 소개해드립니다.
생활코딩_github page

제가 소개해드릴 웹 호스팅 페이지는 Netlify입니다.

  1. 우선 웹사이트에 접속해서 회원가입과 로그인을 한 이후에
    작성한 코드 파일을 준비해주세요!
    github 아이디로 회원가입을 할 경우 github repsoitory와 연동할 수 있어 자동 배포도 가능합니다!


    로그인을 하면 다음과 같은 화면이 보여질텐데요.

    저는 이미 배포 중인 사이트가 있어 버튼이 다르게 보일 수 있습니다.
    그래도 배포 방식은 동일합니다!


    처음 이용한다면 가운데 큰 네모 상자에 어떠한 사이트도 없을 것입니다.
    그럼 여러분이 아까 준비하셨던 코드 파일을 드래그해서 저 박스에 넣어주세요!

이렇게 각자의 프로젝트를 누구에게나 보여줄 수 있습니다!👍 정말 쉽죠?
시반컴퍼니는 제가 배포 중이고 계속 발전시키고 있는 사이트입니다. 깨알 자랑을 하는 것 같지만 정말 쉽게 다른 사람에게 공유를 할 수 있어서 좋습니다.

  1. 만약 배포한 사이트의 코드에 수정 사항이 있다면, 이전 단계에서 여러분이 만든 사이트를 클릭해주세요.


    클릭하면 다음과 같은 화면이 보여질 것입니다.

    상단의 Deploy 버튼을 눌러 보여지는 화면에서 수정한 여러분의 코드 파일을 넣어주면 수정된 코드를 반영하여 새로운 사이트를 배포할 수 있습니다.


    처음 배포를 하면 도메인 주소가 이상한 영문과 숫자로 되어있을 텐데요
    위 사진의 큰 네모 상자에서 사이트와 도메인에 대한 정보를 수정할 수 있습니다.

여기까지 서버와 클라이언트, 그리고 서버를 빌려 프로젝트를 배포할 수 있는 웹 호스팅에 대해 알아보았습니다.
잘못된 정보가 있다면 댓글로 지적 부탁드립니다!


[참고자료]

생활코딩_WEB1

profile
다른 사람에게 누구나 이해할 수 있는 말로 설명하기

0개의 댓글