프론트엔드 vs 백엔드, 대체 뭐가 다른 거야

코딩 공부를 시작하면 가장 먼저 부딪히는 질문입니다. "프론트엔드 개발자", "백엔드 개발자", "풀스택" — 채용 공고에도, 유튜브 강의에도 이 단어가 넘쳐나는데, 대체 뭐가 다른 건지 감이 잘 안 잡힙니다.

실험실로 비유하면 한 번에 이해됩니다.

실험실에도 프론트와 백이 있다

프론트엔드(Frontend) = 실험 벤치

눈에 보이는 작업 공간입니다. 피펫, 시약 병, 겔 이미지 — 연구자가 직접 손으로 만지고, 눈으로 확인하는 모든 것. 웹에서는 여러분이 브라우저에서 보는 화면 전부가 프론트엔드입니다. 버튼, 텍스트, 이미지, 입력 폼, 그래프 — 사용자가 보고 클릭하는 모든 것.

백엔드(Backend) = 분석 장비실과 데이터베이스

벤치 뒤편에 있는 시퀀서, qPCR 장비, LIMS 서버. 연구자가 시료를 넣으면 장비가 분석하고, 결과를 데이터베이스에 저장합니다. 웹에서는 서버가 이 역할을 합니다. 사용자가 "검색" 버튼을 누르면, 서버가 데이터베이스에서 결과를 찾아서 보내줍니다.

풀스택(Fullstack) = 벤치 작업도 하고 장비 운영도 하는 연구자. 작은 실험실에서 혼자 다 해본 분이라면 이미 풀스택 연구자입니다.

NCBI로 보는 프론트 vs 백

NCBI에서 유전자를 검색하는 과정을 생각해보세요:

1. 검색창에 "TP53"을 입력하고 Search 클릭 → 프론트엔드가 담당
2. 요청이 NCBI 서버로 전송됨 → 네트워크 (앞에서 배운 fetch)
3. 서버가 데이터베이스에서 TP53 정보를 찾음 → 백엔드가 담당
4. 결과를 JSON으로 만들어 보내줌 → 백엔드가 담당
5. 받은 데이터를 예쁘게 화면에 표시 → 프론트엔드가 담당

웹 서비스는 이 두 파트의 협업으로 돌아갑니다. 어느 한쪽만으로는 완성되지 않습니다.

프레임워크 vs 라이브러리

코딩 공부를 하다 보면 "React는 프레임워크인가, 라이브러리인가" 같은 논쟁도 보게 됩니다. 이것도 실험실로 풀 수 있습니다.

라이브러리(Library) = 개별 시약

연구자가 필요할 때 꺼내 씁니다. 시약장에서 Taq polymerase를 꺼내서 내 프로토콜에 넣는 것. 내가 실험 흐름을 주도하고, 시약은 내가 "부르는" 도구입니다.

내 코드 → 라이브러리를 호출
(내가 주도)

프레임워크(Framework) = 시약 키트 (실험 Kit)

Kit를 사면 프로토콜이 정해져 있습니다. "1번 용액 넣고 → 65°C에서 5분 → 2번 용액 추가" — Kit이 실험 흐름을 주도하고, 연구자는 그 틀 안에서 시료만 바꿔 넣습니다.

프레임워크 → 내 코드를 호출
(프레임워크가 주도)

Kit을 쓰면 실험 설계를 처음부터 할 필요 없이, 검증된 프로토콜을 따르면 됩니다. 프레임워크도 마찬가지 — 로그인, 라우팅, 에러 처리 같은 반복 작업을 대신해주므로, 핵심 기능 개발에 집중할 수 있습니다.

생명공학자에게는 어느 쪽이 맞을까

솔직한 답: 백엔드(데이터 처리)가 더 가깝습니다.

여러분의 본업은 데이터 분석입니다. 유전체 서열 처리, 실험 결과 통계, 파이프라인 자동화 — 이것은 전부 백엔드 영역입니다. Python으로 데이터를 다루는 것 자체가 백엔드 작업입니다.

프론트엔드(HTML, CSS, React)는 결과를 보여주는 도구입니다. 분석 결과를 동료와 공유하고 싶을 때, 대시보드를 만들고 싶을 때 — 그때 프론트엔드가 필요합니다.

처음부터 풀스택을 목표로 할 필요 없습니다. Python으로 데이터를 다루는 것부터 시작해서, 필요할 때 프론트엔드를 하나씩 얹어가면 됩니다.

웹 기술은 도구이지, 목표가 아니다

일반 웹 개발자와 여러분의 차이를 정리하면:

여러분은 "웹 개발자"가 되려는 게 아닙니다. 데이터를 다루는 연구자이고, 웹은 그 결과를 세상에 보여주는 창입니다. DevBench의 A-2 트랙(웹 개발)을 배우는 이유도 같습니다 — 분석 결과를 웹으로 배포할 수 있는 힘을 갖추기 위해서입니다.