Insights·2026-06-11

AI가 코드를 다 짜 주는 시대에 프론트엔드 지식은 왜 필요한가

AI가 코드를 대신 써 주더라도 프론트엔드의 기본 개념을 모르면 AI에게 시킬 수 있는 일의 수준이 거기서 멈추기 때문입니다. React, npm, 빌드, SSR 같은 용어는 암기 대상이 아니라 웹이 문제를 풀 때마다 새 문제가 생기며 이어진 문제 해결의 연쇄이고, 이 진화의 지도가 머릿속에 있어야 AI에게 내리는 지시가 구체적으로 바뀝니다.

AI가 코드를 짜 주는데 왜 개념을 알아야 하는가

"AI가 코드를 다 짜 주는데 프론트엔드 지식이 왜 필요하냐"는 질문을 자주 받습니다. 답은 단순합니다. 개념을 모르면 AI에게 시킬 수 있는 일의 수준이 거기서 멈춥니다. 도구는 지시를 실행할 뿐이고, 무엇을 지시할지는 지시하는 사람의 머릿속 지도에서 나오기 때문입니다.

React, npm, 빌드, SSR 같은 단어는 외워야 할 용어집이 아니라 문제 해결의 연쇄입니다. 각각은 앞 단계가 풀어 준 문제 위에서 새로 생긴 문제를 풀기 위해 등장했습니다. 이 연결을 모르면 AI가 내놓은 결과를 검수할 기준도, 다음에 무엇을 시킬지 판단할 근거도 사라집니다.

웹은 문제를 풀면 새 문제가 생기는 방식으로 자랐다

웹은 1989년 연구 문서를 링크로 잇는 공유 시스템으로 출발했습니다. 문서를 꾸미고 싶어서 CSS가 나왔고, 화면이 사용자에게 반응하게 만들려고 JavaScript가 나왔습니다. 페이지가 복잡해지며 코드가 폭발하자 이를 다루기 위해 jQuery를 거쳐 React가 등장했고, 남이 만든 부품을 가져다 쓰려고 npm이, 브라우저가 아직 못 읽는 최신 문법을 브라우저가 이해하는 형태로 옮기려고 빌드 과정이 생겼습니다.

앱 같은 매끄러운 경험을 원해 화면 전환을 브라우저 안에서 처리하는 SPA로 갔더니, 이번엔 검색 엔진에 페이지가 잡히지 않는 문제가 생겼습니다. 그래서 서버에서 화면을 미리 그려 보내는 SSR로 다시 돌아왔습니다. 한 걸음이 새 문제를 낳고 그 문제가 다음 도구를 불러내는 이 흐름 자체가, 오늘날 프론트엔드라 불리는 지형의 정체입니다.

같은 도구를 쓰는데 결과물이 갈리는 이유

이 흐름이 머릿속에 있으면 package.json이 왜 필요한지, 빌드가 왜 끼어드는지 더 이상 묻지 않게 됩니다. 무엇보다 AI에게 내리는 지시가 달라집니다. "버튼 예쁘게 만들어 줘"에 머무르던 지시가 "이 데이터가 바뀌면 저 화면도 같이 바뀌게 해 줘"로 바뀝니다.

앞의 지시는 AI를 장식가로 대하고, 뒤의 지시는 이름이 붙은 문제를 건넵니다. 상태가 바뀌면 화면이 따라 바뀌어야 한다는, 정확히 React가 풀려던 바로 그 문제 말입니다. 같은 도구를 쓰는데 결과물이 갈리는 이유가 여기에 있습니다. 결과를 가르는 것은 도구의 성능이 아니라 문제를 얼마나 정확한 층위에서 지시하느냐입니다.

바이브 코딩 교육이 도구보다 역사를 먼저 꺼내는 이유

기술은 문제를 풀면 그 자리에서 새 문제가 생기는 방식으로 진화합니다. 그래서 비개발자가 AI와 함께 일할 때 정말 필요한 것은 문법 암기가 아니라 이 진화의 지도입니다. 지도를 가진 사람은 도구가 바뀌어도 "이건 어떤 문제를 풀려고 나온 것"인지 위치를 잡고, 그 자리에서 정확한 지시를 만들어 냅니다.

SH Consulting이 바이브 코딩 교육에서 도구 사용법보다 역사를 먼저 꺼내는 이유가 이것입니다. 단축키와 명령어는 반나절이면 익히지만, 왜 그 도구가 존재하는지에 대한 감각은 계보를 따라가야 생깁니다. AI 시대에 귀해지는 능력은 도구를 켤 줄 아는 것이 아니라, 무엇을 시킬지 정확히 아는 것입니다.