웹사이트와 앱은 어떻게 만들어질까? 개발 용어 10개

웹사이트나 앱 하나가 세상에 나오기까지는 여러 단계를 거쳐요. 아래 10개 용어를 만드는 순서대로 배치했어요. 처음부터 읽으면 '주소를 정하고 → 화면을 만들고 → 데이터를 처리하고 → 공개하는' 전체 흐름이 그려질 거예요.

1. 도메인이란 무엇일까요?

인터넷에서 웹사이트를 찾아갈 수 있게 해 주는 이름이에요. 실제 서버는 숫자로 된 주소(IP 주소)를 갖고 있지만, 외우기 쉽도록 example.com 같은 이름을 붙여요.

쉽게 비유하면

복잡한 지번 주소 대신 쓰는 가게 간판 이름이에요.

예를 들면 새 서비스를 열 때 가장 먼저 하는 일 중 하나가 원하는 도메인을 사서 등록하는 거예요.

2. 호스팅이란 무엇일까요?

웹사이트 파일을 올려 두고, 누구나 24시간 접속할 수 있게 서버 공간을 빌려주는 서비스예요. 요즘은 클라우드나 웹사이트 전용 호스팅 서비스를 많이 써요.

쉽게 비유하면

가게 이름(도메인)을 정했다면, 실제로 장사할 상가 자리를 빌리는 거예요.

예를 들면 도메인과 호스팅을 연결해야 주소를 입력했을 때 내 웹사이트가 열려요.

3. HTML·CSS·자바스크립트란 무엇일까요?

웹 화면을 만드는 세 가지 기본 언어예요. HTML은 내용과 뼈대를, CSS는 색과 배치 같은 꾸밈을, 자바스크립트는 버튼을 누르면 반응하는 동작을 담당해요.

쉽게 비유하면

HTML은 집의 골조, CSS는 인테리어, 자바스크립트는 전기와 수도처럼 실제로 움직이게 하는 설비예요.

예를 들면 메뉴를 누르면 펼쳐지는 기능은 자바스크립트, 메뉴의 색과 크기는 CSS가 맡아요.

4. 프레임워크란 무엇일까요?

개발할 때 반복되는 작업을 미리 만들어 둔 뼈대와 규칙의 모음이에요. 처음부터 모든 것을 만들지 않아도 돼서 개발이 빨라지고, 여러 사람이 같은 방식으로 일할 수 있어요.

쉽게 비유하면

집을 지을 때 매번 벽돌부터 굽지 않고, 규격화된 자재와 설계 틀을 쓰는 것과 같아요.

예를 들면 React, Next.js, Vue 같은 이름이 개발 회의에 나오면 대부분 화면을 만드는 프레임워크(또는 라이브러리) 이야기예요.

5. 반응형 웹이란 무엇일까요?

하나의 웹사이트가 PC, 태블릿, 휴대폰 화면 크기에 맞춰 자동으로 배치를 바꾸는 방식이에요. 기기마다 따로 사이트를 만들 필요가 없어요.

쉽게 비유하면

담는 그릇 모양에 따라 모양이 바뀌는 물처럼, 화면 크기에 맞춰 내용이 다시 정렬돼요.

예를 들면 PC에서는 3칸으로 보이던 목록이 휴대폰에서는 1칸으로 쌓이는 게 반응형 웹이에요.

6. 프론트엔드란 무엇일까요?

사용자 눈에 보이고 직접 누르는 화면 부분과, 그것을 만드는 일을 말해요. 위에서 본 HTML·CSS·자바스크립트와 프레임워크가 주로 쓰이는 영역이에요.

쉽게 비유하면

손님이 직접 보고 경험하는 식당의 홀이에요.

예를 들면 화면 디자인을 실제로 움직이는 웹페이지로 옮기는 일이 프론트엔드 개발이에요.

7. 백엔드란 무엇일까요?

화면 뒤에서 데이터를 저장하고 처리하는 부분이에요. 로그인 확인, 주문 저장, 결제 처리처럼 눈에 보이지 않지만 꼭 필요한 일을 맡아요.

쉽게 비유하면

손님은 볼 수 없지만 요리가 실제로 만들어지는 주방이에요.

예를 들면 회원 가입 버튼을 누르면, 백엔드가 입력한 정보를 확인하고 데이터베이스에 저장해요.

8. API란 무엇일까요?

프론트엔드와 백엔드, 또는 서로 다른 서비스끼리 데이터를 주고받는 약속된 창구예요. 화면은 API로 필요한 데이터를 요청하고, 백엔드는 API로 결과를 돌려줘요.

쉽게 비유하면

홀(프론트엔드)과 주방(백엔드) 사이에서 주문서를 주고받는 창구예요.

예를 들면 앱에서 날씨를 보여 줄 때, 기상 정보 회사의 API에 요청해 받은 데이터를 화면에 그려요.

9. 네이티브 앱과 웹앱이란 무엇일까요?

네이티브 앱은 아이폰·안드로이드용으로 각각 만들어 앱 스토어에서 설치하는 앱이고, 웹앱은 브라우저에서 바로 열리는 앱처럼 만든 웹사이트예요. 둘을 섞은 하이브리드 방식도 많이 써요.

쉽게 비유하면

네이티브 앱은 집에 들여놓은 전용 가전, 웹앱은 필요할 때 빌려 쓰는 공용 기기와 같아요.

예를 들면 카메라, 알림처럼 휴대폰 기능을 깊이 쓰거나 빠른 반응이 중요하면 네이티브 앱을, 빠르게 여러 기기에 내놓고 싶으면 웹앱을 고려해요.

10. 배포란 무엇일까요?

완성한 웹사이트나 앱을 실제 사용자가 쓸 수 있게 공개하는 단계예요. 웹사이트는 서버에 올리고, 네이티브 앱은 앱 스토어 심사를 거쳐 공개해요.

쉽게 비유하면

준비를 마친 가게의 문을 열고 손님을 받기 시작하는 개업일이에요.

예를 들면 웹사이트는 수정 사항을 하루에도 여러 번 배포할 수 있지만, 앱은 스토어 심사 기간을 일정에 고려해야 해요.

만드는 순서로 정리하면

단계	하는 일	관련 용어
준비	주소와 공간 마련	도메인, 호스팅
화면	보이는 부분 만들기	HTML·CSS·자바스크립트, 프레임워크, 반응형 웹, 프론트엔드
처리	데이터 저장·연결	백엔드, API
공개	사용자에게 내놓기	네이티브 앱과 웹앱, 배포

처음에는 용어가 많아 보이지만, **"어디에(도메인·호스팅) → 무엇을 보여 주고(프론트엔드) → 어떻게 처리해서(백엔드·API) → 언제 공개하나(배포)"**라는 흐름만 기억하면 충분해요.