Skills react-observability
📦
react-observability
Content revision r1 Safe ⚙️ External commands🔑 Env variables
Improve React Observability
React failures often hide behind silent returns and weak error messages. This skill gives Claude, Codex, and Claude Code practical patterns for logs, tracing, and safer diagnostics.
Supports: Claude Codex Code(CC)
Install with my Agent
Copy this request to your Agent. It includes the canonical Skill page and manifest.
Agent request
Review the Skillstore skill "react-observability" from https://skillstore.io/skills/cjharmath-react-observability.md and its manifest at https://skillstore.io/api/skills/cjharmath-react-observability/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Your Agent should still show its plan and request any confirmation required by the security policy.
Agent-readable resources
Use these links when an AI agent, crawler, or script needs clean context instead of reading the full page.
Test it
Using "react-observability". A React checkout flow fails without useful logs.
Expected outcome:
- A list of silent branches that need warning or error logs.
- Recommended flow identifiers for checkout steps and failure points.
- Sensitive fields that should be redacted before logging or reporting.
Using "react-observability". A component catches errors but only shows a generic message.
Expected outcome:
- A clearer diagnostic message structure for developers.
- User-safe fallback guidance for the visible interface.
- Suggested production error reporting context without secrets.
Using "react-observability". A team wants a shared React logging convention.
Expected outcome:
- Recommended logging levels and when to use each level.
- A checklist for early returns, state snapshots, and error boundaries.
- Anti-patterns to avoid before merging new instrumentation.
Security Audit
Safev8 • 7/5/2026 Open versioned report
All static findings were adjudicated as false positives from Markdown formatting or TypeScript examples. I found no executable skill code, prompt injection attempt, credential access, shell execution, or malicious intent in SKILL.md.
1
Files scanned
408
Lines analyzed
0
Review items
0
False positives ignored
Risk Factors
⚙️ External commands (50)
SKILL.md:18-39 SKILL.md:39-49 SKILL.md:49-58 SKILL.md:58-59 SKILL.md:59-60 SKILL.md:60-62 SKILL.md:62-66 SKILL.md:66-68 SKILL.md:68-69 SKILL.md:69-70 SKILL.md:70-72 SKILL.md:72-89 SKILL.md:89-100 SKILL.md:100-106 SKILL.md:106-107 SKILL.md:107-108 SKILL.md:108-109 SKILL.md:109-113 SKILL.md:113-127 SKILL.md:127-132 SKILL.md:132-137 SKILL.md:137-142 SKILL.md:142-146 SKILL.md:146-154 SKILL.md:154-177 SKILL.md:177-185 SKILL.md:185-187 SKILL.md:187-189 SKILL.md:189-192 SKILL.md:192-195 SKILL.md:195-198 SKILL.md:198-201 SKILL.md:201-203 SKILL.md:203-211 SKILL.md:211-224 SKILL.md:224-227 SKILL.md:227-242 SKILL.md:242-250 SKILL.md:250-257 SKILL.md:257-269 SKILL.md:269-276 SKILL.md:276-279 SKILL.md:279-282 SKILL.md:282-290 SKILL.md:290-318 SKILL.md:318-326 SKILL.md:326-363 SKILL.md:363-391 SKILL.md:391-396 SKILL.md:396-405
🔑 Env variables (4)
No confirmed security findings were detected by the latest completed static and semantic audit. This does not prove the skill has no side effects.
Audited by: codex View Audit History →
Share & cite this report
Share the versioned assessment report, neutral badge, embed card, and citations. Skillstore reports evidence without deciding whether this Skill is safe.
Copy report link
https://skillstore.io/skills/cjharmath-react-observability/audits/8?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown badge
[](https://skillstore.io/skills/cjharmath-react-observability?utm_source=security_passport_badge)HTML badge
<a href="https://skillstore.io/skills/cjharmath-react-observability?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/cjharmath-react-observability/security.svg" alt="Skillstore security assessment" loading="lazy"></a>Embed card
<iframe src="https://skillstore.io/embed/skills/cjharmath-react-observability.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>Academic citations (APA · BibTeX · CFF)
APA citation
CJHarmath. (2026). react-observability security audit report (audit version 8) [Author version unspecified]. Skillstore. https://skillstore.io/skills/cjharmath-react-observability/audits/8BibTeX citation
@techreport{cjharmath-cjharmath-react-observability-2026,
author = {CJHarmath},
title = {react-observability security audit report (audit version 8)},
institution = {Skillstore},
year = {2026},
number = {8},
url = {https://skillstore.io/skills/cjharmath-react-observability/audits/8},
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: "react-observability security audit report (audit version 8)"
version: "unspecified"
type: report
authors:
- name: "CJHarmath"
date-released: "2026-07-05"
url: "https://skillstore.io/skills/cjharmath-react-observability/audits/8"
identifiers:
- type: other
value: "skillstore:cjharmath-react-observability:audit:8"
description: "Skillstore immutable audit report identifier"
Skillstore Score
Why this score Evidence Confidence: High 55
Architecture
85
Maintainability
87
Content
70
Community
83
Spec Compliance
What You Can Build
Add Debuggable React Flows
Use the skill to add clear logs around async flows, state changes, and early returns.
Improve Production Incident Context
Use the patterns to capture useful error details while avoiding sensitive data in reports.
Standardize Team Logging Practices
Use the checklist and examples to align React and React Native contributors on observable code.
Try These Prompts
Review Logging Basics
Use the react-observability skill to review this React code. Identify silent returns, weak error messages, and missing context logs.
Add Structured Logs
Use the react-observability skill to add structured logging to this React flow. Include log levels, context objects, and sensitive-data redaction guidance.
Design Error Handling
Use the react-observability skill to design error handling for this feature. Include assertion helpers, error boundaries, and production reporting points.
Audit Incident Observability
Use the react-observability skill to analyze this production incident path. Recommend logs, state snapshots, flow identifiers, and redaction rules.
Best Practices
- Log why code exits early, and include only the context needed to diagnose the branch.
- Redact sensitive fields before sending context to consoles or error reporting services.
- Use consistent flow identifiers so one user action can be traced across multiple steps.
Avoid
- Do not add broad state dumps to production logs without privacy review.
- Do not swallow caught errors after logging unless the behavior is intentional and documented.
- Do not leave temporary debug logging enabled without a flag or clear removal plan.
Frequently Asked Questions
Does this skill work with React Native?
Yes. The guidance applies to React web and React Native, but platform logging tools may differ.
Does it install Sentry or another service?
No. It shows integration patterns, but dependency choice and setup remain project decisions.
Can it prevent sensitive data from being logged?
It provides redaction patterns and review prompts. Teams still need project-specific privacy rules.
Is this only for production incidents?
No. It also helps during feature development, debugging, and code review.
What files should I provide when using it?
Provide the component, hook, flow code, logger utilities, and any error boundary or reporting code.
Can it replace observability infrastructure?
No. It improves application instrumentation patterns, but it does not provide storage, dashboards, or alerts.