├── LICENSE ├── assets └── context-engineering.png ├── SUMMARY.md ├── chapters ├── 15-resources.md ├── 13-additional-tips.md ├── 01-intro.md ├── 07-context-engineering-vs-prompt-engineering.md ├── 04-tools.md ├── 16-future-of-programming.md ├── 11-cursor-mcp.md ├── 05-breaking-down.md ├── 03-mindset.md ├── 02-responsible-use-of-ai.md ├── PRD-example.md ├── 08-context-engineering.md ├── task-subtask-example.md ├── 14-final-notes.md ├── 10-cursor-rules.md ├── 06-LLMs.md ├── 09-prompt-engineering.md └── 12-security.md └── README.md /LICENSE: -------------------------------------------------------------------------------- 1 | استفاده از مطالب برای آموزش با ذکر منبع بلا مانع است. 2 | 3 | هرگونه استفاده از مطالب برای سودجویی و فروش پیگرد قانونی دارد. 4 | -------------------------------------------------------------------------------- /assets/context-engineering.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaharMirkamrani/ai-powered-engineer-mini-course/HEAD/assets/context-engineering.png -------------------------------------------------------------------------------- /SUMMARY.md: -------------------------------------------------------------------------------- 1 | 2 | # بخش ها 3 | 4 | * [بخش ۱: مقدمه](chapters/01-intro.md) 5 | * [بخش ۲: استفاده مسئولانه از AI](chapters/02-responsible-use-of-ai.md) 6 | * [بخش ۳: ذهنیت](chapters/03-mindset.md) 7 | * [بخش ۴: ابزار ها](chapters/04-tools.md) 8 | * [بخش ۵: مرحله بندی](chapters/05-breaking-down.md) 9 | * [بخش ۶: LLM ها](chapters/06-LLMs.md) 10 | * [بخش ۷: context engineering vs prompt engineering](chapters/07-context-engineering-vs-prompt-engineering.md) 11 | * [بخش ۸: context engineering](chapters/08-context-engineering.md) 12 | * [بخش ۹: prompt engineering](chapters/09-prompt-engineering.md) 13 | * [بخش ۱۰: قوانین کرسر](chapters/10-cursor-rules.md) 14 | * [بخش ۱۱: cursor MCP](chapters/11-cursor-mcp.md) 15 | * [بخش ۱۲: امنیت](chapters/12-security.md) 16 | * [بخش ۱۳: نکات تکمیلی](chapters/13-additional-tips.md) 17 | * [بخش ۱۴: جمع بندی](chapters/14-final-notes.md) 18 | * [بخش ۱۵: منابع](chapters/15-resources.md) 19 | * [بخش ۱۶: آینده برنامه نویسی](chapters/16-future-of-programming.md) 20 | 21 | * [License](LICENSE) 22 | -------------------------------------------------------------------------------- /chapters/15-resources.md: -------------------------------------------------------------------------------- 1 | # منابع 2 | 3 | 4 | https://github.com/sanjeed5/awesome-cursor-rules-mdc 5 | https://gist.githubusercontent.com/mattppal/5c01ef4447e94515a03314db1ef2403e/raw/013631d95252fb058c5b5050cbed36aee61d0128/security-checklist.md 6 | https://tomaszs2.medium.com/i-wrote-a-459-page-book-on-vibe-coding-its-not-what-you-think-800bce3d98f2 7 | https://medium.com/@vitaliygosteev/my-year-long-journey-with-ai-in-software-development-and-reflections-on-the-role-of-ai-devtools-366da7b7efc4 8 | https://johndturner.com/downloads/JohnDTurner.com-Perfect-Prompt-Formula.pdf 9 | https://simonwillison.net/2025/Mar/19/vibe-coding/ 10 | https://simonwillison.net/2025/May/1/not-vibe-coding/ 11 | https://www.youtube.com/watch?v=iLCDSY2XX7E 12 | https://blog.langchain.com/the-rise-of-context-engineering/ 13 | https://analyticsindiamag.com/ai-features/context-engineering-is-the-new-vibe-coding/ 14 | https://github.com/coleam00/context-engineering-intro 15 | https://www.youtube.com/watch?v=0iGEpx8IeM0 16 | 17 | Vibe Coding Bible - Tom Smykowski (Book) 18 | 19 | --- 20 | 21 | *بخش ۱۶ ->[أینده برنامه نویسی](16-future-of-programming.md)* 22 | -------------------------------------------------------------------------------- /chapters/13-additional-tips.md: -------------------------------------------------------------------------------- 1 | # نکات تکمیلی 2 | 3 |
4 | - سر نام گذاری فایل ها و متغیر ها با coding agent اتون به توافق برسید ترجیحا همون اوایل استارت پروژه. براش تعریف کنید که چجوری باشه ([[Cursor Rules]]). 5 |
6 | - موقع پرامپت دادن ادب رو بزارید کنار چون توکن بیشتری مصرف میشه :)) 7 | مثلا از please و thank you استفاده نکنید! 8 |
9 | - از کلماتی مثل avoid, only و focus on استفاده کنید. هر چی کلماتتون قوی تر باشه باعث میشه جدی تر بگیره. 10 |
11 | - فایل هاتون رو همیشه کوچکتر از ۳۰۰ خط کد نگه دارید. 12 |
13 | - هر کدی که زد، بررسی کنید که آیا reusable هست یا نه. اگه نیست، بگید refactorش کنه. 14 |
15 | - برای محیط production حتما لاگ هایی که میندازه رو پاک کنید. 16 |
17 | - بعضی وقت ها ai agent اتون پکیج های اضافی نصب میکنه, حتما بررسیشون کنید و اونایی که لازم نیستن رو uninstall کنید. 18 |
19 | - بعضی وقت ها هم پیش میاد که بدون اینکه ازش بخوایم, یه فایل یا فانکشن مهم رو دستکاری میکنه. برای جلوگیری از این کار میتونیم اون فایل مهم رو جزو cursorignore بگذاریم و فقط به صورت black box بهش توضیح بدیم که این فانکشن چه کاری رو انجام میده. 20 |
21 | 22 | --- 23 | 24 | *بخش ۱۴ ->[جمع بندی](14-final-notes.md)* 25 | -------------------------------------------------------------------------------- /chapters/01-intro.md: -------------------------------------------------------------------------------- 1 | # مقدمه 2 | 3 | خیلی خوش اومدین به کتابچه AI-powered engineer ! 4 | 5 | من سحرم, یه برنامه نویس که بیشتر تمرکزش روی فرانت اند بوده. 6 | 7 | داستان از این قراره که من برای خودم یه چالشی رو گذاشتم و پروژه ی خودم رو استارت زدم و هدفم براش این بود که مردم ازش استفاده کنن و بگن این چه چیز باحالیه :)) 8 | 9 | شروع کردم به توسعه ی [کادوفایند](https://kadofind.com) 10 | 11 | از طراحی UI گرفته تا فرانت و بک و دواپس, همه رو خودم میخواستم انجام بدم. 12 | اون اوایل داشتم از ChatGPT کمک میگرفتم توی سریعتر کردن برنامه نویسیش. ولی بعدش اومدم و cursor رو امتحان کردم و باورم نمیشد که چقدر داره کارو جلو میبره. سرعتم بیشتر از ۵ برابر شده بود باهاش. 13 | 14 | کادوفایند الان به جای خوبی رسیده بعد از دو ماه وقت گذاشتن و سعی و خطا. البته اگر این کورس رو دیده بودم کاراش خیلی سریعتر جلو میرفت. 15 | 16 | بعد از کادوفایند نشستم خیلی جدی راجع به اینکه چجوری از Ai استفاده کنیم تو دولوپمنت تحقیق کردم و نتیجه اش شد این کتابچه. 17 | 18 | همه ی اینا رو گفتم که بگم من یه برنامه نویس معمولی ام ولی بعد از استفاده از AI الان انگار یه دولوپر جونیور نابغه نشسته کنارم که خسته نمیشه, نه نمیگه و هر تسکی بهش بدم انجام میده هر زمان که بخوام و هزینه ی ناچیزی هم داره :)) 19 | 20 | بریم؟ 21 | 22 | --- 23 | 24 | *بخش ۲ -> [استفاده مسئولانه از AI](./02-responsible-use-of-ai.md)* 25 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # AI-Powered Engineer Mini-Course (with Cursor) 2 | 3 | ### مقدمه 4 | **این کتابچه حاصل صد ها ساعت تجربه خودم از استفاده کردن از AI در روند توسعه پروژه ها و تحقیق هست.** 5 | 6 | اینجا بهتون توضیح میدم که چجوری بهترین بهره وری رو از AI تو برنامه نویسی داشته باشید و سرعت توسعه رو چند برابر کنید :)) 7 | ### بخش ها 8 | 9 | * [بخش ۱: مقدمه](chapters/01-intro.md) 10 | * [بخش ۲: استفاده مسئولانه از AI](chapters/02-responsible-use-of-ai.md) 11 | * [بخش ۳: ذهنیت](chapters/03-mindset.md) 12 | * [بخش ۴: ابزار ها](chapters/04-tools.md) 13 | * [بخش ۵: مرحله بندی](chapters/05-breaking-down.md) 14 | * [بخش ۶: LLM ها](chapters/06-LLMs.md) 15 | * [بخش ۷: context engineering vs prompt engineering](chapters/07-context-engineering-vs-prompt-engineering.md) 16 | * [بخش ۸: context engineering](chapters/08-context-engineering.md) 17 | * [بخش ۹: prompt engineering](chapters/09-prompt-engineering.md) 18 | * [بخش ۱۰: قوانین کرسر](chapters/10-cursor-rules.md) 19 | * [بخش ۱۱: cursor MCP](chapters/11-cursor-mcp.md) 20 | * [بخش ۱۲: امنیت](chapters/12-security.md) 21 | * [بخش ۱۳: نکات تکمیلی](chapters/13-additional-tips.md) 22 | * [بخش ۱۴: جمع بندی](chapters/14-final-notes.md) 23 | * [بخش ۱۵: منابع](chapters/15-resources.md) 24 | * [بخش ۱۶: آینده برنامه نویسی](chapters/16-future-of-programming.md) 25 | 26 | 27 | --- 28 | 29 | *موفق باشید! 🚀* 30 | -------------------------------------------------------------------------------- /chapters/07-context-engineering-vs-prompt-engineering.md: -------------------------------------------------------------------------------- 1 | # Context Enginnering VS Prompt Engineering 2 | 3 | 4 | ### Prompt Engineering چیه؟ 5 | 6 | و Prompt engineering یعنی یاد بگیری **چجوری با LLM حرف بزنید** تا بهترین جواب رو بده. 7 | 8 | **مثال ساده:** 9 | ❌ «این کد رو درست کن» 10 | ✅ «کدی که پایین هست توی خط 14 ارور `TypeError` می‌ده. اصلاحش کن و کامنت بگذار چرا اینطوری شد.» 11 | 12 | هر چی دقیق‌تر، مرحله‌ای‌تر، و شفاف‌تر بنویسی، خروجی تمیزتر. 13 | 14 | ### Context Engineering چیه؟ 15 | 16 | پرامپت خوب لازمه، ولی کافی نیست. 17 | اگه LLM **زمینه کافی نداشته باشه**، جوابش هم مثل کسیه که وسط بحث اومده و فقط جمله آخر رو شنیده. 18 | 19 | Context engineering یعنی: 20 | 21 |
22 | - بدونی چی باید به مدل بدی 23 |
24 | - چطور بدی 25 |
26 | - و چه ترتیبی برای اطلاعات مناسب‌تره 27 |
28 | 29 |
30 | از من میشنوید, اکثر کار با AI, هندل کردن و منیج کردن context هست. 31 | 32 | 33 | ### چطوری این دو تا رو با هم ترکیب کنیم؟ 34 | 35 | - **Prompt**: مشخص کن چی می‌خوای و چجوری می‌خوای. 36 | 37 | - **Context**: به مدل زمینه لازم رو بده که بتونه درست تصمیم بگیره. 38 | 39 | 40 | یه LLM قوی با پرامپت مبهم و زمینه ناقص -> هذیون می‌گه 41 | یه LLM متوسط با context خوب و پرامپت شفاف -> معمولاً جواب معقولی می‌ده 42 | 43 | 44 | --- 45 | 46 | *بخش ۸ ->[مهندسی کانتکست](08-context-engineering.md)* 47 | 48 | -------------------------------------------------------------------------------- /chapters/04-tools.md: -------------------------------------------------------------------------------- 1 | # ابزار ها 2 | 3 | ابزار های زیادی الان اومدن تحت عنوان AI coding agent 4 | ابزار هایی مثل: 5 | Copilot agent mode, Windsurf, ChatGPT, Claude, cursor, codex, opencode, ... 6 | 7 | ابزار محبوب من در حال حاضر cursor هست. 8 | کرسر به چند دلیل خوبه: 9 |
10 | - اجازه میده مدل های مختلف رو انتخاب کنی 11 |
12 | - اجازه میده به چک پوینت های قبلی برگردی (شاید کرسر تغییری داده که نمیخواستی) 13 |
14 | - میتونیم توش قوانین تعریف کنیم 15 |
16 | - خرید اکانتش راحت و ارزونه از ایران 17 |
18 |
19 | کرسر البته بهترین نیست, الان Claude code پرفورمنس بهتری داره از کرسر به دلیل اینکه گنجایش context window بیشتری داره. 20 | ولی مشکلش اینه که usage based هست (یعنی به ازای هر جوابی که میده از اکانتتون پول کم میکنه) 21 | و در کل گرون تر از کرسر درمیاد خیلی, که برای ما ایرانی ها به صرفه نیست. 22 | 23 | 24 | برای یاد گرفتن کار با Cursor این [ویدیو](https://youtu.be/cE84Q5IRR6U?si=ZJTTmfeelISQGWx0) رو ببینید 25 | 26 | من چند باری اکانت کرسر رو از سایت [پارس پریمیوم](https://parspremium.ir/) گرفتم و راضی بودم (Not Sponsored) 27 | ### ابزار بیشتر ≠ قدرت بیشتر 28 | 29 | این‌که از ۴ تا مدل مختلف همزمان استفاده کنیم یا ۳ تا agent باز باشه، لزوماً پروداکتیو ترمون نمیکنه. 30 | بهترین کار اینه که به یه ابزار مسلط باشیم و همه قسمت هاش رو بشناسیم. 31 | 32 | --- 33 | 34 | *بخش ۵ -> [مرحله بندی](./05-breaking-down.md)* 35 | -------------------------------------------------------------------------------- /chapters/16-future-of-programming.md: -------------------------------------------------------------------------------- 1 | # آینده برنامه نویسی 2 | 3 | هوش مصنوعی حالا حالا ها قرار نیست جای ما برنامه نویس ها رو بگیره چون: 4 |
5 | - پروژه فقط یه سری تسک پراکنده نیست. نیاز به درک کلی از سیستم، به تصمیم‌گیری و trade-off فکر کردن داره. 6 |
7 | - کد خوب نوشتن فقط سینتکس نیست؛ ساختاردهی، ارتباط بخش‌های مختلف، طراحی درست دیتابیس، پیاده‌سازی معماری، همه اینا هنوز به آدم نیاز دارن. 8 |
9 | - فقط ۲۰٪ وقت برنامه نویس ها به کدنویسی میگذره, بقیه اش صحبت کردن و جلسه گذاشتن با تیم, استراتژی چیدن و برنامه ریزی هست. 10 |
11 | - شرکت ها نیاز دارن به افرادی که مسئولیت بپذیرن و پاسخگو باشن, AI نمیتونه این کار رو بکنه. 12 |
13 | - هوش مصنوعی مشکلاتی زیادی داره هنوز, مثل hallucination, مشکل در scale کردن, مشکل های امنیتی کد, tech debt, همه این ها رو یه برنامه نویس با تجربه میتونه مدیریت کنه. 14 |
15 |
16 | هوش مصنوعی جامونو نمیگیره ولی مدل کار کردنمون رو عوض میکنه. 17 | 18 | یه برنامه نویس خوب با AI قوی تر هم میشه. 19 | 20 |
21 | 22 | من تو یوتوب و لینکدین خیلی میخونم راجع به اینکه AI چجوری قراره فیلد برنامه نویسی رو تغییر بده و برداشت من در کل اینه: 23 | 24 | فرض کنید شما کارفرما هستین و ایده ی پروژه ای رو دارید که هنوز پیاده سازی نشده. بودجتون هم ۲۰۰ میلیونه. 25 | دو تا برنامه نویس پیدا کردین: یکیشون ۶ ماهه پروژه رو تحویل میده, اون یکی ۲ ماهه تحویل میده. 26 | 27 | با فرض اینکه کیفیت کارشون یکیه, کدوم رو انتخاب میکنید؟ 28 | 29 | کارفرما حاضره حتی پول بیشتری بده که پروژه سریعتر آماده شه. ارزش برنامه نویسی که سریع تر کار رو تحویل بده بیشتر میشه. 30 | 31 | برنامه نویسی که از AI برای سریع تر کردن توسعه پروژه استفاده نمیکنه و گارد داره نسبت بهش, توسط کسی که از AI استفاده میکنه جایگزین میشه. 32 | 33 | پس اساسا این سوال, سوال اشتباهیه که آیا هوش مصنوعی قرار جای منو بگیره. 34 | سوال بهتر اینه: اگر من خودم رو آپدیت نکنم و از AI استفاده نکنم, ممکنه یه برنامه نویس دیگه جامو بگیره؟ 35 | 36 | 37 | 38 | 39 | -------------------------------------------------------------------------------- /chapters/11-cursor-mcp.md: -------------------------------------------------------------------------------- 1 | # Cursor MCP 2 | 3 | ### MCP (Model Context Protocol) چیه؟ 4 | 5 | وMCP یه پروتکل باز هست (شبیه به USB برای AI) که به Cursor اجازه می‌ده به ابزارها و منابع خارجی وصل بشه: بانک‌داده‌ها، مستندات، سیستم‌های داخلی، GitHub، Figma و حتی تست‌ها و مانیتورینگ. این یعنی دیگه لازم نیست همیشه context رو با copy/paste بهش بدی, خودش مستقیم به سیستم‌ها دسترسی داره. 6 | 7 | 8 | ### چرا MCP برای برنامه نویس ها مفیده؟ 9 |
10 | - عمق context بدون زحمت: 11 |
12 | کرسر می‌تونه مستندات Notion یا Google Drive یا DB رو بخونه. 13 |
14 | - ابزار یکپارچه: 15 |
16 | می‌تونید Cursor رو وصل کنید به GitHub، Figma, Chrome browser، Sentry یا Postgres و مستقیم توی ادیتور براش دستورات بدید. 17 |
18 | 19 | 20 | ### چطوری MCP رو فعال و استفاده کنیم؟ 21 |
22 | ۱. اضافه کردن server ها رو: 23 |
24 | از توی `Cursor Settings → Features → MCP` می‌تونین MCP server اضافه کنید 25 |
26 | ۲. فایل کانفیگ MCP: 27 |
28 | توی پروژه‌تون `.cursor/mcp.json` بسازید، یا global config داشته باشید. بعد برای هر سرور، `command`, `args`, `env` تنظیم کنین. 29 |
30 | ۳. فعال‌سازی در chat: 31 |
32 | وقتی یه ابزار MCP در دسترس باشه، Composer Agent اون رو نشون می‌ده و برای استفاده، ازتون اجازه می‌پرسه. 33 |
34 |
35 | 36 | ### مثال عملی با MCP 37 | 38 | برای خوندن مستندات از notion: 39 |
40 | ۱. Notion MCP server نصب می‌کنی و add to cursor 41 |
42 | ۲. توی چت prompt می‌دی: 43 | “Using Notion MCP, fetch the API spec page under 'Project Spec'” 44 |
45 | ۳. Cursor خودش درخواست MCP server رو می‌فرسته، مدل مستندات رو می‌خونه، و پاسخ می‌ده. 46 |
47 | 48 | این یعنی دیگه نیازی نیست فایل‌ها رو دستی وارد کنی. 49 | 50 | یا مثلا میتونی از MCP فیگما استفاده کنی و توی چت کرسر بنویسی که ui رو از فیگما ببینه و کدش رو پیاده سازی کنه. 51 | 52 | --- 53 | 54 | *بخش ۱۲ ->[امنیت](12-security.md)* 55 | -------------------------------------------------------------------------------- /chapters/05-breaking-down.md: -------------------------------------------------------------------------------- 1 | # مرحله بندی 2 | 3 | برنامه نویس ها معمولا این شکلی پروژه رو استارت میزنن و جلو میبرن: 4 | 5 | ۱. چک کردن ui ux 6 |
7 | ۲. صحبت های رفت و برگشتی با ui designer و بقیه برنامه نویس ها 8 |
9 | **۳. تسک بندی** 10 |
11 | ۵. دست به کد شدن, درست کردن ساختار کلی پروژه و دونه دونه انجام دادن تسک ها 12 |
13 | ۶. تست, دیباگ و ریفکتور 14 |
15 | ۷. داکیومنت نوشتن 16 | 17 | این بخش راجع به تسک بندی و خرد کردن تسک هاست. 18 | 19 | **تسک بندی مثل تیز کردن تبر, قبل از قطع کردن درخت میمونه** 20 | 21 | ### درست کردن PRD 22 | 23 | PRD = Product Requirements Document 24 | یعنی یه داکیومنت که توش توضیح داده شده: 25 | 26 |
27 | - این محصول قراره چه مشکلی رو حل کنه؟ 28 |
29 | - کاربر دقیقاً قراره باهاش چی‌کار کنه؟ 30 |
31 | - چه فیچرهایی باید داشته باشه؟ 32 |
33 | - از همه مهمتر, با چه تکنولوژی هایی میخوایم کار کنیم و tech stack امون چیه؟ 34 |
35 |
36 | در واقع PRD یه جور **ترجمه بیزنسی نیاز کاربر به زبان محصول** ـه. 37 | 38 | میتونید با chatgpt یا claude این رو جنریت کنید. 39 | [مثال PRD](PRD-example.md) 40 | 41 | ### مرحله بعد: تسک و ساب تسک 42 | 43 | الان باید از PRD تسک و ساب تسک دربیاریم. این رو هم میتونیم با کمک chatgpt یا claude انجام بدیم. 44 | بهش فایل PRD رو میدیم و ازش میخوایم تسک و ساب تسک ازش دربیاره. 45 | [مثال task و subtask](task-subtask-example.md) 46 | 47 | اگر تسکی هنوز خیلی بزرگ بود دوباره بشکونیدش و قسمت بندی کنید. 48 | در واقع یه تسک یا ساب تسک نباید زیادی بزرگ یا کوچک باشه. 49 | 50 | ### نکته: 51 | 52 | ساختار فایل های PRD و تسک و ساب تسک ها باید یه ساختار شفاف و هدفمند باشه. برای بهتر نوشتنش به بخش [[Prompt Engineering]] مراجعه کنید. 53 | 54 | ### ابزار های غیر رایگان منیج کردن تسک ها 55 | 56 | یکی از ابزار هایی که الان معروف شده [Taskmaster](https://www.task-master.dev/) هست. کافیه شما PRD رو بهش بدید و اون میاد دونه دونه با استفاده از ای پی آی claude اتون تسک ها رو توی فایل های مختلف میده به cursor. 57 | برای استفاده کردن ازش باید اکانت claude اتون رو شارژ کنید. 58 | 59 | *بخش ۶ ->[LLM ها](06-LLMs.md)* 60 | -------------------------------------------------------------------------------- /chapters/03-mindset.md: -------------------------------------------------------------------------------- 1 | # ذهنیت 2 | 3 | وقتی دارید از AI استفاده میکنید نقش شما senior هست توی پروژه و نقش AI assistant اتون جونیور. 4 | برنامه نویس های جونیور معمولا تسک های کوچک رو تو پروژه انجام میدن و مسئولیت های حساس و خیلی مهم بهشون سپرده نمیشه, پس لازمه که تسک ها رو خرد کنید براش و دقیق توضیح بدید بهش که چی میخواین ازش. 5 | 6 | هوش مصنوعی فرقش با یه دولوپر جونیور اینه که نابغه است و همه زبونا رو بلده. توی تسکای کوچک و جزيیات عالی عمل میکنه. 7 | 8 | همزمان خنگ هم هست! چرا؟ 9 | 10 |
11 | - چون اگه یهویی کل پروژه رو بزاری جلوش نمیتونه بفهمه چی به چیه (Context Limit) 12 |
13 | - دید از بالا (big picture) و کلی رو نداره به کدبیس 14 |
15 | - درکی از آرکیتکچر پروژه نداره (تا وقتی بهش بگی) 16 |
17 | - نمیدونه این محصول داره چه مشکل بزرگتری رو حل میکنه 18 |
19 | - نمیتونه قسمت های مختلف پروژه حتی کامپوننت ها رو به هم وصل کنه و کلیت رو درک کنه 20 |
21 |
22 | تو چی خوبه؟ 23 | 24 |
25 | - جنریت کردن کد از یه پترن مشخص 26 |
27 | - تسک های ساده و تکراری 28 |
29 |
30 | دونستن این که محدودیت هاش کجاست و کجا عالی عمل میکنه باعث میشه انتظار بیجا نداشته باشیم ازش و به جاش تسک هایی رو بهش بسپاریم که میدونیم قراره درست هندل کنه و از پسش برمیاد. 31 | 32 | ### تغییر ذهنیت برنامه نویسی با AI 33 | 34 | برای استفاده کردن از AI باید: 35 | به جای فکر کردن به سینتکس و کد, به طراحی prompt امون با context درست فکر کنیم (توی بخش های بعدی توضیح میدم) 36 | البته این به این معنی نیست که کدمون best practice ها رو رعایت نکنه. 37 | 38 | یادتون نره که تو هر سطحی که هستید به عنوان برنامه نویس, وقتی با AI صحبت میکنید و ازش میخواین یه تسکی رو انجام بده شما باید نقشتون سنیور پروژه باشه و اون جونیوره. 39 | 40 | یه دولوپر سنیور تسلط کامل داره به پروژه, 41 | ممکنه خودش حتی کد نزنه تو پروژه و تسک به بقیه برنامه نویس ها بده که انجام بدن, 42 | کلیت (big picture) پروژه رو میدونه, 43 | راجع به آرکیتکچر و ساختار تصمیم میگیره و 44 | کد بقیه برنامه نویس ها روی پروژه رو ریویو میکنه و اگر تغییری لازم بود بهشون میگه که انجام بدن. 45 | مسئولیت پروژه رو دوشش هست و اگر مشکلی باشه, اون پاسخگو هست. نه اون برنامه نویس جونیور. 46 | 47 | --- 48 | 49 | *بخش ۴ -> [ابزار ها](./04-tools.md)* 50 | -------------------------------------------------------------------------------- /chapters/02-responsible-use-of-ai.md: -------------------------------------------------------------------------------- 1 | # استفاده مسئولانه از AI 2 | ### تفاوت Vibe Coding و استفاده هوشمندانه و مسئولانه از AI چیه؟ 3 | 4 | وایب کدینگ و استفاده مسئولانه از هوش مصنوعی دو تا مفهوم خیلی متفاوتن! 5 | در واقع این دو تا در انتهای یک طیف هستن. 6 | 7 | **وایب کدینگ چیه؟** 8 | 9 | وایب کدینگ یعنی وقتی داری فقط prompt میدی به یه AI agent ای مثل cursor و خودت وارد کد زدن نمیشی و حتی به ندرت کد رو نگاه میکنی. 10 | اتفاقی که میافته اینه که کدبیس وقتی بزرگ تر میشه همه چیز رو گم میکنی و تسلط نداری دیگه بهش. باگ ها شروع میکنن خودشون رو نشون دادن و کد کثیفه! سرعت توسعه دادن به شدت کند میشه همین که کد بزرگ و بزرگ تر میشه. 11 | 12 | **استفاده ی مسئولانه از AI چه شکلیه؟** 13 | معماری رو خودت طراحی میکنی, روی استراکچر پروژه تسلط کامل داری, تسک ها رو ریز ریز میکنی و دقیق به AI agent محبوبت توضیح میدی که باید چیکار کنه, بعدش هم حتما کد های تولید شده باید review بشن. 14 | این مدل استفاده از AI نه تنها هیچ اشکالی نداره, بلکه برای سرعت بیشتر توسعه لازمه. 15 | 16 | کجا ها vibe code کنیم؟ 17 | اگر سایت شخصی خودتون رو میخواین درست کنید (پرتفولیو) vibe code کنید. 18 | ولی اگر قصدتون استارت زدن پروژه به نسبت بزرگی هست که دیگران قراره ازش استفاده کنن نباید vibe code کنید. به دلایلی که بالا گفتم این کار خیلی خطرناکه و لازمه که برنامه نویس باشید و کد جنریت شده توسط AI رو ریویو و دیباگ کنید. 19 | 20 | ### استفاده از AI خطرناکه؟ 21 | 22 | دغدغه ی اصلی برنامه نویس های با تجربه اینه که استفاده از AI توی کد زدن باعث میشه technical debt عجیب غریب و باگ های ازون عجیب تر به وجود بیاد. یه مشکل دیگه هم امنیت کد هاست. 23 | 24 | همه ی این ها دغدغه های درست و به جایی هستن. اما آیا اینا باعث میشه ما کلا استفاده از AI coding agent ها رو کنسل کنیم و اونو چیز بدی بدونیم؟ 25 | 26 | چرا به جای این کار نریم سراغ حل کردن این مشکل ها؟ 27 | مشکل های کد جنریت شده از AI که بالاتر گفتم, اکثرشون به خاطر این به وجود میان که ما لزوما کار کردن باهاش رو بلد نیستیم. 28 | 29 | ### نکته مهم 30 | 31 | جا داره دوباره بگم استفاده ی کورکورانه از AI خطرناکه, ولی استفاده ی هوشمندانه و با بررسی, اتفاقا سرعتمون رو هم توی کد زدن میبره بالا و بهره وری مون رو زیاد میکنه. 32 | 33 | توی بخش های بعدی کامل توضیح میدم راجع به این مسائل. 34 | 35 | --- 36 | 37 | *بخش ۳ -> [ذهنیت](./03-mindset.md)* 38 | -------------------------------------------------------------------------------- /chapters/PRD-example.md: -------------------------------------------------------------------------------- 1 | ## 🧾 PRD Example – **AI-Powered Podcast Summarizer** 2 | 3 | ### 🔍 Overview 4 | 5 | We're building a web app that allows users to paste a link to a podcast episode and get a smart, human-like summary of it in less than a minute. 6 | 7 | --- 8 | 9 | ### 🎯 Goal 10 | 11 | Help users quickly understand what a podcast is about without listening to the whole thing. 12 | Target users are busy knowledge workers, researchers, and content creators. 13 | 14 | --- 15 | 16 | ### 🧩 Tech Stack (important) 17 | 18 | - **Frontend**: Next.js + Tailwind 19 | 20 | - **Backend**: Node.js (or Python if Whisper is used) 21 | 22 | - **AI**: Whisper (transcription), GPT-4o or Claude (summarization) 23 | 24 | - **Hosting**: Vercel for frontend, VPS for Whisper 25 | 26 | --- 27 | 28 | ### 👥 Target Users 29 | 30 | - Professionals who consume podcasts for learning 31 | 32 | - Students & researchers doing topic exploration 33 | 34 | - Content creators who want quick takeaways 35 | 36 | --- 37 | 38 | ### 💡 Core Features 39 | 40 | |Feature|Description| 41 | |---|---| 42 | |🎧 Audio Transcription|Automatically transcribe podcast episodes (via Whisper or another STT model).| 43 | |✍️ Smart Summarization|Use an LLM (e.g. GPT-4o or Claude) to create a concise, readable summary of the episode.| 44 | |🧵 Timestamps & Topics|Break down content into timestamped sections with titles.| 45 | |📤 Export & Share|Let users copy/share the summary or export to PDF/Markdown.| 46 | |💾 Save Summaries|(Optional MVP+) User can save past summaries in their dashboard.| 47 | 48 | --- 49 | 50 | ### 📱 User Flow (Simplified) 51 | 52 | 1. User pastes podcast URL → clicks "Summarize" 53 | 54 | 2. App transcribes audio 55 | 56 | 3. Summary and timestamped notes appear 57 | 58 | 4. User can copy/export/save 59 | 60 | 61 | --- 62 | 63 | ### ⚠️ Constraints 64 | 65 | - Summary must be generated in under 1 minute (UX requirement) 66 | 67 | - File size limits for uploaded audio (if not using a URL) 68 | 69 | - Language: MVP supports English only 70 | 71 | 72 | --- 73 | 74 | ### 🧪 Success Criteria 75 | 76 | - ✅ User gets usable summary in < 1 minute 77 | 78 | - ✅ Summary is accurate and well-structured 79 | 80 | - ✅ At least 90% user satisfaction in feedback form (post-launch) 81 | 82 | 83 | -------------------------------------------------------------------------------- /chapters/08-context-engineering.md: -------------------------------------------------------------------------------- 1 | # Context Enginnering 2 | 3 | 4 | طبق عکسی که پایین میبینید, همه چی مهندسی زمینه یا context engineering هست! 5 | 6 | ![Context Engineering](../assets/context-engineering.png) 7 | 8 | و راستش رو بخواین اگه همین رو یاد بگیرین بیشتر راه AI-powered engineer شدن رو رفتین :)) 9 | 10 | ### Context Engineering چیه؟ 11 | 12 | «چه اطلاعاتی باید به مدل بدم که دقیقاً بفهمه من چی می‌خوام؟» 13 | 14 | Context = prompt + اطلاعات زمینه‌ای + گفتگو های قبلی + ساختار گفتگو + فایل‌های باز شده + هدف نهایی شما 15 |
16 | - توضیح دقیق تسک (چی می‌خوای؟ چرا؟ چطوری؟) 17 |
18 | - فایل‌های مرتبط (کد اصلی، مثال، تست‌ها) 19 |
20 | - ساختار کلی پروژه 21 |
22 | - هدف اصلی فیچر یا باگی که داری هندل می‌کنی 23 |
24 | - تعریف کردن PRD 25 |
26 | - تعریف شفاف و کامل تسک و ساب تسک 27 |
28 | 29 | ### راه های منیج کردن کانتکست 30 | 31 | #### - اضافه کردن PRD به context 32 | یادتونه که PRD درست کردیم و اون رو تبدیل به تسک و ساب تسک کردیم؟ 33 | حالا دو تا فایل markdown درست میکنیم, یکی برای PRD و یکی برای تسک ها و ساب تسک ها 34 | اولین پرامپتی که بهش میدیم اینه: 35 | ``` 36 | Check the whole structure of the project and the PRD.md file for PRD to get familiar with the goal and the big picture of it 37 | ``` 38 | 39 | ### - اضافه کردن تسک و ساب تسک ها به context 40 | 41 | بعد اون تسک هایی رو که از PRD درآورده بودیم رو paste میکنیم توی فایل tasks.md. 42 | حالا برای انجام دادن تسک اول هر فایلی که مربوط به اون تسک میشه رو به context اضافه کنید. 43 | بعد به ai agent میگیم که اولین تسک رو چک کنه و ساب تسک هاش رو دونه دونه انجام بده. 44 | 45 | پرامپت: 46 | ‍‍ 47 | ``` 48 | Now check tasks.md file and review the first task, do its subtasks one by one and check if they work correctly and as I intended 49 | ``` 50 | 51 | 52 | بعد از اینکه انجام شد, دقیق چک میکنیم که درست انجام داده یا نه 53 | اگر نه, باید اون ساب تسک رو یه جور دیگه دیفاین کنیم و دوباره بهش بگیم. به این کار میگن **iterate کردن** که بعدا بیشتر راجع بهش صحبت میکنیم. 54 | 55 | ### - تعریف کردن و استفاده از قوانین کرسر [Cursor Rules](10-cursor-rules.md) 56 | توی بخش قوانین کرسر توضیح دادم. 57 | 58 | ### نکته: مدیریت کردن چت 59 | 60 | بعد از یه مدت که با ai agent چت میکنید متوجه میشید جواباش به درستی اون اوایل که ازش تسک میخواستید نیست. اینجا جاییه که اون داره هذیون گفتن رو شروع میکنه و context limit اش زده شده. باید حافظه اش رو تازه کنید و یه چت جدید باز کنید. این کار یکی از راه های context window management هست. 61 | 62 | --- 63 | 64 | *بخش ۹ ->[مهندسی پرامپت](09-prompt-engineering.md)* 65 | -------------------------------------------------------------------------------- /chapters/task-subtask-example.md: -------------------------------------------------------------------------------- 1 | ## ✅ Tasks & Subtasks for AI Podcast Summarizer (MVP) 2 | 3 | ### 1. 🛠️ Project Setup 4 | - [ ] Set up monorepo or separate frontend/backend (optional) 5 | - [ ] Initialize Next.js project with TailwindCSS 6 | - [ ] Set up backend (Node.js/Express or Python FastAPI) 7 | - [ ] Configure environment variables for API keys and services 8 | - [ ] Add GitHub repo + CI config 9 | 10 | --- 11 | 12 | ### 2. 🎧 Audio Input 13 | 14 | #### 2.1 Accept podcast link or upload 15 | - [ ] Design UI: input field for podcast URL 16 | - [ ] Validate supported platforms (e.g. Apple Podcasts, Spotify) 17 | - [ ] Optionally support file upload (MP3, M4A) 18 | - [ ] Send to backend for processing 19 | 20 | --- 21 | 22 | ### 3. 🧠 Transcription Pipeline 23 | 24 | #### 3.1 Integrate Whisper (on VPS or local) 25 | - [ ] Install and test Whisper 26 | - [ ] Handle long audio chunking + batching 27 | - [ ] Return full transcript to backend 28 | 29 | #### 3.2 (Optional) use 3rd-party STT (if Whisper is skipped) 30 | - [ ] Use API like Deepgram, AssemblyAI, or OpenAI Whisper API 31 | - [ ] Handle response format and costs 32 | 33 | --- 34 | 35 | ### 4. 🪄 Summarization Pipeline 36 | 37 | #### 4.1 Prompt Design & Context Engineering 38 | - [ ] Design few-shot prompt for summarization 39 | - [ ] Optimize prompt for clarity, structure, and tone 40 | 41 | #### 4.2 LLM Integration 42 | - [ ] Connect to GPT-4o / Claude 3.5 API 43 | - [ ] Send transcript and receive summary 44 | - [ ] Parse and format summary (headings, timestamps, etc.) 45 | 46 | --- 47 | 48 | ### 5. 🧪 UI – Results Display 49 | - [ ] Show summary text with headers/bullets 50 | - [ ] Display timestamped sections (optional: clickable) 51 | - [ ] Add loading states and error handling 52 | 53 | --- 54 | 55 | ### 6. 📤 Export & Sharing 56 | - [ ] Add "Copy to clipboard" button 57 | - [ ] Export summary to Markdown or PDF 58 | - [ ] Optional: "Share summary via link" 59 | 60 | --- 61 | 62 | ### 7. 🗃️ Save to Dashboard (optional MVP+) 63 | - [ ] Add simple login (magic link or GitHub login) 64 | - [ ] Store summaries per user 65 | - [ ] Show saved summaries in a dashboard 66 | 67 | --- 68 | 69 | ### 8. 🧪 Testing & QA 70 | - [ ] Test with different podcast lengths 71 | - [ ] Test low-quality audio edge cases 72 | - [ ] Manual prompt result validation 73 | - [ ] Basic unit + integration tests 74 | 75 | --- 76 | 77 | ### 9. 📑 Docs & Final Touches 78 | - [ ] Add README with setup instructions 79 | - [ ] Add `.env.example` 80 | - [ ] Create a simple changelog 81 | - [ ] Add credits for any open-source tools or APIs used 82 | 83 | --- 84 | 85 | ### 10. 🚀 Deployment 86 | - [ ] Deploy frontend on Vercel (or Netlify) 87 | - [ ] Deploy backend on VPS or Render 88 | - [ ] Connect domain if needed 89 | - [ ] Monitor logs and errors 90 | -------------------------------------------------------------------------------- /chapters/14-final-notes.md: -------------------------------------------------------------------------------- 1 | # جمع بندی 2 | 3 | میدونم حجم مطالب یکم زیاد شد, برای همین خلاصه و مفید اینجا مرورشون میکنیم. 4 | 5 | ### راه های منیج کردن context با ساختار بندی مناسب 6 | 7 | مهم ترین کاری که توی استفاده کردن از AI در پروژه باید انجام بدیم منیج کردن context هست. یه سری راه ها و ترفند هایی وجود داره برای این کار, مثل: 8 |
9 | - تعریف کردن قوانین کرسر 10 |
11 | - رفرنس دادن به فایل های PRD.md و تسک و ساب تسک ها توی کانتکست و همچنین فایل context.mdc 12 |
13 | - رفرش کردن کانتکست هر چند وقت یه بار با باز کردن چت جدید 14 |
15 |
16 | 17 | ### قوانین و فایل های کمکی کانتکست کرسر 18 | 19 | 20 | | فایل | کاربرد | محل نگهداری | 21 | | ------------------------- | ------------------------------------------------------------------------------------------------ | ------------------------------------------------------- | 22 | | **PRD (توضیحات محصول)** | توضیح کلی در مورد اینکه قراره چی بسازی و چرا | معمولاً با اسم `prd.md` یا توی پوشه‌ی `docs/prd.md` | 23 | | **تسک‌ها و ساب‌تسک‌ها** | کارهای قابل اجرا که از PRD در میاد؛ برای راهنمایی Cursor و خودت | `tasks.md` یا چند فایل جدا مثل `features.md`, `bugs.md` | 24 | | **فایل‌های `.mdc`** | فایل‌های خاصی که Cursor به طور خودکار می‌خونه و ازشون استفاده می‌کنه | پوشه‌ی `.cursor/` مثل `rules.mdc`, `context.mdc` | 25 | | **`.cursor/rules.mdc`** | قوانینی که دوست داری Cursor توی کدنویسی رعایت کنه (مثلاً «از any استفاده نکن») | داخل پوشه‌ی `.cursor/` | 26 | | **`.cursor/context.mdc`** | اطلاعاتی که می‌خوای Cursor همیشه ازشون باخبر باشه (مثلاً تکنولوژی پروژه، نام‌گذاری، API‌ها و...) | داخل پوشه‌ی `.cursor/` | 27 | 28 | ### ساختار پیشنهادی (تمیز + کاربردی) 29 | 30 | ``` 31 | my-project/ 32 | ├── .cursor/ 33 | │ ├── rules.mdc ← قوانین کدنویسی برای Cursor 34 | │ └── context.mdc ← اطلاعات پس‌زمینه که Cursor باید همیشه بدونه 35 | ├── docs/ 36 | │ ├── prd.md ← توضیحات محصول 37 | │ └── tasks.md ← لیست تسک‌ها و ساب‌تسک‌ها 38 | ├── src/ 39 | │ └── ... 40 | └── README.md 41 | 42 | ``` 43 | 44 | 45 | کانتکست ویندو (context window) کرسر گنجایش کمی داره و توکن های کمی رو میتونه هندل کنه. 46 | همه این کار ها ترفند هایی هستن که بتونیم بهترین استفاده از context رو ببریم بدون زدن لیمیتش. 47 | 48 | بعد از اون مهارت [Prompt Enginnering](09-prompt-engineering.md) مهمه که فرمولش رو حتما استفاده کنید توی نوشتن rule های کرسر و همچنین توی خود چت cursor. 49 | 50 | **براتون تمپلیت استارتر پروژه فول استک رو با این فایل هایی که لازمه (rules, prd, security check,...) درست کردم** [Fullstack AI Assisted starter](https://github.com/SaharMirkamrani/fullstack-ai-assisted-starter) 51 | --- 52 | 53 | *بخش ۱۵ ->[منابع](15-resources.md)* 54 | -------------------------------------------------------------------------------- /chapters/10-cursor-rules.md: -------------------------------------------------------------------------------- 1 | # Cursor Rules 2 | 3 | 4 | قوانین کرسر یا cursor rules, قانون هایی هستن که به جای اینکه هر سری توی پرامپتمون به کرسر بگیم, توی یه فایل .mdc مینویسیم و به کانتکستش اضافه میشه و توی جوابش رعایت میکنه اون قوانین رو. 5 | 6 | ### ۳ مدل rule داریم تو کرسر: 7 |
8 | - Project rules 9 | توی cursor/rules. ذخیره میشه 10 |
11 | - User Rules 12 | اینا رول های گلوبال هستن و توی settings ذخیره میشن 13 |
14 | - .cursorrules (legacy) 15 | هنوز ساپورت میشه ولی deprecated شده. 16 |
17 |
18 | 19 | ## Project Rules 20 | ### آناتومی rule 21 | 22 | هر فایل rule با فرمت `.mdc` نوشته می‌شه، که شامل metadata هم میشه. 23 | 24 | Metadata: 25 | 26 | - `description`: توضیح متنی برای فهم مدل اینکه این rule چه موقع باید اعمال بشه 27 | 28 | - `globs`: تعیین scope (مثلاً فقط فایل‌های خاص) 29 | 30 | - `alwaysApply`: اگر `true` باشه، همیشه روی تمام فایل‌ها اعمال می‌شه 31 | 32 | |Rule Type|Description| 33 | |---|---| 34 | |`Always`|Always included in model context| 35 | |`Auto Attached`|Included when files matching a glob pattern are referenced| 36 | |`Agent Requested`|Available to AI, which decides whether to include it. Must provide a description| 37 | |`Manual`|Only included when explicitly mentioned using `@ruleName`| 38 | 39 | 40 | مثال: 41 | 42 | ``` 43 | --- 44 | description: RPC Service boilerplate 45 | globs: 46 | alwaysApply: false 47 | --- 48 | 49 | - Use our internal RPC pattern when defining services 50 | - Always use snake_case for service names. 51 | 52 | @service-template.ts 53 | ``` 54 | 55 | 56 | ### چطوری این rules اعمال می‌شن؟ 57 | 58 | دو مرحله داره: 59 | 60 | 1. **Inject**: اگر `alwaysApply: true` یا فایل داخل `globs` باشه، rule وارد context می‌شه. 61 | 62 | 2. **Activate**: مدل خودش تشخیص می‌ده که آیا rule مرتبطه یا خیر (بر اساس `description`) 63 | 64 | ترکیب هوشمندانه `globs` + `description` باعث می‌شه که: 65 |
66 | - مدل context کمتری مصرف کنه 67 |
68 | - و فقط وقتی rule دیده بشه که مرتبط باشه 69 |
70 |
71 | 72 | ### نوشتن و سازماندهی قوانین پروژه (ٍٔNested Rules) 73 |
74 | - همیشه rules رو داخل `.cursor/rules/` قرار بده تا versioned و scoped باشن 75 |
76 | - قوانینی که مربوط به فولدر یا تکنولوژی خاص هستن، می‌تونی subfolder ایجاد کنی تا فقط روی اون بخش اعمال بشن 77 |
78 |
79 | 80 | مثال: 81 | 82 | ``` 83 | project/ 84 | .cursor/rules/ # Project-wide rules 85 | backend/ 86 | server/ 87 | .cursor/rules/ # Backend-specific rules 88 | frontend/ 89 | .cursor/rules/ # Frontend-specific rules 90 | ``` 91 | تعدادشون زیاد نشه (پیشنهاد: زیر ۵۰۰ خط کد) 92 | 93 | 94 | ### چطور rule رو دستی فراخوانی یا غیرفعال کنیم؟ 95 |
96 | - با نوشتن ``@ruleName`` داخل chat می‌تونید rule خاصی رو وارد context کنید 97 |
98 | - یا از `/Generate Cursor Rules` استفاده کنید تا خود Agent rule بسازه 99 |
100 |
101 | 102 | ## User Rules 103 | توی settings خود کرسر و قسمت Rules, میتونید تعریف کنید. مثلا: 104 | 105 | ``` 106 | Please reply in a concise style. Avoid unnecessary repetition or filler language. 107 | ``` 108 | 109 | **استفاده کردن از قوانین کرسر یکی از راه های منیج کردن کانتکست هست.** 110 | 111 | --- 112 | 113 | *بخش ۱۱ ->[Cursor MCP](11-cursor-mcp.md)* 114 | -------------------------------------------------------------------------------- /chapters/06-LLMs.md: -------------------------------------------------------------------------------- 1 | # LLM ها 2 | 3 | تو بخش های قبلی چند بار اسم AI coding agent و AI assistant رو‌ آوردم. اینا چه ربطی دارن به LLM؟ 4 | یه AI agent ای مثل cursor, یه نرم افزاره که توی قسمت چتش میتونیم LLM های مختلفی رو انتخاب کنیم و ازشون استفاده کنیم. 5 | 6 | ### مدل زبانی بزرگ یا LLM 7 | 8 | مدل زبانی بزرگ یا LLM مخفف Large Language Model هست 9 | و LLM های مختلفی داریم که هر کدوم با دیتاهای متفاوت و اهداف خاصی آموزش دیدن. 10 | بعضی ها به اختصار بهشون میگن مدل. 11 | 12 | مثلاً **GPT-4o** و **Claude 3.5 Sonnet** در زمانی که این متن نوشته میشه، از بهترین LLMها برای تولید کد و کمک در برنامه‌نویسی هستن. 13 | 14 | اما برای اینکه **بیشترین بهره‌وری رو از LLMها بگیریم**، خیلی مهمه که ویژگی‌ها و محدودیت‌هاشون رو بدونیم. 15 | 16 | ### دو تا مفهوم اصلی وجود داره که باید درک کنیم: 17 | 18 | ### 1. **زمینه (Context)** 19 | 20 | کانتکست همون اطلاعاتیه که به LLM می‌دیم. 21 | مثلاً توضیح پروژه، کد قبلی، فایل‌های مرتبط، یا سوال‌هایی که مطرح کردیم. 22 | هرچی زمینه دقیق‌تر، کامل‌تر و مرتبط‌تر باشه، LLM می‌تونه جواب‌های بهتری بده. 23 | اگه فقط بپرسیم «این چرا ارور می‌ده؟» بدون اینکه ارور یا کد رو بدیم، طبیعیه که مدل هم گیج بشه! 24 | 25 | **یه نکته مهم: LLMها حافظه دائمی ندارن (مگر اینکه توی یه سیستم مثل RAG یا Agent باشن).** 26 | 27 | **محدودیت کانتکست یا Context Window**: 28 | اکثرا بعد از چند وقت چت کردن با یه مدل, لیمیت کانتکست اش رو میزنیم. 29 | یعنی چی؟ 30 | 31 | یعنی مدل فقط یه مقدار مشخصی از اطلاعات رو می‌تونه هم‌زمان توی حافظه‌ش نگه داره و بر اساس اون تصمیم بگیره. به این می‌گن **context window**. 32 | برای مدل‌های قوی مثل GPT-4.5 یا Claude Opus این پنجره می‌تونه تا حدود 200 تا 300 هزار توکن بره، ولی بازم محدوده. 33 | 34 | وقتی از یه حدی بیشتر بشه، مدل شروع می‌کنه به فراموش کردن چیزهای اول چت، یا حتی فایل‌هایی که قبلاً خونده بوده. 35 | 36 | ### 2. **توکن (Token)** 37 | 38 | وLLMها ورودی و خروجی رو به جای کلمات، به صورت واحدهای کوچکتری به اسم "توکن" پردازش می‌کنن. 39 | هر کلمه، علامت، فاصله یا حتی بخشی از یه کلمه می‌تونه یه توکن باشه. 40 | مثلاً کلمه `function` معمولاً یه توکنه، ولی `internationalization` ممکنه چند توکن بشه. 41 | 42 | مدل‌ها بر اساس تعداد توکن‌هایی که می‌تونن توی یه پیام بخونن و جواب بدن، محدودیت دارن. مثلاً: 43 |
44 | - GPT-4o حدود **128K توکن** ظرفیت داره (تقریباً معادل 300 صفحه متن!) 45 |
46 | - بعضی مدل‌های دیگه مثل GPT-3.5 فقط تا **16K یا 32K** رو ساپورت می‌کنن. 47 |
48 |
49 | گاهی اوقات به دلیل اینکه کانتکست رو هندل نکردیم و لیمیتش رو میزنیم اتفاق های عجیبی میوفته, مثل: 50 | 51 | ### هذیان گویی یا Hallucination 52 | 53 | وقتی AI داره مشخصا پرت و پلا میگه, به این پدیده می‌گن "**hallucination**" یا هذیون گفتن. یعنی یه چیزی رو از خودش درمیاره چون فکر می‌کنه جوابه درسته. 54 | 55 | ***مثال:*** 56 | فرض کن یه پروژه React داریم و تو از مدل می‌پرسی: 57 | 58 | > «این ارور `Cannot read properties of undefined (reading 'map')` یعنی چی؟» 59 | 60 | مدل در جواب می‌گه: 61 | 62 | > «این ارور معمولاً به این دلیله که `map` رو روی یک عدد یا رشته استفاده کردی. مثلاً اگه `const data = 42` باشه و بخوای `data.map(...)` بزنی.» 63 | 64 | در حالی که کدت این بوده: 65 | 66 | ```js 67 | const data = undefined; 68 | data.map(item => ...) 69 | 70 | ``` 71 | 72 | #### نتیجه: 73 | 74 | مدل تلاش می‌کنه یه چیزی سر هم کنه که منطقی به نظر بیاد، حتی اگه واقعیت نداشته باشه. 75 | 76 | 77 | ### چی باعث میشه LLM دچار hallucination بشه؟ 78 |
79 | 1. Context ناقص یا ناکافی 80 |
81 | وقتی توکن‌های ورودی خیلی کم باشن یا اطلاعات لازم به مدل داده نشه، مجبور میشه خودش حدس بزنه. 82 | این حدس‌ها بعضی وقتا اشتباه در میان و مدل عملاً از خودش یه چیز در میاره. 83 |
84 |
85 | 2. Context بیش از حد / محدودیت توکن 86 |
87 | وقتی تعداد توکن‌ها خیلی زیاد بشه، ممکنه مدل نتونه کل context رو درست پردازش کنه (مثلاً از اولش چیزهایی یادش بره). 88 | تو بعضی مدل‌ها، وقتی نزدیک سقف توکن می‌ری، مدل فقط روی آخرین بخش‌ها تمرکز می‌کنه و قسمت‌های مهم قبلی رو نادیده می‌گیره. این باعث میشه جواب‌ها بی‌ربط یا اشتباه بشن. 89 |
90 |
91 | 3. موضوعات تخصصی یا خارج از دامنه آموزش مدل 92 |
93 | بعضی وقتا مدل راجع‌به چیزی نظر می‌ده که اصلاً تو دیتای آموزشی‌ش نبوده یا خیلی محدود بوده. مثلاً درباره یه API خیلی جدید یا یه ابزار نایاب. 94 |
95 |
96 | 4. پرامپت‌های مبهم یا گمراه‌کننده 97 |
98 | اگه پرامپتت خیلی کلی، مبهم، یا چندپهلو باشه، مدل نمی‌فهمه دقیقاً چی می‌خوای و برای اینکه "مفید" باشه، یه چیزی می‌سازه. 99 |
100 | 101 | 102 | ### پس چی کار کنیم؟ 103 |
104 | - اطلاعات یا کانتکست کافی و دقیق و به اندازه بهش بدیم 105 |
106 | - پرامپت واضح، مرحله به مرحله بنویسیم 107 |
108 | - بدونیم مدل چقدر context رو می‌تونه هندل کنه 109 |
110 | - از مدل درست برای کاری مثل برنامه نویسی استفاده کنیم 111 |
112 | 113 |
114 | حالا وقتشه فرق بین Prompt Engineering و Context Engineering رو درک کنیم. 115 | 116 | --- 117 | 118 | *بخش ۷ ->[مهندسی کانتکست در مقابل مهندسی پرامپت](07-context-engineering-vs-prompt-engineering.md)* 119 | -------------------------------------------------------------------------------- /chapters/09-prompt-engineering.md: -------------------------------------------------------------------------------- 1 | # Prompt Engineering 2 | 3 | پرامپت نوشتن هم هنره هم علم. 4 | یه پرامپت خوب ظرافت داره و هدفمنده. 5 | 6 | **یه پرامپت خوب:** 7 |
8 | - انقد کامل و واضحه که جایی برای حدس زدن برای LLM نمیزاره 9 |
10 | - ساختار داره -> مثل یه دستورالعمله 11 |
12 | - از کلمات ساده و مستقیم و جملات کوتاه استفاده میکنه 13 |
14 |
15 | یادتون باشه: 16 | 17 | **Garbage in = Garbage out** 18 | 19 | ### فرمول پرامپت نویسی 20 |
21 | - Role (نقش) 22 |
23 | - Goal (هدف) 24 |
25 | - Instructions (دستورالعمل) 26 |
27 | - Examples (مثال ها) 28 |
29 | - Format (شکل) 30 |
31 |
32 | 33 | ### نقش یا Role : 34 | 35 | در راستای تسک هایی که از AI میخواین بهش بگید که تخصصش چیه. مثال: 36 | 37 | ``` 38 | You are a Senior Front-End Developer and an Expert in ReactJS, NextJS, JavaScript, TypeScript, HTML, CSS and modern UI/UX frameworks (e.g., TailwindCSS, Shadcn, Radix). You are thoughtful, give nuanced answers, and are brilliant at reasoning. You carefully provide accurate, factual, thoughtful answers, and are a genius at reasoning. 39 | ``` 40 | 41 | ### هدف یا Goal : 42 | 43 | مشخصا باید بهش توضیح بدید چی میخواین. هرچی دقیق تر بهتر! 44 | 45 | مثال: 46 | ``` 47 | I want to lazy-load podcast player components that are currently blocking my LCP score. 48 | ``` 49 | 50 | 51 | ### دستورالعمل یا Instruction : 52 | 53 | دستورالعمل باعث میشه ai خودش حدس نزنه چیکار کنه. کلا هرجا داشت حدس میزد بدونید یه جای راه رو دارید اشتباه میرید. 54 | 55 | مثال: 56 | ``` 57 | Avoid using third-party libraries unless absolutely necessary. 58 | Write clear comments for every block of logic. 59 | ``` 60 | 61 | 62 | ### مثال ها یا Examples : 63 | 64 | خیلی مهمه چون ai فقط با پترن ها سر و کار داره و باید پترن کدنویسی شما رو هم بدونه که بتونه شبیه اون بزنه. 65 | مثال: 66 | ```js 67 | Follow this pattern: 68 | const LazyPlayer = dynamic(() => import('./Player'), { ssr: false }); 69 | ``` 70 | 71 | ### شکل یا Format : 72 | 73 | این برای خروجیه که مشخص میکنید چه فرمتی داشته باشه. 74 | مثال: 75 | ``` 76 | Return only the refactored code in a single JavaScript block. No explanation. 77 | ``` 78 | 79 | 80 | در نهایت, همه رو با هم بهش میدید: 81 | ``` 82 | I want to refactor a component that mixes data-fetching and UI logic into a clean separation of concerns. 83 | 84 | Avoid adding new libraries. 85 | Use custom hooks. 86 | Comment key sections. 87 | 88 | Follow this pattern: 89 | const LazyPlayer = dynamic(() => import('./Player'), { ssr: false }); 90 | 91 | Return only the new component and the new hook in a single code block. 92 | ``` 93 | ‍‍‍ 94 | 95 | ### یه فریم ورک دیگه از Google Prompting Course 96 | 97 | توی کورس prompting گوگل, فریم ورک استفاده از AI رو اینجوری گفته: 98 | - Task 99 | - Context 100 | - references 101 | - evaluate 102 | - iterate 103 | 104 | 105 | **این شکلیه:** 106 | 107 | تسک تعریف میکنیم براش ([تسک بندی](05-breaking-down.md)) 108 | 109 | کانتکست درست و کامل رو میدیم بهش (تو قسمت [context engineering](08-context-engineering.md) راجع بهش گفتیم), 110 | 111 | رفرنس ها همون مثال هاست که بالاتر گفتم, 112 | 113 | حالا بعد از اینکه جواب رو گرفتیم از LLM, اونو کامل بررسی میکنیم (evaluate) 114 | 115 | اگر جوابی که میخواستیم نیست -> یه قدم به عقب برمیگردیم و اصطلاحا iterate میکنیم. 116 | 117 | ### 🌀 Iterative Prompting 118 | 119 | پرامپت نوشتن یه مهارته و نیاز به تمرین داره. 120 | با سعی و خطا در نهایت متوجه میشی چی کار میکنه و چی کار نمیکنه. 121 | 122 | تو این مرحله باید بهش فیدبک بدیم و بگیم چی کار نمیکنه و چی داره کار میکنه و ازش بخوایم دوباره اون قسمتی که کار نمیکنه رو فیکس کنه با یه روش دیگه. 123 | 124 | به این فرایند می‌گن: **iterative prompting** 125 | 126 | ### نکته های پیشرفته تر 127 | 128 | ### Prompt Chaining (زنجیره‌سازی پرامپت‌ها) 129 | 130 | بعضی وقتا نمیشه همه‌ی چیزی که می‌خواین رو تو یه پرامپت بگین. یا حتی نباید بگین. چون هم باعث overload تو context می‌شه، هم مدل گیج می‌شه. 131 | در واقع جواب‌هایی که از پرامپت اول می‌گیرین، می‌شن ورودی پرامپت بعدی. 132 | 133 | **مثال:** 134 |
135 | 1. «لیستی از تمام مشکلات performance توی این کد بده» 136 |
137 | 2. «حالا به ترتیب اولویت بگو کدوماش ارزش وقت گذاشتن دارن» 138 |
139 | 3. «اولی رو بهینه کن و فقط کد نهایی رو بده» 140 |
141 |
142 | به جای اینکه یهویی بگی "کلش رو درست کن" داری قدم به قدم مدل رو جلو می‌بری. 143 | 144 | ### Chain of Thought Prompting (تفکر زنجیره‌ای) 145 | 146 | به جای اینکه از مدل فقط جواب نهایی رو بخوای، ازش بخواه قبلش فکر کنه، تحلیل کنه، قدم‌به‌قدم استدلال بیاره و بعد نتیجه بده. 147 | 148 | **چرا مهمه؟** 149 | چون LLMها وقتی مجبور می‌شن reasoning کنن، احتمال اینکه جواب درست بدن خیلی بیشتر می‌شه. مخصوصاً وقتی جواب به context، logic یا چند مرحله فکر نیاز داره. 150 | 151 | **مثال:** 152 | ``` 153 | Let's think step by step. First, explain the logic behind how you'd lazy load this component without affecting SEO. Then, suggest the implementation. 154 | ``` 155 | 156 | 157 | **یا برای دیباگ کردن:** 158 | ``` 159 | Before writing the fix, analyze the root cause of the error and explain your reasoning. Then implement the fix. 160 | ``` 161 | 162 | 163 | این روش نه فقط برای گرفتن جواب بهتره، بلکه باعث می‌شه خودت هم روند حل مسئله رو بهتر بفهمی و از مدل یاد بگیری. (همچنین یک جور safety net هم هست: اگه reasoning اشتباه بود، می‌تونی قبل از اجرای کد جلوش رو بگیری.) 164 | 165 | ### Meta Prompting 166 | 167 | **چی هست؟** 168 | از مدل بخوای خودش یه پرامپت بهتر برای تسک بسازه! 169 | 170 | **مثال:** 171 | ``` 172 | What would be the best way to ask you to implement this feature cleanly and efficiently? 173 | ``` 174 | 175 | 176 | ### پرامپت‌هات رو ذخیره کن (Personal Prompt Library) 177 | 178 | **یه کتابخونه شخصی از پرامپت‌ها** درست کن: 179 | 180 | - 🧱 **Feature Prompts:** برای ساختن فیچر جدید 181 | 182 | - 🛠 **Fix Prompts:** برای دیباگ و رفع باگ 183 | 184 | - 🧹 **Refactor Prompts:** برای تمیز کردن یا بهبود کد 185 | 186 | - 🧪 **Test Prompts:** برای تولید تست یونیت 187 | 188 | - 🧠 **Architecture Prompts:** برای مشورت در مورد ساختار پروژه 189 | 190 | 191 | --- 192 | 193 | *بخش ۱۰ ->[قوانین کرسر](10-cursor-rules.md)* 194 | -------------------------------------------------------------------------------- /chapters/12-security.md: -------------------------------------------------------------------------------- 1 | # امنیت 2 | 3 | 4 | 5 | **این بخش رو فرانت اند کار هایی که میخوان کد بکند با ai بزنن جدی بگیرن مخصوصا** 6 | ### امنیت کد موقع استفاده از AI 7 | 8 | وقتی از یه AI کمک می‌گیرید که کد رو بنویسه یا یه فیچر رو پیاده کنه، همیشه این سؤال باید تو ذهنت باشه: 9 | 10 | > «آیا این کدی که AI زده، امنه؟ یا فقط کار می‌کنه؟» 11 | 12 | واقعیت اینه که **AI دنبال امنیت نیست، دنبال حل تسکه.** و اگه ازش نخواین که به امنیت فکر کنه، احتمال زیاد یه سوراخ بزرگ توی اپلیکیشنتون جا می‌ذاره. 13 | 14 | ### خطرهای رایج در کدی که AI تولید می‌کنه: 15 |
16 | - استفاده از توکن یا API Key به‌صورت مستقیم تو کد 17 |
18 | - نداشتن input validation و در معرض بودن به حملات XSS یا SQL Injection 19 |
20 | - نداشتن authentication/authorization درست برای route ها 21 |
22 | - ذخیره کردن رمز عبور و دیتای حساس بدون هش کردن 23 |
24 | - ساختن endpointهایی که هر کسی می‌تونه صداشون بزنه 25 |
26 | - Rate Limiting 27 |
28 | - Row Level Security (RLS) 29 |
30 | - Spam Protection 31 |
32 |
33 | 34 | ### چطور امنیت رو توی فرآیند کدنویسی AI-محور وارد کنیم؟ 35 | 36 | #### - امنیت رو توی پرامپت بیار 37 | 38 | موقع پرامپت دادن، دقیقاً بگید امنیت هم مهمه. مثلاً: 39 | 40 | 41 | ``` 42 | Build a login endpoint in Express, but make sure to validate inputs, hash passwords using bcrypt, and avoid common security issues. 43 | ``` 44 | 45 | یا حتی مستقیم‌تر: 46 | ``` 47 | Make sure this endpoint is protected against SQL injection and does not expose sensitive data. 48 | 49 | ``` 50 | 51 | ``` 52 | Review this code and improve its security. What vulnerabilities do you see? 53 | ``` 54 | 55 | 56 | #### - خودتون هم امنیت یاد بگیرین 57 | 58 | هوش مصنوعی نمی‌تونه چیزی رو که **خودتون نمی‌فهمید** بهتون یاد بده. اگه ندونید که CSRF چیه، حتی اگه تو کد باشه نمی‌تونید پیدا کنید. پس سرچ کنید، پایه‌ های امنیت وب یا بک‌اند رو بشناسید. این باعث می‌شه بتونید به AI هم بهتر بگید چی می‌خواین. 59 | 60 | ### - Rate Limiting: خط ترمزی برای سوءاستفاده‌ها 61 | 62 | وRate Limiting یکی از ساده‌ترین ولی مهم‌ترین روش‌های دفاعی برای محافظت از API یا سروره. مخصوصاً وقتی از AI می‌خواین یه endpoint بسازه، معمولاً این موضوع رو نادیده می‌گیره. اگه route مثل `/login` یا `/feedback` یا حتی `/api/send-email` دارید، باید یه مکانیزم Rate Limiting بذارید تا کسی نتونه صد بار تو ثانیه ریکوئست بفرسته. اگه نذارید، ممکنه هدف حملات brute-force، spam یا DDoS بشید. مثلاً توی Node با پکیجی مثل `express-rate-limit` می‌تونید بگید هر IP فقط ۵ درخواست در دقیقه بدید. وقتی با AI دارید کد می‌زنید، توی پرامپت حتماً اضافه کنید: 63 | ‍ 64 | ``` 65 | Add basic rate limiting to prevent abuse. 66 | ``` 67 | 68 | ### Row-Level Security: دسترسی داده به سبک حرفه‌ای 69 | 70 | اگه قراره دیتابیس‌ اطلاعات کاربران مختلف رو نگه داره، نباید همه چیز برای همه کاربرها قابل دسترسی باشه. Row-Level Security دقیقاً این‌جاست که وارد میشه. مثلاً فرض کن یه جدول داری به اسم `posts` و هر کاربر فقط باید بتونه پست‌های خودش رو ببینه. بدون RLS ممکنه یکی با یه کوئری ساده مثل `SELECT * FROM posts` کل دیتای همه کاربرها رو ببینه — فاجعه امنیتی! 71 | وقتی دارید از یه AI coding agent مثل Cursor می‌خواین backend بنویسه، حتماً بگید: 72 | 73 | > **"Enable row-level security on sensitive tables like 'users' or 'posts', and create policies to restrict access based on user_id."** 74 | 75 | ### محافظت در برابر اسپم: راه نجات فرم‌هات از بات‌ها 76 | 77 | وقتی یه پروژه لانچ می‌کنید، مخصوصاً اگه فرم ثبت‌نام، لاگین، یا فرم تماس داری، باید همیشه به اسپمرها فکر کنید. 78 | 79 | **چند راه مؤثر برای محافظت در برابر اسپم:** 80 | 81 | #### 1. Rate Limiting 82 | 83 | همون‌طور که قبلاً گفتیم، نذارید یه آی‌پی بتونه صد بار توی یه دقیقه فرم پر کنه. 84 | 85 | #### 2. Honeypot Field 86 | 87 | یه فیلد مخفی داخل فرم بذار (مثلاً با CSS `display: none`) و اگر پر شد → میفهمید که یه بات فرم رو پر کرده. 88 | 89 | #### 3. reCAPTCHA یا hCaptcha 90 | 91 | راه کلاسیک ولی همچنان مؤثر. Google reCAPTCHA یا hCaptcha جلوی خیلی از بات‌ها رو می‌گیره. 92 | 93 | #### 4. Email verification 94 | 95 | برای فرم‌های حساس مثل ثبت‌نام یا فیدبک، از کاربر بخواین با ایمیل تأیید کنه. 96 | 97 | #### 5. Backend Validation 98 | 99 | فقط سمت فرانت چک نکنید. حتماً سمت سرور دوباره بررسی کنید که فرم منطقی و معتبر باشه. 100 | 101 | و وقتی دارید از AI coding agent مثل Cursor کمک می‌گیرید برای ساختن یه فرم یا endpoint، توی پرامپت بنویسین: 102 | 103 | > **"Add basic spam protection like rate limiting, honeypot field, and server-side validation to this feedback endpoint."** 104 | 105 | ### پرامپت‌های خوب امنیتی برای چک کردن 106 | 107 | - `Is this code vulnerable to XSS?` 108 | 109 | - `Add input sanitization and validation.` 110 | 111 | - `Ensure secure headers are set in Express.` 112 | 113 | - `Does this React form expose any security risks?` 114 | 115 | - `How can I make this upload feature more secure?` 116 | 117 | ### Security checklist 118 | 119 | ### Frontend Security 120 | 121 | | | Security Measure | Description | 122 | |---|-----------------|-------------| 123 | | ☐ | Use HTTPS everywhere | Prevents basic eavesdropping and man-in-the-middle attacks | 124 | | ☐ | Input validation and sanitization | Prevents XSS attacks by validating all user inputs | 125 | | ☐ | Don't store sensitive data in the browser | No secrets in localStorage or client-side code | 126 | | ☐ | CSRF protection | Implement anti-CSRF tokens for forms and state-changing requests | 127 | | ☐ | Never expose API keys in frontend | API credentials should always remain server-side | 128 | 129 | ### Backend Security 130 | 131 | | | Security Measure | Description | 132 | |---|-----------------|-------------| 133 | | ☐ | Authentication fundamentals | Use established libraries, proper password storage (hashing+salting) | 134 | | ☐ | Authorization checks | Always verify permissions before performing actions | 135 | | ☐ | API endpoint protection | Implement proper authentication for every API endpoint | 136 | | ☐ | SQL injection prevention | Use parameterized queries or ORMs, never raw SQL with user input | 137 | | ☐ | Basic security headers | Implement X-Frame-Options, X-Content-Type-Options, and HSTS | 138 | | ☐ | DDoS protection | Use a CDN or cloud service with built-in DDoS mitigation capabilities | 139 | 140 | ### Practical Security Habits 141 | 142 | | | Security Measure | Description | 143 | |---|-----------------|-------------| 144 | | ☐ | Keep dependencies updated | Most vulnerabilities come from outdated libraries | 145 | | ☐ | Proper error handling | Don't expose sensitive details in error messages | 146 | | ☐ | Secure cookies | Set HttpOnly, Secure and SameSite attributes | 147 | | ☐ | File upload security | Validate file types, sizes, and scan for malicious content | 148 | | ☐ | Rate limiting | Implement on all API endpoints, especially authentication-related ones | 149 | 150 | 151 | 152 | پیشنهاد میکنم این چک لیست ها رو به global rule کرسرتون اضافه کنید.([Cursor Rules](10-cursor-rules.md)) 153 | 154 | --- 155 | 156 | *بخش ۱۳ ->[نکات تکمیلی](13-additional-tips.md)* 157 | --------------------------------------------------------------------------------