김데이의 개발공부

[ TIL ] Day 35 - 서버와 클라이언트 📝 본문

코드잇 Node.js(BE) 부트 캠프/TIL (Today I Learn) 📑

[ TIL ] Day 35 - 서버와 클라이언트 📝

theday365 2025. 11. 13. 17:28
반응형

🗓️ 수업 일자 : 2025.11.13

✨ 오늘의 수업 평가 :  [ REVIEW ]  기본기 다시 점검 완료! 🧩📚

 

자꾸 작업이 막히는게 공부했던 내용들을 그새 잊어서 그런 것 같아 다시 기초부터 차근차근 집어보았다 

다시 공부 해 보니, 예전에는 막연했던 개념들이 그 동안 배운 작업들을 토대로 다시 정리되어서 

그 동안의 고생이 헛되진 않았구나 안심도 되고, 위안도 되었다 

 

👩‍💻 [개인 / 팀 프로젝트] 오늘 작업 내용 💻
- 팀 프로젝트 작업 : [추가 작업 완료]

 

📝  오늘 배운 내용  

- 서버와 클라이언트

 


 

 

서버와 클라이언트의 간단 비교
서버와 클라이언트의 간단 비교

 

1) 클라이언트와 서버란?

  • 클라이언트 : 서비스를 제공 받는 쪽, 웹에서는 크롬, 사파리, 익스플로러같은 "브라우저"를 의미한다. 일상의 예시와는 다르게 사람이 요구하는 "요청"을 받아서 서버에게 "주문"하는 역할을 하며, 사람이 인지할 수 있도록 서버에게 받은 자료를 해석한 뒤 배열/재배열 하여 웹사이트를 표현하는 역할을 한다
  • 서버 : 서비스를 제공 하는 쪽, 우리가 접속하는 모든 "웹 사이트"들이 바로 서버이다. 우리가 사용하는 작은 컴퓨터가 서버가 될 수도 있고, 드라마나 영화에 나오는 것 처럼 엄청난 기계들이 줄지어 있는 곳이 서버(실)이 될 수도 있다.

 

 

2) 클라이언트와 서버의 상호관계 정리

  1. 사용자(사람)이 브라우저(클라이언트)를 사용하여 특정 웹 사이트 URL을 작성하고 enter 또는 이동 버튼을 누름
  2. 브라우저(클라이언트)가 URL을 보고 알맞는 서버로 접속요청(request)
  3. 서버에서는 요청 내용(request)을 확인 한 뒤, 알맞는 정보와 데이터를 다시 브라우저(클라이언트)에게 전달(response)
  4. 정보와 데이터를 받은 브라우저(클라이언트)는 해당 내용들을 파악한 뒤 사용자가 볼 수 있는 구조로 정리하여 표현
  5. 드디어 사용자(사람)는 원하는 웹 사이트에 접속 됨! 🎉

사용자(사람) - 브라우저(클라이언트) - 서버 간의 이동 원리
사용자(사람) - 브라우저(클라이언트) - 서버 간의 이동 원리

 

 

3) 지금까지 배운 백엔드 작업에서의 클라이언트 / 서버 구분

  • 서버 : app.js / router.js / controller.js 등 실제 작업을 진행했던 파일들
    • app.js : 서버 전체 셋팅 진행 (express 실행)
    • router.js : URL에 따라 알맞은 로직 실행하는 중간 연결 고리.
    • controller.js : 실제 실행되는 로직, DB의 CRUD를 담당.
    • middleware.js / struct.js : 로직이 실행됨에 있어, 실행 요청이 올바른 방식인지 / 데이터가 맞는지 등을 수행하는 필터 역할 소스 (에러 미들웨어는 모든 로직이 종료 된 다음에 사용)
    • .env : 서버가 실행되는 환경 변수들을 관리
    • schema.prisma / prisma : DB에 사용 할 모델을 정의하고, 데이터를 관리함
  • 클라이언트(역할) : Postman, .http 확장자 파일
    • 실제 작업시에는 브라우저에게 요청을 받지만, 강의 속 개발 환경에서는 위 두가지 방식으로 클라이언트 요청을 진행함
    • curl(CLI 프로그램), Thunder Client(VSCode 확장 프로그램) 같이 클라이언트 역할을 할 수 있는 도구들이 더 있음.

 

 

4) URL로 보는 클라이언트의 서버 요청 

  • 프로토콜 : 통신을 할때 클라이언트와 서버간의 통신 규약
  • 도메인 : 요청 할 서버를 찾아주는 역할 (좀 더 정확하게 설명하면, DNS를 통해서 IP로 변환한 뒤 연결)
  • 패스 : 서버 안에서 원하는 것이 있는 위치
  • 쿼리 스트링 : 서버에서 원하는 것을 받아올때 필터링 / 정렬 등 옵셔널하게 작업하기 위한 규칙

url 각 파트 별 역활 분류
url 각 파트 별 역활 분류

 


 

📃 내일은 뭘 배울까 🤔

- javascript, nodeJs, express 등 비슷해 보이는 것들의 역할 분류

반응형