Code Patterns & Practices
套用 React Native 編碼模式
React Native 團隊經常重複處理元件、狀態與資料擷取的決策。此技能為 Claude、Codex 和 Claude Code 提供一份精簡參考，涵蓋經實證的 TypeScript 模式。
使用我的智慧代理安裝
將此請求複製給你的智慧代理，其中包含權威 Skill 頁面和清單。
Review the Skillstore skill "Code Patterns & Practices" from https://skillstore.io/skills/babakbar-code-patterns-practices.md and its manifest at https://skillstore.io/api/skills/babakbar-code-patterns-practices/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.你的智慧代理仍應顯示其計畫，並依安全政策請求必要確認。
Agent 可讀資源
當 AI Agent、爬蟲或腳本需要乾淨脈絡、而不是讀取完整頁面時，請使用這些連結。
測試它
正在使用「Code Patterns & Practices」。 開發者詢問如何在多個畫面之間重用 modal 開啟與關閉邏輯。
預期結果:
此技能建議提取 custom hook，具備清楚的狀態所有權與簡單的 toggle API。
正在使用「Code Patterns & Practices」。 團隊需要在許多 React Native 畫面之間分享目前使用者。
預期結果:
此技能會比較 context 與輕量級全域 store，然後根據更新頻率推薦較簡單的選項。
正在使用「Code Patterns & Practices」。 某個畫面會擷取使用者資料，有時會在使用者離開畫面後更新狀態。
預期結果:
此技能建議加入 effect cleanup、明確的載入與錯誤狀態，以及更安全的資料擷取流程。
安全審計
安全All 31 static findings are false positives caused by Markdown fences, TypeScript template literals, an illustrative relative API request, public documentation links, and a section heading. The skill is documentation-only and contains no prompt injection, command execution, credential access, or data-exfiltration intent.
風險因素
⚡ 包含腳本 (1)
⚙️ 外部命令 (26)
🌐 網路存取 (3)
分享與引用此報告
分享版本化評估報告、中性徽章、嵌入卡片與引用。Skillstore 只報告證據，不判斷該 Skill 是否安全。
複製報告連結
https://skillstore.io/skills/babakbar-code-patterns-practices/audits/12?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown 徽章
[](https://skillstore.io/skills/babakbar-code-patterns-practices?utm_source=security_passport_badge)HTML 徽章
<a href="https://skillstore.io/skills/babakbar-code-patterns-practices?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/babakbar-code-patterns-practices/security.svg" alt="Skillstore security assessment" loading="lazy"></a>嵌入卡片
<iframe src="https://skillstore.io/embed/skills/babakbar-code-patterns-practices.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 引用
BabakBar. (2026). Code Patterns & Practices security audit report (audit version 12) [Author version unspecified]. Skillstore. https://skillstore.io/skills/babakbar-code-patterns-practices/audits/12BibTeX 引用
@techreport{babakbar-babakbar-code-patterns-practices-2026,
author = {BabakBar},
title = {Code Patterns & Practices security audit report (audit version 12)},
institution = {Skillstore},
year = {2026},
number = {12},
url = {https://skillstore.io/skills/babakbar-code-patterns-practices/audits/12},
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: "Code Patterns & Practices security audit report (audit version 12)"
version: "unspecified"
type: report
authors:
- name: "BabakBar"
date-released: "2026-07-18"
url: "https://skillstore.io/skills/babakbar-code-patterns-practices/audits/12"
identifiers:
- type: other
value: "skillstore:babakbar-code-patterns-practices:audit:12"
description: "Skillstore immutable audit report identifier"
Skillstore 評分
評分依據 證據置信度: 高你可以打造什麼
規劃新功能
在實作 React Native 畫面前，選擇元件與狀態模式。
重構重複邏輯
將重複行為移至自訂 hooks 或邊界更清楚的共用元件。
審查應用程式品質
檢查 React Native 功能的載入狀態、清理、錯誤處理與行動版面配置考量。
試試這些提示
我正在建置一項 React Native 功能。請幫我在 custom hook、compound components 和 render props 之間做選擇。說明取捨。
審查這個 React Native 狀態流程，並建議 local state、context 或 Zustand store 何者最合適。說明遷移步驟。
幫我改善 React Native data-fetching hook。專注於載入狀態、錯誤處理、取消機制與可讀的 TypeScript。
審查這個 React Native 功能設計，涵蓋元件邊界、效能風險、狀態所有權、行動版面配置考量與測試優先順序。
最佳實務
- 使用能清楚解決目前問題的最小模式。
- 涉及資料或 effects 時，加入載入、錯誤與清理行為。
- 在加入 memoization 或 lazy loading 前，先分析效能問題。
避免
- 不要建立混合版面配置、資料擷取與商業規則的大型元件。
- 在本機狀態與 context 尚未不足以應付前，不要將狀態移至全域 store。
- 不要在未測量實際效能成本的情況下，最佳化每一條 render path。