المهارات frontend-code-review
📦

frontend-code-review

آمن ⚙️ الأوامر الخارجية🌐 الوصول إلى الشبكة

審查前端程式碼

前端程式碼審查可幫助開發人員在部署前發現錯誤和不良模式。此技能使用業界最佳實踐,為 TypeScript、JavaScript、TSX 和 JSX 檔案提供基於清單的自動化審查。

يدعم: Claude Codex Code(CC)
🥉 74 برونزي
1

تنزيل ZIP المهارة

2

رفع في Claude

اذهب إلى Settings → Capabilities → Skills → Upload skill

3

فعّل وابدأ الاستخدام

اختبرها

استخدام "frontend-code-review". Review app/components/button.tsx

النتيجة المتوقعة:

  • ## Code Review: app/components/button.tsx
  •  
  • ### Business Logic
  • ✓ Error boundaries handled appropriately
  • ✓ Type definitions are strict
  •  
  • ### Code Quality
  • ✓ Component naming follows PascalCase convention
  • ✓ Props are properly typed with interfaces
  • ⚠ Consider extracting inline styles to CSS modules
  •  
  • ### Performance
  • ✓ No unnecessary re-renders detected
  • ✓ Event handlers are properly memoized

استخدام "frontend-code-review". Review app/utils/api.ts

النتيجة المتوقعة:

  • ## Code Review: app/utils/api.ts
  •  
  • ### Business Logic
  • ⚠ Missing error handling for network failures
  • ✓ API response validation in place
  •  
  • ### Code Quality
  • ✓ Consistent naming convention for functions
  • ⚠ Consider using a typed response wrapper
  •  
  • ### Performance
  • ✓ Appropriate use of caching annotations
  • ✓ Request deduplication implemented

التدقيق الأمني

آمن
v1 • 1/29/2026

Documentation-only skill with no executable code. Static scanner flagged text patterns in markdown files (backticks for code formatting, URLs in references, technical terms in documentation). All 45 detected patterns are FALSE POSITIVES - markdown documentation cannot execute commands, make network calls, or contain exploitable code. Safe for publication.

4
الملفات التي تم فحصها
181
الأسطر التي تم تحليلها
3
النتائج
1
إجمالي عمليات التدقيق
مشكلات منخفضة المخاطر (1)
Documentation Pattern False Positives
Static scanner incorrectly flagged text patterns in markdown files. Backticks are markdown code formatting, not shell execution. URLs are documentation references, not network calls. Technical term mentions are not actual cryptographic code.

عوامل الخطر

⚙️ الأوامر الخارجية
لم يتم تسجيل أي مواقع محددة
🌐 الوصول إلى الشبكة
لم يتم تسجيل أي مواقع محددة
تم تدقيقه بواسطة: claude

درجة الجودة

45
الهندسة المعمارية
100
قابلية الصيانة
87
المحتوى
37
المجتمع
100
الأمان
91
الامتثال للمواصفات

ماذا يمكنك بناءه

快速檔案審查

請求對單一檔案進行重點審查,以立即獲得程式碼品質和潛在問題的回饋。

Pull Request 審查

審查 Pull Request 中所有已更改的檔案,以確保程式碼在合併前符合品質標準。

舊程式碼評估

評估較舊的程式碼庫以識別技術債務並優先考慮重構工作。

جرّب هذه الموجهات

基本檔案審查
Review this file for code quality and potential issues:

${file_path}
已更改檔案審查
Review these changed files for a pull request. Apply the full checklist from business-logic.md, code-quality.md, and performance.md:

${file_paths}
專注特定問題
Review this file with emphasis on business logic and error handling:

${file_path}
全面審查
Perform a complete code review of the following files. For each issue found, explain the problem and suggest improvements:

${file_paths}

أفضل الممارسات

  • 對重點單一檔案審查和全面的多檔案評估都使用此技能,以發現不同類型的問題
  • 在上下文中審查發現 - 有些建議可能不適用於您的特定用例或程式碼標準
  • 將自動化審查與手動測試相結合,以確保程式碼不僅結構良好,而且能正確運作

تجنب

  • 避免請求審查非前端檔案(Python、Go 等)- 此技能已針對 TS/JS 生態系統進行優化
  • 不要期望此技能執行或測試您的程式碼 - 它僅提供靜態分析
  • 避免忽視與 TypeScript 類型相關的發現 - 嚴格的類型可防止執行時錯誤

الأسئلة المتكررة

此技能支援哪些檔案類型?
此技能支援 TypeScript (.ts)、JavaScript (.js)、TypeScript React (.tsx) 和 JavaScript React (.jsx) 檔案。
此技能會修改我的程式碼嗎?
不會。此技能只會分析和報告發現。它不會修改、重構或撰寫任何程式碼更改。
我可以將此用於後端程式碼審查嗎?
不會。此技能專門為前端程式碼設計。請使用特定語言的審查工具來處理 Python、Go 或其他後端語言。
這與 ESLint 相比如何?
此技能透過提供對業務邏輯、架構決策和程式碼模式的上下文回饋來補充 ESLint,這是自動化工具無法評估的。
我可以自定義審查清單嗎?
此技能使用內建的參考文件(business-logic.md、code-quality.md、performance.md)。可以透過提示模板調整審查重點。
此技能適用於 Next.js 和 React 嗎?
是的。此技能包含 React 特定的檢查,包括 Hooks 使用、組件模式和框架特定的最佳實踐。

تفاصيل المطور

المؤلف

langgenius

الترخيص

MIT

مرجع

main

بنية الملفات