本文へ移動
cccskills
無料GitHub で公開

qa

Use when completing any task (final validation step), running audits, preparing for deployment, or when ESLint/TypeScript/build errors occur.

日本語の概要は準備中です。原文の説明を表示しています。

holger1411/astrodeckスター 80(GitHub 80 + cccskills 0)

実行スコア 未検証

インストール方法を見る

含まれるファイル(2)

  • SKILL.md3.6 KB
  • LEARNINGS.md737 B

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

QA Skill

Canonical Sources

This skill references the following globals — read them BEFORE starting work:

  • system/globals/responsiveness.md — Breakpoints, test order, anti-patterns

Domain

Testing, Validation, Code Quality, Launch Readiness

KPIs

MetricTargetMeasurement
Lighthouse Best Practices>90Lighthouse JSON → categories.best-practices.score * 100
ESLint Errors0npm run lint -- --format json
ESLint Warnings0npm run lint -- --format json
Formatting Issues0npm run format:check
HTML Validation Errors0npx html-validate dist/

Rules

Build Pipeline

# Full QA pipeline
npm run check:kpis    # All static convention checks (single source of truth)
npm run lint          # ESLint errors/warnings
npm run format:check  # Prettier formatting
npm run check         # Astro type check — covers .astro templates, which tsc alone does not
npm run build         # Astro build (0 errors, 0 warnings)

Shortcut: npm run validate runs check:kpis, lint, format:check and check in sequence.

Pre-Launch Checklist

Content

  • No placeholder content ("Lorem ipsum", "TODO", "FIXME")
  • All links work (no # or javascript:void(0))
  • Images have descriptive alt text
  • Text is proofread

Branding

  • Logo replaced (no longer AstroDeck default)
  • Favicon set (public/favicon.svg)
  • OG image created (public/og-image.png, 1200x630px)
  • Site title and description in astro.config.mjs

Legal

  • Imprint present (required in DACH region)
  • Privacy policy present
  • Cookie banner configured (if tracking active)

Analytics & Forms

  • Analytics code integrated (if desired)
  • Forms submit to correct endpoints
  • Forms have honeypot/CAPTCHA

Performance

  • Lighthouse Performance >90
  • Images optimized (WebP/AVIF, responsive sizes)
  • No unnecessary client:load directives
  • External scripts with SRI

Lighthouse Targets

CategoryMinimumIdeal
Performance9095+
Accessibility9095+
Best Practices9095+
SEO9095+

Dark Mode Testing

  • All pages checked in dark mode
  • No white surfaces or unreadable text
  • Images/icons visible (no black logo on black background)
  • Toggle works and persists selection

Cross-Browser

  • Chrome/Edge (Chromium)
  • Firefox
  • Safari (WebKit)
  • Mobile Safari (iOS)
  • Chrome Mobile (Android)

Non-Negotiable

These rules always apply — even under time pressure, even for "just a small update":

  • No commit without npm run build. "I only changed text" — content changes can also break the build (missing frontmatter fields, broken links).
  • No ESLint ignore without comment. // eslint-disable-next-line is allowed, but only with an explanation of why the rule doesn't apply here.
  • No skipping the QA pipeline. "It's urgent" is not an exception. The pipeline (lint → format → tsc → build) takes under 30 seconds.
  • Lighthouse always all 4 categories. Never measure only performance and ignore the rest. A score drop in any category is a blocker.
  • Responsive test is part of QA. "Looks good on my monitor" doesn't count. At minimum, 375px and 1280px must be checked.

Before Applying

Read LEARNINGS.md in this directory to avoid known anti-patterns.

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

コメント

ログインなしで書き込めます。使ってみた感想、質問、動かなかった環境などを気軽にどうぞ。

まだコメントはありません。最初のコメントを書いてみませんか。

送信するとすぐに公開されます。メールアドレスや電話番号などの個人情報は書かないでください。URL は 2 つまでです。

0 / 1000 文字

このフォームは reCAPTCHA で保護されており、Google のプライバシーポリシーと利用規約が適用されます。

同じリポジトリのスキル

Use when creating or modifying any UI element visible to the user, reviewing HTML markup, adding interactive elements, or when Lighthouse Accessibility drops below 90.

日本語の概要は準備中です。原文の説明を表示しています。

holger1411/astrodeck802026年9月5日 更新

astro

無料

Use when creating or modifying .astro/.tsx files, configuring astro.config.mjs, working with Content Collections, or when TypeScript or build errors occur.

日本語の概要は準備中です。原文の説明を表示しています。

holger1411/astrodeck802026年9月5日 更新

Use when creating or editing pages, blog posts, or content files, adding meta tags, or when Lighthouse SEO drops below 90.

日本語の概要は準備中です。原文の説明を表示しています。

holger1411/astrodeck802026年9月5日 更新

readme

無料

Use when starting work on an AstroDeck project, needing to understand the project structure, or looking up available components, sections, and layouts.

日本語の概要は準備中です。原文の説明を表示しています。

holger1411/astrodeck802026年9月5日 更新

tailwind

無料

Use when writing or reviewing any CSS class, changing colors, modifying globals.css, or when hardcoded colors or inline styles are detected.

日本語の概要は準備中です。原文の説明を表示しています。

holger1411/astrodeck802026年9月5日 更新

ui-design

無料

Use when creating or modifying any visible UI element, adjusting spacing or typography, reviewing visual consistency, or when Lighthouse Performance drops below 90.

日本語の概要は準備中です。原文の説明を表示しています。

holger1411/astrodeck802026年9月5日 更新

holger1411 のスキルをすべて見る

このスキルの問題を報告する