서버가 무엇인지 그림 없이 머릿속에 그리기

서버는 멀리 있는 기계만 뜻하지 않습니다

서버라고 하면 큰 회사의 차가운 기계실을 먼저 떠올리기 쉽습니다. 맞는 이미지이기도 하지만, 이 책에서는 조금 더 가까운 뜻으로 보겠습니다.

서버는 누군가의 요청을 기다렸다가, 알맞은 결과를 돌려주는 프로그램입니다.

이 문장이 앞으로 계속 기준이 됩니다. 서버는 혼자 바쁘게 움직이는 프로그램이 아닙니다. 누군가 찾아와서 무엇인가를 부탁하면 그때 일을 시작합니다. 그리고 부탁받은 일을 처리한 뒤 결과를 돌려줍니다.

예를 들어 누군가 웹사이트 주소를 입력합니다. 그러면 브라우저는 그 주소에 해당하는 서버를 찾아가서 이렇게 말합니다.

• 이 페이지를 보여 주세요.

• 이 상품 목록을 주세요.

• 이 문의 내용을 저장해 주세요.

• 로그인할 수 있는지 확인해 주세요.

서버는 이 요청을 읽고, 필요한 일을 한 뒤 응답합니다. 웹페이지를 돌려줄 수도 있고, 데이터만 돌려줄 수도 있고, 문제가 생겼다는 답을 줄 수도 있습니다.

여기서 중요한 점은 서버가 반드시 아주 특별한 컴퓨터일 필요는 없다는 것입니다. 내 노트북에서도 서버 프로그램을 켤 수 있습니다. 개발을 배울 때는 보통 내 컴퓨터 안에서 작은 서버를 먼저 실행합니다. 나중에 필요하면 그 서버를 인터넷에 올려 다른 사람도 접속하게 만들 수 있습니다.

AI 생성 이미지

브라우저는 손님, 서버는 주방입니다

서버의 흐름은 식당에 비유하면 잘 잡힙니다.

손님이 식당에 들어와 주문합니다. 주방은 주문서를 보고 음식을 만듭니다. 완성된 음식은 다시 손님에게 전달됩니다.

웹에서도 비슷한 일이 일어납니다.

• 손님: 브라우저

• 주문서: 요청

• 주방: 서버

• 음식: 응답

브라우저는 우리가 매일 사용하는 Chrome, Safari, Edge 같은 프로그램입니다. 브라우저는 화면을 보여 주는 역할만 하는 것처럼 보이지만, 실제로는 서버에 계속 주문을 보내는 손님 역할도 합니다.

사용자가 주소창에 example.com을 입력하면 브라우저는 서버에 요청을 보냅니다. 요청은 말 그대로 부탁입니다. 서버는 그 부탁을 읽고 응답을 보냅니다. 응답은 서버가 돌려주는 결과입니다.

이 흐름을 개발 용어로는 요청과 응답이라고 부릅니다. 영어로는 요청을 request, 응답을 response라고 합니다. 지금은 영어 단어를 외우기보다, 주문과 결과라는 느낌을 먼저 잡으면 됩니다.

서버 개발을 한다는 것은 결국 이 흐름을 다루는 일입니다.

• 어떤 요청이 들어왔는지 읽기

• 그 요청에 맞는 일을 하기

• 알맞은 응답을 돌려주기

Express를 배우면 우리는 이 세 가지를 코드로 쓰게 됩니다.

URL은 어느 가게의 어떤 창구로 갈지 알려 주는 주소입니다

웹사이트 주소를 URL이라고 부릅니다. URL은 단순히 예쁜 주소가 아닙니다. 브라우저가 어디로 가야 하는지 알려 주는 안내문입니다.

식당가를 떠올려 보겠습니다. 어느 건물에 갈지 알아야 하고, 그 안에서 어느 창구로 갈지도 알아야 합니다.

웹의 URL도 비슷합니다.

https://example.com/products

이 주소를 나누어 보면 다음처럼 이해할 수 있습니다.

• https: 어떤 방식으로 대화할지

• example.com: 어느 서버를 찾아갈지

• /products: 그 서버 안에서 어떤 창구로 갈지

여기서 /products 같은 부분은 서버 안의 창구 이름처럼 볼 수 있습니다. 상품 목록을 보고 싶으면 상품 창구로 가고, 문의를 보내고 싶으면 문의 창구로 갑니다.

예를 들어 작은 가게 서버가 있다고 해 보겠습니다.

• / : 첫 화면을 보여 주는 창구

• /products : 상품 목록을 보여 주는 창구

• /contact : 문의 페이지를 보여 주는 창구

• /orders : 주문을 받는 창구

서버는 들어온 주소를 보고 어떤 일을 할지 결정합니다. 같은 서버라도 주소가 다르면 전혀 다른 응답을 줄 수 있습니다. 이 책의 뒤쪽에서 배울 라우팅은 바로 이 창구를 정리하는 방법입니다. 라우팅은 어려운 말처럼 보이지만, 지금은 주소별 담당 창구를 만드는 일이라고 생각하면 충분합니다.

서버가 돌려주는 것은 화면일 수도 있고 데이터일 수도 있습니다

서버가 응답한다고 해서 항상 완성된 웹페이지를 보내는 것은 아닙니다. 서버는 크게 두 가지 방식으로 결과를 돌려줄 수 있습니다.

첫 번째는 웹페이지를 돌려주는 서버입니다.

브라우저가 서버에 첫 화면을 요청하면, 서버는 HTML, CSS, JavaScript 같은 파일을 돌려줍니다. 브라우저는 이 파일들을 읽고 사람이 볼 수 있는 화면으로 보여 줍니다. 식당에 비유하면 완성된 음식을 접시에 담아 손님에게 내주는 방식입니다.

예를 들어 회사 소개 페이지, 블로그 글 페이지, 문의 작성 화면은 웹페이지로 받을 수 있습니다.

두 번째는 데이터만 돌려주는 서버입니다.

요즘 웹사이트와 앱은 화면과 데이터를 나누어 다루는 경우가 많습니다. 서버가 화면 전체를 보내지 않고, 필요한 정보만 보내는 방식입니다. 예를 들어 상품 목록, 예약 가능 시간, 로그인한 사용자 이름 같은 정보를 데이터로 돌려줍니다.

이때 자주 쓰이는 데이터 모양이 JSON입니다. JSON은 사람도 읽을 수 있고 프로그램도 다루기 쉬운 데이터 형식입니다. 예를 들면 이런 느낌입니다.

{
  "name": "아메리카노",
  "price": 4500
}

이 응답은 예쁜 화면이 아닙니다. 대신 상품 이름과 가격이라는 정보가 들어 있습니다. 브라우저나 모바일 앱은 이 데이터를 받아서 자기 방식대로 화면을 만듭니다.

이처럼 데이터를 주고받는 서버를 흔히 API 서버라고 부릅니다. API라는 말은 낯설지만, 처음에는 데이터 주문 창구라고 이해해도 좋습니다. 화면을 통째로 주는 것이 아니라, 필요한 정보를 정해진 약속에 맞게 주는 창구입니다.

정리하면 이렇습니다.

• 웹페이지 서버: 브라우저가 바로 보여 줄 화면 재료를 돌려줌

• API 서버: 화면보다 데이터 자체를 돌려줌

Express는 두 방식 모두 만들 수 있습니다. 이 책에서는 처음에 작은 웹페이지 응답을 만들고, 뒤로 갈수록 JSON 데이터를 돌려주는 API도 만들어 봅니다.

Node.js는 JavaScript를 브라우저 밖으로 데려옵니다

JavaScript는 원래 웹페이지 안에서 많이 쓰이던 언어입니다. 버튼을 눌렀을 때 메뉴가 열리거나, 입력한 내용을 확인하거나, 화면 일부가 바뀌는 일을 맡았습니다. 그래서 많은 사람은 JavaScript를 브라우저 안에서만 움직이는 언어로 생각합니다.

그런데 서버는 브라우저가 아닙니다. 서버는 요청을 기다리고, 파일을 읽고, 데이터를 저장하고, 응답을 보내야 합니다. 브라우저 화면 안에서만 움직이는 JavaScript로는 이런 일을 하기 어렵습니다.

여기서 Node.js가 등장합니다.

Node.js는 JavaScript를 브라우저 밖에서도 실행할 수 있게 해 주는 실행 환경입니다. 실행 환경이라는 말이 딱딱하다면, JavaScript가 일할 수 있는 작업실이라고 생각하면 됩니다. 브라우저라는 방 안에서만 일하던 JavaScript에게, 서버를 만들 수 있는 별도의 작업실을 마련해 주는 것입니다.

Node.js 덕분에 우리는 JavaScript로 서버 프로그램을 만들 수 있습니다. 파일을 읽고, 요청을 받고, 응답을 보내는 일을 JavaScript 코드로 작성할 수 있습니다.

하지만 Node.js만으로 서버를 만들면 준비해야 할 일이 많습니다. 손님을 맞이하는 문, 주문서를 읽는 방식, 창구를 나누는 규칙을 하나하나 직접 챙겨야 합니다.

Express는 서버 만들기를 덜 복잡하게 해 주는 도구입니다

Express는 Node.js 위에서 사용하는 서버 만들기 도구입니다.

비유하자면 Node.js가 주방 공간이라면, Express는 주방에 놓인 기본 조리대와 주문 접수대입니다. 아무것도 없는 공간에서도 음식을 만들 수는 있지만, 조리대와 도구가 있으면 일을 더 정리해서 할 수 있습니다.

Express는 특히 다음 일을 편하게 도와줍니다.

• 어떤 주소로 요청이 왔는지 확인하기

• 주소마다 다른 일을 시키기

• 응답을 보내기

• 중간에서 요청을 검사하거나 가공하기

• JSON 데이터를 보내기

앞으로 우리는 Express를 사용해서 이런 코드를 쓰게 됩니다.

app.get('/products', function (req, res) {
  res.send('상품 목록입니다')
})

지금 이 코드를 완전히 이해할 필요는 없습니다. 다만 큰 흐름만 보겠습니다.

/products는 상품 창구입니다. req는 들어온 요청입니다. res는 돌려보낼 응답입니다. res.send()는 손님에게 결과를 보내는 행동입니다.

즉 이 코드는 이렇게 말합니다.

상품 목록 주소로 손님이 찾아오면, 상품 목록이라는 응답을 보내라.

앞으로 배우는 대부분의 Express 코드는 이 문장을 조금씩 확장한 것입니다.

이 책에서 서버를 보는 기준

처음 서버를 배우면 낯선 단어가 한꺼번에 나옵니다. 클라이언트, 요청, 응답, URL, 라우팅, API, JSON, Node.js, Express 같은 말입니다. 단어가 많아 보이지만, 모두 같은 장면 안에 있습니다.

브라우저가 손님처럼 서버를 찾아갑니다. URL은 어느 서버의 어느 창구로 갈지 알려 줍니다. 서버는 요청을 읽고 응답을 돌려줍니다. 응답은 웹페이지일 수도 있고 JSON 데이터일 수도 있습니다. Node.js는 JavaScript로 서버를 만들 수 있게 해 주고, Express는 그 서버 작업을 정리된 방식으로 하게 도와줍니다.

이 그림이 머릿속에 있으면 앞으로 코드가 조금 덜 낯설어집니다. 코드 한 줄을 볼 때마다 이 질문으로 돌아오면 됩니다.

• 지금 브라우저가 무엇을 요청했나?

• 서버는 어느 주소의 요청을 처리하고 있나?

• 서버가 돌려주는 응답은 화면인가, 데이터인가?

• 이 일을 Node.js와 Express가 어떻게 나누어 돕고 있나?

서버 개발은 거대한 이론에서 시작하지 않아도 됩니다. 작은 주문을 받고 작은 응답을 돌려주는 흐름을 이해하는 것에서 시작합니다. 다음 장에서는 이 흐름을 직접 실험할 수 있도록 내 컴퓨터에 서버 작업실을 만들어 보겠습니다.