Are Frontend Developers Cooked? Is Frontend design safe?
프론트엔드 개발자는 끝났을까요? 프론트엔드 디자인은 안전할까요?
AI 에이전트가 프론트엔드 앱을 빠르게 만들지만, 접근성·성능·사용자 경험을 판단하는 일은 여전히 개발자의 몫이라고 설명합니다. Winamp 재현 앱과 5K 훈련 앱을 만든 경험을 바탕으로, 프론트엔드 역할이 풀스택으로 넓어지고 있다고 말합니다.
- 주제
AI 요약
프론트엔드 개발이 사라지는 게 아니라 역할이 바뀌고 있으며, 개발자 다수가 풀스택으로 이동하고 있다는 주장을 후속 글에서 살펴봅니다. 글쓴이는 62세 개발자가 Claude로 업무의 절반가량을 처리한다는 댓글을 소개합니다. 그 개발자는 Vue나 Angular 같은 프론트엔드 프레임워크 몇 가지와 C# 같은 백엔드를 골라 깊이 익히라고 조언합니다. 글쓴이도 특정 분야의 전문성과 기반 기술 지식이 필요하다는 데 동의합니다. Kiro를 에이전트 하네스로 쓰지만, 에이전트가 잘못된 방향으로 갈 때 판단하고 바로잡으려면 기술 스택을 알아야 한다고 말합니다.
AI 에이전트가 만든 프론트엔드
CRUD 앱은 LLM이 쉽게 처리하지만, 개성 있는 UI와 좋은 UX는 아직 어렵다는 의견을 소개합니다. 예전 Anthropic 모델이 만든 화면은 Tailwind 템플릿처럼 보여 금방 알아볼 수 있었지만, 새 모델이 나올수록 구별하기 어려워지고 있다고 합니다. 화면을 보고 UX가 제대로 작동하는지, 접근성 문제가 있는지, 사용자 흐름이 막히는지 판단하는 감각은 경험에서 나오지만 LLM도 계속 나아지고 있다고 덧붙입니다.
글쓴이는 작은 UI 요소가 많은 Winamp MP3 플레이어를 Kiro Crew로 재현해 ErikAmp를 만들었습니다. 이퀄라이저 슬라이더, 스크롤 재생 목록, 재생·일시 정지·정지·다음·이전, 셔플·반복, 밸런스와 볼륨을 구현했습니다. 직접 만들면 다른 일을 하지 않아도 며칠 걸릴 작업을 에이전트가 한 번에 만들었고, 이후 버그 수정과 테스트 스위트 작성도 맡겼다고 합니다. Vue나 React를 지정하지 않아 결과물은 index.html, CSS, JavaScript 파일 몇 개와 Python으로 구성됐습니다. 기존 디자인을 재현한 점은 인정하면서도, 새 테마 세 가지를 추가로 만들었고 결과가 좋았다고 설명합니다.
두 번째 앱은 5K 대회를 준비하려고 만든 훈련 코치입니다. 매일 할 일을 알려주며, 어두운 카드와 둥근 모서리, 알약 모양 배지가 있는 전형적인 Anthropic 스타일에 가깝습니다. 화려하거나 대단한 디자인은 아니지만 개인 훈련 계획에는 충분했고, 에이전트로 몇 분 만에 만들었다고 합니다. 글쓴이는 프론트엔드 제작이 어느 때보다 쉬워졌지만, 결과물이 좋은지 판단하려면 개발자가 기술 스택과 디자인 감각을 갖춰야 한다고 말합니다.
dev.to 반응
- @erikch — 댓글을 남겨 주세요!
- @francistrdev — 저도 프론트엔드 개발자가 끝났다고 생각하지 않습니다. AI를 쓰면 프론트엔드 작업은 쉬워지지만, 좋은 프론트엔드를 만드는 데 필요한 요소를 놓치기 쉽습니다. 접근성과 최적화가 그중 하나입니다. 프론트엔드 전반을 대충 요청하면 눈에 바로 보이지 않는 요소를 빠뜨리기 쉽습니다. 대상 사용자가 누구인지에 따라 접근성도 달라질 수 있으니 직접 테스트해야 합니다. 최적화도 브라우저와 컴퓨터 사양에 따라 달라져 까다롭습니다. 상세하게 프롬프트를 작성해도 좋은 디자인인지보다 외관에 집중하게 됩니다. AI가 예외 상황을 처리할 수는 있지만 직접 시험해 보기 전에는 제대로 처리했는지 알 수 없습니다. 훌륭한 글입니다, Erik!
- @beusebiu — 제목이 바뀐 게 제가 보는 현실과 맞습니다. 저는 매일 프론트엔드에 Vue를 쓰고 백엔드에는 Laravel을 씁니다. 어느 쪽을 맡는 주인지에 따라 일의 본질이 달라지지는 않습니다. AI가 먼저 대체한다면 두 영역을 잇는 작업일 것 같습니다. 엔드포인트에 폼을 연결하거나 검증 로직을 양쪽에 작성하는 일 말입니다. 엔드포인트가 애초에 무엇을 해야 하는지 결정하는 일은 우리 몫으로 남습니다.
원문: dev.to / 번역·요약: Trawling