풀스택

풀스택(full-stack)은 화면(프론트엔드), 서버(백엔드), 데이터 저장(데이터베이스)까지 앱의 모든 층을 한 번에 만든다는 뜻이에요. 식당으로 치면 홀·주방·창고를 한 사람이 다 차리는 거예요.

글 서순명(솔리드그루 이사 · 퓨쳐인프라 운영) · 2026-10-29 작성 · 예시 앱은 2026-10-29 Windows 11 · Node.js v24.15.0 에서 직접 실행

'스택'은 무슨 뜻이에요?

스택(stack)은 차곡차곡 쌓은 더미예요. 앱도 층을 쌓아 만들어요. 맨 위에 사용자가 보는 화면이 있고, 그 아래에 요청을 처리하는 서버, 맨 아래에 데이터를 적어 두는 저장소가 있어요.

풀스택 개발자는 전부 잘하는 사람이에요?

꼭 그렇지는 않아요. 업계에서도 이 말의 범위를 두고 의견이 갈려요. 보통은 모든 층을 깊이 아는 사람이라기보다, 층이 어떻게 이어지는지 알고 혼자서도 끝까지 만들어 내는 사람을 가리켜요.

바이브코더에게도 같은 감각이 쓸모 있어요. 코드는 AI가 쓰더라도, "이 기능은 어느 층의 일인가"를 알면 무엇을 부탁할지 정확해져요.

직접 이어 보면 어떻게 동작하나요?

2026-10-29 Windows 11 PC에서 Node.js v24.15.0 내장 기능만으로 만든 방명록이에요. 파일 하나에 화면, API, 데이터베이스가 다 들어 있어요.

// 풀스택 한 파일: 화면(프론트엔드) + API(백엔드) + 저장(데이터베이스)
const http = require("node:http");
const { DatabaseSync } = require("node:sqlite");
const db = new DatabaseSync("guestbook.db");
db.exec("CREATE TABLE IF NOT EXISTS notes (id INTEGER PRIMARY KEY, text TEXT)");
const PAGE = `<!doctype html><meta charset="utf-8"><h1>방명록</h1><ul id="list"></ul>
<script>
fetch("/api/notes").then(r => r.json()).then(rows => {
  document.getElementById("list").innerHTML = rows.map(n => "<li>" + n.text + "</li>").join("");
});
</script>`;
http.createServer((req, res) => {
  let raw = ""; req.on("data", (c) => (raw += c));
  req.on("end", () => {
    if (req.url === "/") { res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" }); return res.end(PAGE); }
    if (req.url === "/api/notes" && req.method === "POST") {
      const { text } = JSON.parse(raw);
      db.prepare("INSERT INTO notes (text) VALUES (?)").run(String(text).slice(0, 100));
    }
    if (req.url === "/api/notes") {
      res.writeHead(200, { "Content-Type": "application/json; charset=utf-8" });
      return res.end(JSON.stringify(db.prepare("SELECT id, text FROM notes").all()));
    }
    res.writeHead(404); res.end();
  });
}).listen(18084, () => console.log("http://localhost:18084"));

글 두 개를 남기고, 화면을 열고, 서버를 껐다 다시 켜 봤어요.

$ curl -X POST http://localhost:18084/api/notes -d '{"text":"커피 맛있어요"}'
[{"id":1,"text":"커피 맛있어요"}]  <- HTTP 200
$ curl -X POST http://localhost:18084/api/notes -d '{"text":"다음에 또 올게요"}'
[{"id":1,"text":"커피 맛있어요"},{"id":2,"text":"다음에 또 올게요"}]  <- HTTP 200
$ chrome --headless --dump-dom http://localhost:18084/   (화면이 API 에서 받아 그린 결과)
<ul id="list"><li>커피 맛있어요</li><li>다음에 또 올게요</li></ul>
$ (서버를 껐다 다시 켠 뒤) curl -s localhost:18084/api/notes   (데이터베이스 파일에 남아 있는지)
[{"id":1,"text":"커피 맛있어요"},{"id":2,"text":"다음에 또 올게요"}]  <- HTTP 200
$ ls -l guestbook.db
8192 bytes

• API로 보낸 글이 데이터베이스에 들어가고, 지금까지 쌓인 목록이 바로 돌아왔어요.
• 브라우저가 화면을 열자 자바스크립트가 API를 불러 목록 두 줄을 그렸어요. 화면과 서버가 이어진 거예요.
• 서버를 껐다 켠 뒤에도 글 두 개가 그대로였어요. 글이 8,192바이트짜리 데이터베이스 파일에 남아 있어서예요.

연습용 코드를 실제 서비스로 바꾸려면 뭘 더해요?

위 방명록은 층이 이어지는 모습만 보여 주려고 최소한으로 짰어요. 코드를 읽어 보면 실제 서비스에 필요한 장치가 여럿 빠져 있어요.

AI에게 "이 코드를 실제 서비스에 올려도 되는지 위 다섯 가지 기준으로 점검해 줘"라고 시키면 빠진 곳을 하나씩 채워 줘요.

흔히 쓰는 조합은 뭐가 있어요?

층마다 고를 도구가 여러 개라, 자주 쓰는 묶음에 이름을 붙여 부르기도 해요. 대표 예가 MERN이에요(MongoDB 설명).

정답 조합은 없어요. 데이터 칸이 표처럼 늘 똑같으면 PostgreSQL이나 MySQL을 고르는 경우도 많아요.

AI에게 풀스택 앱을 부탁할 때는요?

바이브코딩에서 자주 막히는 지점이 "화면은 되는데 데이터가 안 남아요"예요. 화면만 만든 상태라서 그래요. 저장소와 확인 방법까지 말로 정해 주면 한 번에 풀스택으로 나와요.

클로드 코드는 서버를 직접 켜고 curl로 시험할 수 있어서, 위 실험처럼 "껐다 켜도 남는지"까지 확인을 맡길 수 있어요.

자주 하는 오해와 주의할 점

• "풀스택 = 한 파일" 위 예시는 보기 쉽게 한 파일에 넣었을 뿐이에요. 실제 앱은 보통 화면·서버 폴더를 나눠요.
• "내 컴퓨터에서 되면 끝" 노트북을 끄면 앱도 멈춰요. 남들이 쓰려면 서버나 앱 호스팅에 올려야 해요.
• 배포하다 데이터베이스 파일을 지우면 안 돼요. 다시 배포할 때 저장 공간이 초기화되는 곳에 올리면 글이 사라져요. 데이터가 남는 저장 공간(볼륨)인지 꼭 확인해요.

퓨쳐인프라에서는 어떻게 올리나요?

풀스택 앱을 도커 이미지로 묶어 퓨쳐인프라 앱 호스팅에 올리면 주소와 HTTPS가 붙어요. 앱 하나는 월 5,500원, 데이터베이스를 붙이면 월 2,200원이 더해져 월 7,700원이에요(부가세 포함, 분 단위 계산).

데이터베이스는 MariaDB·MySQL·PostgreSQL·Redis 중에 고르고, 접속 정보는 앱 환경변수로 자동으로 들어가요. 위 예시처럼 SQLite 파일을 쓰는 앱이라면 볼륨에 두면 돼요. 볼륨 데이터는 다시 배포해도 남아요(GB당 월 200원).

자주 묻는 질문

풀스택 개발자가 되려면 무엇부터 배워요?

보통 HTML·CSS·자바스크립트로 화면을 먼저 만들고, 같은 자바스크립트로 Node.js 서버를 붙인 뒤 데이터베이스를 배워요. 언어 하나로 앞뒤를 다 써 볼 수 있어서 부담이 적어요.

혼자서 풀스택 서비스를 운영할 수 있어요?

작은 서비스라면 충분히 해요. 다만 백업, 오류 기록 보기, 보안 업데이트처럼 만든 뒤에 할 일도 같이 챙겨야 해요.

풀스택과 '올인원 노코드 도구'는 뭐가 달라요?

노코드 도구는 화면·저장을 플랫폼이 대신 갖고 있어요. 풀스택은 각 층의 코드와 데이터를 내가 갖고 있어서, 원하는 곳으로 옮기거나 마음대로 고칠 수 있어요.

SQLite로도 실제 서비스를 할 수 있어요?

방문자가 많지 않고 서버가 한 대라면 쓸 수 있어요. 여러 서버가 동시에 같은 데이터를 써야 하면 PostgreSQL·MySQL 같은 데이터베이스 서버가 더 맞아요.

관련 용어

• 프론트엔드는 풀스택의 맨 위층, 브라우저 화면이에요.
• 백엔드는 요청을 검사하고 저장하는 서버 쪽이에요.
• 데이터베이스는 새로고침해도 데이터를 남기는 곳이에요.
• API는 화면과 서버를 잇는 창구예요.
• 배포는 만든 앱을 실제 주소로 올리는 일이에요.
• 노코드는 코드 없이 블록으로 만드는 다른 방식이에요.