소개말
이 글은 철저히 제 주관과 경험을 바탕으로 작성되었습니다. (정답이 아니라는 뜻)
웹 백엔드를 경험해보고 싶지만, 처음이거나 아직 익숙하지 않은 분들이 백엔드가 뭐하는 것인지 이해할 수 있도록 작성하려고 했습니다.
글에서는 다음과 같은 배경지식을 전제로 하고 작성하였습니다.
•
Google Chrome이 브라우저라는 사실을 앎
•
웹의 대부분이 자바스크립트로 굴러간다는 얘기를 들어본 적 있음
•
‘HTTP’가 통신 프로토콜이라는 것을 들어본 적 있음
•
‘서버’와 ‘클라이언트’가 뭔지 대충 앎
•
‘백엔드’와 ‘프론트엔드’가 뭔지 대충 앎
•
‘프레임워크, 라이브러리’가 뭔지 대충 앎
•
‘파싱(Parsing, 문자열 분석)’해본 적 있음
백엔드에 대해 알아보기 전에..
백엔드와 프론트엔드가 존재하기 이전에 서비스가 있고, 사용자가 있습니다.
우리가 땀 흘려가면서 코드를 짜는 이유는 그 코드로 가치창출을 하기 위함이고, 그 가치는 우리가 작성한 코드가 실행되어서 실질적인 서비스로 제공되고, 그 서비스를 사용자들이 이용할 때에 비로소 의미가 생기는 것입니다. (이러면 돈을 벌겠죠?)
결국 프로그램을 통해 서비스를 제공해주는 사람이 프로그래머인 것이고, 저희는 서비스를 잘 제공해주는 프로그래머가 되기 위해 공부를 하고 있습니다.
그리고 이러한 프로그래머 중에서도 저희는 웹 서비스, 그 중에서도 백엔드라는 분야를 공부하려고 하는 것입니다.
그러면 백엔드는 뭘 하는 걸까?
백엔드는 알맞은 위치와 맞는 색깔로 실을 제공해주어야 한다.
Backend는 뭐하는 사람들일까요? (프론트빼고 다 하기?)
딱 한 가지로만 말하라고 한다면 저는 다음과 같이 말할 것 같습니다.
‘(주로 웹에서) 클라이언트가 원하는 데이터를 제공하는 서버를 만드는 사람’
여기서 말하는 클라이언트는 누구일까요? 클라이언트는 그냥 말 그대로 고객입니다. 저는 요청하는 주체면 다 클라이언트라고 할 수 있다고 생각합니다.
그렇다면 서버는 뭘까요? 저는 단순히 클라이언트의 요청에 응하는 것이 서버라고 생각합니다.
다만 레스토랑에서 손님과 웨이터와 같이 음식을 전달해주는 것이 아닌, 이 글의 맥락 상에서는 웹에서 통신 규약을 두고 클라이언트와 데이터를 주고 받는다는 점에서 차이가 있습니다. 손님이 주문을 하려면 웨이터에게 어떤 메뉴가 먹고 싶은지 얘기하듯이, 웹에서 클라이언트와 서버도 서로 소통해야 합니다.
서비스 사용자 뿐만아니라 같이 작업하는 프론트엔드 팀원도 클라이언트가 될 수 있습니다. 결국 누가 어떤 데이터를 원하는지, 어떻게 전달해줄 지가 백엔드의 주안점이라고 생각합니다.
웹 서비스의 흐름
위 다이어그램은 약식입니다. 원래 이것보다 훨씬 복잡하고, 여러 구조를 가질 수 있습니다.
웹 서비스의 백엔드를 이해하기 위해서는 어떠한 방식으로 프론트엔드와 소통하고 데이터를 주고 받는 지에 대해 이해해야 합니다.
대부분의 웹 서비스라면, 브라우저에서 클라이언트(실제 사용자)가 프론트엔드(자바스크립트)가 보여주는 부분들을 통해 정해진 규약대로(HTTP) 요청을 할 것이고, 서버에서 반환하는 데이터를 받아 사용자가 보는 화면을 재구성할 것입니다. 그리고 이러한 데이터의 흐름과 상호 작용이 실질적으로 서비스가 되는 것 입니다.
여기서 백엔드가 직접적으로 하게 되는 일은..
조금 확대해보았습니다.
•
백엔드에서는 프론트가 보내는 요청을 받고 구분합니다.
•
요청에 따라 알맞게 데이터를 생성/변경/조회하여 결과물을 전달합니다.
이게 백엔드가 하는 일입니다. 간단해보이니까 좀 더 상세하게 예시를 들어볼까요?
사물함의 대여/반납을 관리하는 저희 서비스를 예시로 들어보겠습니다.
•
‘sanan’이라는 사용자가, 브라우저에서 ‘2층 32번 개인 사물함’에 대여를 누릅니다.
→ 브라우저에서는 아래와 같이 보이겠죠?
•
그러면, 프론트엔드에서 ‘sanan’이라는 사람이 ‘2층 32번 개인 사물함’을 빌리려고 한다는 요청을 백엔드 서버에 보냅니다.
→ 여기서 HTTP 라는 프로토콜을 사용합니다. 해당하는 양식으로 보내면 아래같이 나타납니다.
<!-- 주석 : 사실 아래같이 안 생겼습니다. 참고용으로 생각하세요! -->
Request URL : https://cabi.42seoul.io/v4/lent/cabinets/32
Payload : {"name" : "sanan"}
Method : POST
HTML
복사
•
백엔드 단으로 넘어오면서, 웹 서버가 해당 요청을 맞이합니다. 웹 서버는 해당하는 요청을 파싱해서, 웹 어플리케이션 서버에게 전달합니다.
→ 웹 서버랑 웹 어플리케이션 서버랑 뭐가 다른지 헷갈릴 수 있습니다. 간단히 정리하자면 웹 서버 자체는 해당하는 요청을 분석하고, 웹 어플리케이션 서버가 보내는 데이터를 잘 묶어서 응답하는 역할을 합니다(웨이터).
웹 어플리케이션 서버(WAS)는 웹 서버가 전달하는 요청에 따라 데이터를 조회/변경/생성/삭제.. 해서 결과물을 웹 서버에게 전달해줍니다(쉐프).
웹 서버 자체는 대부분의 프레임워크에서 지원해주니 직접 구현하지 않아도 됩니다!
•
WAS가 해당하는 요청을 수행합니다.
@다음_URL_요청처리("/cabinets/{cabinetId}")
public void 사물함_대여하기(유저정보,사물함_번호) {
대여_서비스.대여해주기(유저정보, 사물함_번호);
}
Java
복사
→ 여기!!가 바로 백엔드가 가장 많이 작업하고, 시간을 할애하는 부분입니다. 직접적인 요청과 그 요청에 따라 원하는 데이터를 반환하는 것까지의 작업을 코드로 작성하는 것이죠. 대여_서비스를 작성하고, 대여해주기 메서드를 각자의 언어로 작성할 것입니다.
대여를 하려면 32번 사물함이 사용 중인지 && 대여하는 ‘sanan’이라는 유저가 대여가 불가능한 상태는 아닌지(악질 연체자) 등을 확인해야 할 겁니다.
이 부분은 서비스의 정책과 관련이 있겠죠? 서비스의 정책에 맞추어 코드를 작성해야 합니다. 그리고 이러한 정책적인 부분과 구현을 주로 ‘비즈니스 로직’이라는 말로 부릅니다.
이 비즈니스 로직을 구현하기 위해서는 사물함에 대한 데이터, 유저에 대한 데이터를 알아야 할 것입니다. 직접적으로 32번 사물함에 대한 현재 대여 중인 사람이 있는지 확인해보고, ‘sanan’이라는 유저의 사용 정지 기록을 훑어보면서 현재 정지 상태에 있는지도 확인해야합니다. 위 두 조건을 만족한다면 ‘sanan’의 명의로 된 32번 사물함에 대한 데이터를 생성해주면 되겠죠?
•
WAS가 ‘sanan’이 대여에 성공했다는 정보를 웹 서버를 통해 프론트엔드에게 전달합니다.
→ 이 역시도 HTTP로 어쩌구 저쩌구..를 프론트엔드를 통해 브라우저가 전달받습니다.
그리고 변경된 데이터에 따라 바뀔 화면을 동적으로 재구성해주면 아래와 같이 나타납니다.
… 까지가 웹 서비스에서 일어나는 많은 상호작용 중 하나입니다.
이제 서비스에서는 ‘sanan’이 32번 사물함을 대여했다는 데이터는 서버의 데이터에 저장 되어 있을 것이고, 다른 이용자들은 해당 대여가 종료될 때 까지(만료되었다고 서버에서 처리할 때 까지) 이용하지 못 합니다!
실제 웹 환경에서 비즈니스 로직에 따라 데이터를 조작, 사용자가 사용할 수 있는 서비스를 코드로 구현한 것이죠!
이것이 바로 넓게는 웹 서비스, 좁게는 백엔드가 하는 일입니다.
처음인데 이걸 어떻게 구현함?
그냥 하시면 됩니다.
어떻게 구현할지는 너무나도 어렵고, 정답이 없는 문제입니다.
위 예시만 보아도, 간단한 기능 하나를 작성하기 위해서 HTTP, 프로그래밍 언어, 웹 프레임워크, 데이터베이스, 우리 서비스의 정책… 등을 이해해야 하죠. 하지만 다 알아야지 작성할 수 있을까요?
물론 다 알면 좋겠지만, 그렇지 않습니다. 막 백엔드에 대해 관심을 갖고 시작하는 입장에서 단숨에 위의 것들을 이해하기란 쉽지 않을 것입니다.
그래서 제가 추천하는 방법은 ‘그냥 해보기(특히 따라하기)’입니다. 하나의 서비스는 정말 수 많은 요소들로 구성됩니다. 팀원들의 피땀눈물, 버그와 냄새로 가득한 내 코드.. 하나하나 미리 생각해서 해보기에는 한 세월입니다. 위의 예시와 같은 구성을 최대한 간단하게 하나의 흐름으로 경험해보는 것이 중요하다고 생각합니다. 남들이 짜놓은 코드를 따라해보면서, 어느 부분을 바꿔야 하는지에 대해 고민하다보면 익숙해질 수 있습니다.
프로그래밍 언어에 Hello World 프린트하기가 있다면, 프론트엔드에 To-Do List 만들기가 있고, 백엔드에는 CRUD 게시판 만들기가 있습니다. 어떤 언어인지는 크게 중요하지 않습니다. 어떻게든 서비스의 한 사이클을 굴려보는 것이 중요합니다. 유튜브나 구글에 ‘게시판 만들기’만 검색해도 수두룩하게 나옵니다.
그리고 가장 중요한 것! 안 되면 물어보기입니다. 더 빠르게 알 수 있는 방법을 찾아보세요. 주변에 아무도 없다면 GPT 선생님께라도 여쭤보시면 됩니다. 어떻게든 되게하는 것을 먼저 해보고 이후에 차근차근 학습해도 늦지 않습니다.
정리
백엔드 하는게 다가 아닙니다.
백엔드가 뭔지, 백엔드가 하는 일이 무엇인지 간략하게 알아보았습니다.
사실 서비스를 함에 있어서 기술적인 부분이 매우 중요하지만 더욱 중요한 것은 엔지니어로서 팀원들과 협업하고, 문제를 프로그램을 도구로써 해결할 수 있는 능력이라고 생각합니다.
그럼에도, 백엔드를 희망하지 않더라도, 같이 협업을 하게 될 입장이라면 각자의 기술을 경험해보는 것이 매우 중요하다고 생각합니다.
세부적인 디테일들이나 공부는 본인의 방향성과 의지에 달려있다고 생각합니다. (컨텐츠가 홍수같이 쏟아지는..)
논리적이고 효율적인 썩지 않는 코드, 예쁘고 구조 잡힌 코드를 지향하신다면 백엔드에 관심을 가져보시면 좋을 것 같습니다!
