By funsaized
React, Next.js, and React Native best practices with web design guidelines.
React composition patterns that scale. Use when refactoring components with boolean prop proliferation, building flexible component libraries, or designing reusable APIs. Triggers on tasks involving compound components, render props, context providers, or component architecture. Includes React 19 API changes.
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.
React Native and Expo best practices for building performant mobile apps. Use when building React Native components, optimizing list performance, implementing animations, or working with native modules. Triggers on tasks involving React Native, Expo, mobile performance, or native platform APIs.
Guide for implementing smooth, native-feeling animations using React's View Transition API (`<ViewTransition>` component, `addTransitionType`, and CSS view transition pseudo-elements). Use this skill whenever the user wants to add page transitions, animate route changes, create shared element animations, animate enter/exit of components, animate list reorder, implement directional (forward/back) navigation animations, or integrate view transitions in Next.js. Also use when the user mentions view transitions, `startViewTransition`, `ViewTransition`, transition types, or asks about animating between UI states in React without third-party animation libraries.
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
My Claude Code and OpenAI Codex setup with skills, commands, hooks, subagents, and MCP servers.
"They make wrong assumptions on your behalf and just run along with them without checking. They don't manage their confusion, they don't seek clarifications, they don't surface inconsistencies, they don't present tradeoffs. They really like to overcomplicate code and APIs, they bloat abstractions, they don't clean up dead code after themselves." -- Andrej Karpathy
This repo's guidelines are structured to fix exactly these pitfalls.
Installation • Plugins • Configuration
Plugins add skills, commands, and automations to your AI coding tool. Install only what you need from the plugin list below.
Prerequisites: See INSTALL.md for setup requirements.
# Add marketplace (one time)
/plugin marketplace add funsaized/claude-and-codex-settings
# Install any plugin by name
/plugin install <plugin-name>@claude-and-codex-settings
Codex installs plugins from a local marketplace rather than a direct shell install command.
.agents/plugins/marketplace.json./plugins.Claude & Codex Settings and install the plugins you want.This README only covers installing this marketplace. For generic Codex marketplace examples and maintainer docs, see CLAUDE.md.
Create the symlink for cross-tool compatibility:
ln -sfn CLAUDE.md AGENTS.md
| Claude Code | Codex CLI |
|---|---|
/plugin install intelligent-compact@claude-and-codex-settings | Open /plugins -> Claude & Codex Settings -> install intelligent-compact |
When Claude Code auto-summarizes a long session, the default summary routinely drops the highest-signal facts. This plugin tells the summarizer to keep them:
Runs on every /compact (manual) and every auto compaction. Claude Code only; Codex doesn't yet expose a comparable summary hook.
| Claude Code | Codex CLI |
|---|---|
/plugin install claude-telemetry-hooks@claude-and-codex-settings | n/a |
Adds the two missing pieces Claude Code's telemetry needs to power a usage dashboard:
Per-device data is already in Claude Code's built-in OpenTelemetry stream.
| Claude Code | Codex CLI |
|---|---|
/plugin install python-skills@claude-and-codex-settings | Open /plugins -> Claude & Codex Settings -> install python-skills |
npx claudepluginhub funsaized/claude-and-codex-settings --plugin react-skillsStop Claude Code from forgetting file paths, root causes, and open questions when it auto-summarizes long sessions.
Track per-device Claude Code usage, rejection reasons, and per-session stats from a single dashboard.
Python best practices grounded in PEP 8, PEP 20 (Zen of Python), Google Python Style Guide, and Effective Python by Brett Slatkin.
Frontend design skills from Anthropic and OpenAI for building visually strong landing pages, websites, and apps.
Browser automation CLI for AI agents. Navigate pages, fill forms, click buttons, take screenshots, and test web apps.
Ultra-compressed communication mode. Cuts ~75% of tokens while keeping full technical accuracy by speaking like a caveman.
Frontend design skill for UI/UX implementation
Comprehensive UI/UX design plugin for mobile (iOS, Android, React Native) and web applications with design systems, accessibility, and modern patterns
Memory compression system for Claude Code - persist context across sessions
Marketing skills for AI agents — conversion optimization, copywriting, SEO, paid ads, ad creative, and growth
Standalone image generation plugin using Nano Banana MCP server. Generates and edits images, icons, diagrams, patterns, and visual assets via Gemini image models. No Gemini CLI dependency required.