바이브코딩 첫 배포 전, AI가 고른 웹 기능을 누구나 쓸 수 있는지 어떻게 확인할까요?

핵심 요약 (TL;DR)

내 컴퓨터에서는 잘 보이는 웹사이트가 다른 사람의 휴대폰에서는 다르게 움직일 수 있습니다. 9월 16일 Show HN에 소개된 Now You Can Use는 새 웹 기능이 언제부터 널리 사용할 만해졌는지 살펴보는 작은 사이트입니다. 제작자는 ‘새롭고 실제로 쓸 수 있는 기능’을 쉽게 보고 싶어 AI의 도움으로 만들었다고 밝혔습니다. 이 소개일을 최초 출시일로 단정하지는 않습니다. 첫 바이브코딩 프로젝트에도 같은 질문이 필요합니다. AI가 만들 수 있다는 것과 사용자가 쓸 수 있다는 것은 다르니까요.

이 작은 사이트는 어떤 불편을 줄일까요?

Now You Can Use에는 기능을 시간순으로 보는 화면과 검색, 상태·분류·연도별 링크가 있습니다. CSS나 HTML 요소처럼 관심 분야를 좁히고, 개별 기능의 브라우저 지원 정보를 살펴볼 수 있습니다. 제작자의 문제는 새로운 기술이 부족해서가 아니라, 지금 채택해도 될 기술을 한눈에 고르기 어려웠다는 데 있었습니다.

모델·제작 기간·AI 작성 비중과 전체 데이터 정확성은 검증하지 못했습니다. 작은 판단을 편하게 만든 사례로 읽어 주세요.

Baseline의 ‘사용 가능’은 무슨 뜻일까요?

공식 web.dev 설명에서 Baseline Newly available은 기준 브라우저 집합이 해당 기능을 지원하는 단계입니다. 그 시점에서 30개월이 지나면 Widely available이 됩니다. 아직 기준 브라우저 전반에서 지원하지 않는 기능은 Limited availability로 구분합니다. 기준 집합에는 데스크톱뿐 아니라 Android의 Chrome·Firefox와 iOS의 Safari도 포함됩니다.

여기서 ‘널리 사용 가능’은 세상의 모든 기기에서 같은 결과가 나온다는 보증이 아닙니다. 오래된 브라우저나 앱 안의 웹뷰처럼 실제 고객 환경은 따로 살펴야 합니다. 새 기능을 발견하는 입구로 사이트를 이용하고, 중요한 선택은 공식 문서와 내 서비스의 사용자 환경을 다시 대조하는 편이 좋습니다.

첫 프롬프트에는 무엇을 더 적어야 할까요?

‘예쁜 신청 페이지를 만들어 주세요’에 한 문장을 보태 보세요. ‘사용자가 iPhone과 Android에서 열 예정입니다. 사용하는 새 웹 기능의 지원 범위를 확인하고, 지원하지 않을 때도 신청을 끝낼 수 있게 해 주세요.’ 처음부터 라이브러리 이름을 외울 필요는 없습니다. 누가 어떤 기기로 핵심 행동을 끝내야 하는지 먼저 설명하면 됩니다.

완성 뒤에는 AI에게 새로 사용한 브라우저 기능, 확인한 문서 URL, 지원이 부족할 때의 대안을 정리하게 하세요. 이것은 제작자의 작업 방식을 재현한 절차가 아니라 입문자를 위한 제안입니다. 버튼을 누르고 내용을 입력해 저장하는 핵심 흐름은 직접 다른 기기에서도 확인해야 합니다.

배포 후 오류가 생겼다면 ‘안 돼요’ 대신 기기, 브라우저, 발생한 행동과 기대 결과를 남겨 보세요. AI가 지원 범위를 확인해 고쳤더라도 같은 환경에서 다시 실행해야 끝납니다. 새 기능을 많이 넣는 것보다, 낯선 사람도 끝까지 사용할 수 있는 작은 페이지가 첫 배포에는 더 좋은 목표입니다.

FAQ: Widely available만 쓰면 테스트를 안 해도 되나요?

아닙니다. 지원 여부와 내 코드의 정확성은 별개입니다. 입력 오류, 모바일 배치, 실제 저장 결과는 브라우저 지원 표만으로 확인할 수 없습니다.

FAQ: 코딩 용어를 모르면 무엇부터 물어볼까요?

‘이 기능이 안 되는 브라우저에서도 사용자가 같은 목적을 달성할 수 있나요?’부터 물어보세요. 기술 이름보다 사용자 행동을 기준으로 대안을 설명하게 하면 됩니다.

출처: https://nowyoucanuse.com/
제작자 소개: https://news.ycombinator.com/item?id=49720877
정의 확인: https://web.dev/baseline
확인: 2026-09-17 KST