스킬 vanilla-webpage
📦
vanilla-webpage
콘텐츠 리비전 r1 안전 ⚡ 스크립트 포함⚙️ 외부 명령어🌐 네트워크 접근📁 파일 시스템 접근
정적 Vanilla 웹페이지 만들기
간단한 웹페이지에는 빌드 시스템이나 프론트엔드 프레임워크가 필요하지 않은 경우가 많습니다. 이 스킬은 Claude, Codex, Claude Code가 최신 HTML, CSS, JavaScript로 접근성 있는 정적 페이지를 만들 수 있도록 돕습니다.
지원: Claude Codex Code(CC)
내 에이전트로 설치
이 요청을 에이전트에 복사하세요. 공식 Skill 페이지와 매니페스트가 포함되어 있습니다.
에이전트 요청
Review the Skillstore skill "vanilla-webpage" from https://skillstore.io/skills/yuzu-octopus-vanilla-webpage.md and its manifest at https://skillstore.io/api/skills/yuzu-octopus-vanilla-webpage/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.에이전트는 계속해서 계획을 표시하고 보안 정책에서 요구하는 확인을 요청해야 합니다.
에이전트가 읽기 쉬운 리소스
AI 에이전트, 크롤러, 스크립트가 전체 페이지 대신 정리된 컨텍스트만 필요할 때 이 링크를 사용하세요.
테스트해 보기
"vanilla-webpage" 사용 중입니다. 지역 디자인 스튜디오를 위한 빌드 없는 홈페이지를 만드세요.
예상 결과:
시맨틱 섹션, 내장 스타일, 반응형 타이포그래피, 접근성 있는 버튼, 명확한 시각적 계층 구조를 갖춘 단일 HTML 페이지.
"vanilla-webpage" 사용 중입니다. 브라우저 저장소를 사용하는 작은 노트 인터페이스를 만드세요.
예상 결과:
폼 컨트롤, 저장된 노트, 편집 및 삭제 동작, 키보드 지원, 안전한 텍스트 렌더링 가이드를 갖춘 정적 페이지.
"vanilla-webpage" 사용 중입니다. 내비게이션과 예제가 있는 문서 페이지를 만드세요.
예상 결과:
사이드바, 문서 섹션, 코드 예제, 반응형 동작, 접근성 있는 포커스 스타일을 갖춘 읽기 쉬운 문서 레이아웃.
보안 감사
안전v4 • 2026. 7. 8. 버전별 보고서 열기
Most static alerts are false positives caused by Markdown backticks, CSS terminology, tutorial URLs, and browser syntax. I confirmed unsafe copyable DOM-rendering examples that place local user data into innerHTML without escaping. No evidence found for prompt injection, secret exfiltration, or actual shell command execution.
81
스캔된 파일
6,611
분석된 줄 수
3
검토 항목
0
오탐 무시됨
기능 검토 항목 (3)
이 스킬에 대해 예상될 수 있는 실제 로컬 기능이므로 검토가 필요하지만, 확인된 악의적 동작으로는 집계되지 않습니다.
중간
innerHTML assignment (XSS risk)
list.innerHTML = todos.map((t, i) => `
The todo demo renders locally entered todo text from localStorage into innerHTML without escaping. If copied for untrusted input, this is a stored DOM XSS pattern.
중간
innerHTML assignment (XSS risk)
document.getElementById('notes-grid').innerHTML = notes.map(n => `
The notes tutorial maps saved user note text into innerHTML without escaping. The example is documentation, but it teaches a copyable stored DOM XSS pattern.
중간
innerHTML assignment (XSS risk)
container.innerHTML = items.map(renderItem).join('');
The skill shows template-literal rendering into innerHTML using item fields. The snippet lacks an explicit trusted-data boundary, so it can encourage unsafe DOM rendering.
위험 요인
⚡ 스크립트 포함 (8)
⚙️ 외부 명령어 (300)
cookbook/interactivity/toast-notifications/index.html:63 cookbook/interactivity/todo-app/index.html:60-66 docs/tutorials/04-full-project.md:104-144 SKILL.md:41 SKILL.md:42 SKILL.md:43 SKILL.md:44 SKILL.md:48-51 SKILL.md:51-57 SKILL.md:57-60 SKILL.md:60-67 SKILL.md:67-70 SKILL.md:70-88 SKILL.md:88 SKILL.md:97-103 SKILL.md:103-109 SKILL.md:109 SKILL.md:110 SKILL.md:112 SKILL.md:113 SKILL.md:114-118 SKILL.md:118-132 SKILL.md:132-140 SKILL.md:140-147 SKILL.md:147-153 SKILL.md:153 SKILL.md:154-155 SKILL.md:155-159 SKILL.md:159-171 SKILL.md:171-175 SKILL.md:175-180 SKILL.md:180-184 SKILL.md:184-192 SKILL.md:192-194 SKILL.md:194 SKILL.md:198-212 SKILL.md:212-214 SKILL.md:214-218 SKILL.md:218-231 SKILL.md:231-233 SKILL.md:233-241 SKILL.md:241-245 SKILL.md:245-248 SKILL.md:248-252 SKILL.md:252-263 SKILL.md:263-265 SKILL.md:265 SKILL.md:266 SKILL.md:267 SKILL.md:272-275 SKILL.md:275-276 SKILL.md:276-278 SKILL.md:278-286 SKILL.md:286-303 SKILL.md:303-307 SKILL.md:307-318 SKILL.md:318-322 SKILL.md:322-333 SKILL.md:333-337 SKILL.md:337-347 SKILL.md:347-351 SKILL.md:351-369 SKILL.md:369-373 SKILL.md:373-382 SKILL.md:382-386 SKILL.md:386-398 SKILL.md:398-404 SKILL.md:404-407 SKILL.md:407-411 SKILL.md:411-415 SKILL.md:415-419 SKILL.md:419-425 SKILL.md:425-429 SKILL.md:429-432 SKILL.md:432-436 SKILL.md:436-439 SKILL.md:439-443 SKILL.md:443-452 SKILL.md:452-456 SKILL.md:456-465 SKILL.md:465-469 SKILL.md:469-476 SKILL.md:476-480 SKILL.md:480-494 SKILL.md:494-498 SKILL.md:498-513 SKILL.md:513-519 SKILL.md:519-524 SKILL.md:524-528 SKILL.md:528-535 SKILL.md:535-539 SKILL.md:539-548 SKILL.md:548-552 SKILL.md:552-566 SKILL.md:566-570 SKILL.md:570-585 SKILL.md:585-589 SKILL.md:589-624 SKILL.md:624-630 SKILL.md:630-641 SKILL.md:641-645 SKILL.md:645-669 SKILL.md:669-673 SKILL.md:673-693 SKILL.md:693-697 SKILL.md:697-701 SKILL.md:701-705 SKILL.md:705-710 SKILL.md:710-714 SKILL.md:714-720 SKILL.md:720-724 SKILL.md:724-752 SKILL.md:752-756 SKILL.md:756-767 SKILL.md:767-771 SKILL.md:771-777 SKILL.md:777-781 SKILL.md:781-789 SKILL.md:789-793 SKILL.md:793-802 SKILL.md:802-806 SKILL.md:806-820 SKILL.md:820-822 SKILL.md:822 SKILL.md:826-831 SKILL.md:831-835 SKILL.md:835-842 SKILL.md:842-846 SKILL.md:846-862 SKILL.md:862-864 SKILL.md:864-865 SKILL.md:865 SKILL.md:866-872 SKILL.md:872-889 SKILL.md:889-893 SKILL.md:893-898 SKILL.md:898-911 SKILL.md:911-913 SKILL.md:913-918 SKILL.md:918-921 SKILL.md:921-928 SKILL.md:928-943 SKILL.md:943-945 SKILL.md:945-946 SKILL.md:946-951 SKILL.md:951-963 SKILL.md:963-966 SKILL.md:966 SKILL.md:972-993 SKILL.md:993-1002 SKILL.md:1002-1016 SKILL.md:1016-1018 SKILL.md:1018-1028 SKILL.md:1028-1036 SKILL.md:1036-1059 SKILL.md:1059-1061 SKILL.md:1061-1062 SKILL.md:1062-1067 SKILL.md:1067-1072 SKILL.md:1072-1076 SKILL.md:1076-1082 SKILL.md:1082-1085 SKILL.md:1085-1090 SKILL.md:1090-1097 SKILL.md:1097-1099 SKILL.md:1099-1104 SKILL.md:1104-1108 SKILL.md:1108 SKILL.md:1116-1128 SKILL.md:1128-1132 SKILL.md:1132-1142 SKILL.md:1142-1146 SKILL.md:1146-1157 SKILL.md:1157-1161 SKILL.md:1161-1177 SKILL.md:1177-1181 SKILL.md:1181-1190 SKILL.md:1190-1194 SKILL.md:1194-1195 SKILL.md:1202-1205 SKILL.md:1205-1209 SKILL.md:1209-1211 SKILL.md:1211-1212 SKILL.md:1212-1215 SKILL.md:1215-1219 SKILL.md:1219-1237 SKILL.md:1237-1241 SKILL.md:1241-1246 SKILL.md:1246-1256 SKILL.md:1256-1260 SKILL.md:1260-1276 SKILL.md:1276-1280 SKILL.md:1280-1292 SKILL.md:1292-1296 SKILL.md:1296-1307 SKILL.md:1307-1311 SKILL.md:1311-1319 SKILL.md:1319-1323 SKILL.md:1323-1330 SKILL.md:1330-1334 SKILL.md:1334-1358 SKILL.md:1358-1362 SKILL.md:1362-1372 SKILL.md:1372-1375 SKILL.md:1375-1379 SKILL.md:1379-1388 SKILL.md:1388-1392 SKILL.md:1392-1398 SKILL.md:1398-1405 SKILL.md:1405-1466 SKILL.md:1466-1481 SKILL.md:1481-1488 SKILL.md:1488 SKILL.md:1489-1490 SKILL.md:1490-1494 SKILL.md:1494-1497 SKILL.md:1497-1505 SKILL.md:1505 SKILL.md:1513 SKILL.md:1515 SKILL.md:1516 SKILL.md:1517-1518 SKILL.md:1518 SKILL.md:1519 SKILL.md:1520 SKILL.md:1521-1542 SKILL.md:1542-1543 SKILL.md:1543-1545 SKILL.md:1545 SKILL.md:1547-1550 SKILL.md:1550-1558 SKILL.md:1558-1566 SKILL.md:1566-1573 SKILL.md:1573-1577 SKILL.md:1577-1602 SKILL.md:1602-1609 SKILL.md:1609-1614 SKILL.md:1614-1621 SKILL.md:1621-1629 SKILL.md:1629-1633 SKILL.md:1633-1638 SKILL.md:1638-1644 SKILL.md:1644-1649 SKILL.md:1649-1656 SKILL.md:1656-1659 SKILL.md:1659-1661 SKILL.md:1661-1673 SKILL.md:1673-1677 SKILL.md:1677-1681 SKILL.md:1681-1685 SKILL.md:1685-1699 SKILL.md:1699-1703 SKILL.md:1703-1709 SKILL.md:1709-1713 SKILL.md:1713-1721 SKILL.md:1721-1725 SKILL.md:1725-1734 SKILL.md:1734-1740 SKILL.md:1740-1743 SKILL.md:1743-1744 SKILL.md:1744-1745 SKILL.md:1745-1746 SKILL.md:1746-1747 SKILL.md:1747-1748 SKILL.md:1748-1751 SKILL.md:1751-1752 SKILL.md:1752-1753 SKILL.md:1753-1754 SKILL.md:1754-1755 SKILL.md:1755-1758 SKILL.md:1758-1759 SKILL.md:1759-1760 SKILL.md:1760-1761 SKILL.md:1761-1762 SKILL.md:1762-1765 SKILL.md:1765-1766 SKILL.md:1766-1767 SKILL.md:1767-1768 SKILL.md:1768-1771 SKILL.md:1771-1772 SKILL.md:1772-1773 SKILL.md:1773-1774 SKILL.md:1774-1775 SKILL.md:1775-1776 SKILL.md:1776-1777 SKILL.md:1777-1778 SKILL.md:1778-1779 SKILL.md:1779-1782 SKILL.md:1782-1783 SKILL.md:1783-1784 SKILL.md:1784 SKILL.md:1785 SKILL.md:1786-1787 SKILL.md:1787-1788 SKILL.md:1788-1789 SKILL.md:1789-1790 SKILL.md:1790-1793 SKILL.md:1793-1794 SKILL.md:1794-1795 SKILL.md:1795-1796
🌐 네트워크 접근 (12)
📁 파일 시스템 접근 (1)
감사자: codex 감사 이력 보기 →
이 보고서 공유 및 인용
버전이 지정된 평가 보고서, 중립 배지, 임베드 카드 및 인용을 공유하세요. Skillstore는 근거를 보고하지만 이 Skill의 안전 여부를 판단하지 않습니다.
보고서 링크 복사
https://skillstore.io/skills/yuzu-octopus-vanilla-webpage/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown 배지
[](https://skillstore.io/skills/yuzu-octopus-vanilla-webpage?utm_source=security_passport_badge)HTML 배지
<a href="https://skillstore.io/skills/yuzu-octopus-vanilla-webpage?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/yuzu-octopus-vanilla-webpage/security.svg" alt="Skillstore security assessment" loading="lazy"></a>임베드 카드
<iframe src="https://skillstore.io/embed/skills/yuzu-octopus-vanilla-webpage.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>학술 인용 (APA · BibTeX · CFF)
APA 인용
yuzu-octopus. (2026). vanilla-webpage security audit report (audit version 4) [Author version unspecified]. Skillstore. https://skillstore.io/skills/yuzu-octopus-vanilla-webpage/audits/4BibTeX 인용
@techreport{yuzu-octopus-yuzu-octopus-vanilla-webpage-2026,
author = {yuzu-octopus},
title = {vanilla-webpage security audit report (audit version 4)},
institution = {Skillstore},
year = {2026},
number = {4},
url = {https://skillstore.io/skills/yuzu-octopus-vanilla-webpage/audits/4},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "vanilla-webpage security audit report (audit version 4)"
version: "unspecified"
type: report
authors:
- name: "yuzu-octopus"
date-released: "2026-07-08"
url: "https://skillstore.io/skills/yuzu-octopus-vanilla-webpage/audits/4"
identifiers:
- type: other
value: "skillstore:yuzu-octopus-vanilla-webpage:audit:4"
description: "Skillstore immutable audit report identifier"
Skillstore 점수
이 점수의 이유 증거 신뢰도: 중간 55
아키텍처
85
유지보수성
87
콘텐츠
67
커뮤니티
70
사양 준수
만들 수 있는 것
제품 페이지 프로토타입 만들기
시맨틱 섹션, 다듬어진 CSS, 빌드 도구 없이 반응형 마케팅 또는 제품 페이지를 만듭니다.
문서 페이지 만들기
내비게이션, 타이포그래피, 코드 블록, 접근성 있는 구조를 갖춘 읽기 쉬운 문서 레이아웃을 생성합니다.
소규모 브라우저 도구 만들기
폼 컨트롤, 로컬 상호작용, 명확한 반응형 동작을 갖춘 단일 페이지 유틸리티를 만듭니다.
이 프롬프트를 사용해 보세요
초보자용 랜딩 페이지
소규모 비즈니스를 위한 단일 파일 정적 웹페이지를 만드세요. 시맨틱 HTML, 반응형 CSS, 접근성 있는 색상, 빌드 단계 없음을 사용하세요.
반응형 레이아웃
sticky header, feature sections, cards, footer가 있는 반응형 웹페이지 레이아웃을 만드세요. vanilla CSS를 사용하고 레이아웃 결정 사항을 간단히 설명하세요.
인터랙티브 폼
vanilla JavaScript를 사용하여 validation states, keyboard-friendly controls, safe DOM updates를 갖춘 접근성 있는 contact form을 만드세요.
다듬어진 다중 섹션 페이지
vanilla webpage skill을 사용하여 다듬어진 다중 섹션 dashboard page를 만드세요. 적절한 경우 cookbook patterns를 재사용하고 반응형 동작을 검증하세요.
모범 사례
- 시맨틱 HTML로 시작하고 페이지 동작에 필요할 때만 CSS 또는 JavaScript를 추가합니다.
- 새로운 간격, 색상 또는 컴포넌트 스타일을 만들기 전에 제공된 토큰과 cookbook patterns를 사용합니다.
- 사용자 제공 텍스트는 raw innerHTML 대신 textContent 또는 sanitize된 출력으로 렌더링합니다.
피하기
- 간단한 정적 페이지에 패키지 매니저, 빌드 도구 또는 대형 프레임워크를 추가하는 것.
- 입력 처리와 접근성을 확인하지 않고 cookbook JavaScript를 프로덕션에 복사하는 것.
- 가독성, 대비, 키보드 접근성 또는 모션 편안함을 떨어뜨리는 시각 효과를 사용하는 것.
자주 묻는 질문
이 스킬에 Node 또는 npm이 필요한가요?
아니요. 이 스킬은 간단한 로컬 서버에서 직접 제공되는 정적 HTML, CSS, JavaScript를 위해 설계되었습니다.
CSS 프레임워크를 사용할 수 있나요?
예, 하지만 의사결정 프레임워크가 해당 페이지에 유용하다고 판단하는 경우에만 허용된 소규모 프레임워크를 사용합니다.
복잡한 웹 애플리케이션에 적합한가요?
아니요. 정적 페이지, 프로토타입, 문서 페이지, 소규모 브라우저 도구에 가장 적합합니다.
접근성 가이드가 포함되어 있나요?
예. 시맨틱 마크업, 레이블, 키보드 포커스, 대비, 동작 줄이기, 반응형 동작을 다룹니다.
Claude Code 또는 Codex가 사용할 수 있나요?
예. 이 스킬은 Claude, Codex, Claude Code 워크플로 지원을 명시합니다.
예제는 프로덕션 준비가 되어 있나요?
유용한 시작점입니다. 사용자 입력을 렌더링하는 JavaScript 예제는 프로덕션 사용 전에 검토하고 보강해야 합니다.
개발자 세부 정보
작성자
yuzu-octopus라이선스
MIT
Skillstore 리비전
r1
버전 안내
작성자가 버전을 선언하지 않았습니다.
참조
64ca8af0f54a325752f08bd54e52151061ea659a
유지보수 최신성
2026. 7. 20.
사용량
4 다운로드 · 1 조회