用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt;运行前请先检查来源。
npx skills add https://github.com/salmandev/arabic-skills-library --skill arabic-react-development命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地?可下载 SkillsMP 当前能够提供的文件。
正在显示 SKILL.md
基于 SOC 职业分类
| name | arabic-react-development |
| name_ar | تطوير رياكت |
| description | Master React development in Arabic |
| description_ar | إتقان تطوير تطبيقات رياكت بالعربية |
| category | web-development |
| language | ar |
| dialect | msa |
| rtl | true |
| platform_all | true |
| version | 1.0.0 |
| author | salman-shaikh |
إتقان أساسيات تطوير تطبيقات React.
// Functional Component
function Welcome({ name }) {
return <h1>مرحباً {name}!</h1>;
}
// Arrow Function
const Welcome = ({ name }) => (
<h1>مرحباً {name}!</h1>
);
import { useState } from 'react';
function Counter() {
const [count, setCount] = useState(0);
return (
<div>
<p>العدد: {count}</p>
<button onClick={() => setCount(count + 1)}>
زيادة
</button>
</div>
);
}
| Hook | الاستخدام |
|---|---|
| useState | إدارة حالة |
| useEffect | تأثيرات جانبية |
| useContext |
| سياق عالمي |
| useReducer | حالة معقدة |
| الأداة | الوصف |
|---|---|
| Create React App | بدء مشروع |
| Next.js | SSR & SSG |
| React Router | توجيه |
| Redux | إدارة حالة |
✅ Components صغيرة ✅ Props واضحة ✅ Keys في Lists ✅ تحسين Performance
❌ لا تبالغ في State ❌ لا تهمل Keys ❌ لا تبالغ في Renders
عربي: "رياكت", "React", "JavaScript", "تطوير ويب" English: "React arabic", "React.js", "JavaScript", "web development", "Next.js"