مهلت ثبت‌نام امروز تموم میشه

مرحله‌ی مصاحبه تموم شد و به تمام کسانی که پذیرفته شدن پیام دادم
اگه پیامی دریافت نکردید به این معناست که متاسفانه پذیرفته نشدید. امیدوارم در آینده بتونم در خدمتتون باشم 🙏

نظرتون در مورد مسابقه‌ی فرانت‌اند کداستار چی بود؟ (امروز ساعت 10 صبح برگزار شد)

با عرض سلام و احترام خدمت مخاطبین عزیز 🙂👋
امیدوارم حالتون خوب باشه

همونطور که میدونید، 40 روز پیش یه بوت‌کمپ شروع شد به اسم بوت‌کمپ شهید رئیسی (پستی که Reply کردم ☝️)
امروز چله‌ی اول این دوره تموم شد و طبق نظری که بچه‌ها دادن قرار شد دوره رو ادامه بدیم و پروژه‌هایی که داشتیم روشون کار میکردیم رو به سرانجام برسونیم

چله‌ی بعدی قراره از شنبه 21 تیر شروع بشه
از اونجایی که توصیف دوره خیلی طولانی میشه، توضیحات کامل رو میتونید از اینجا بخونید:
https://codective.ir/shahid

در حال حاضر داریم روی دانش و مهارت پایه‌ی شرکت‌کننده‌ها کار میکنیم؛ یعنی HTML و CSS و JavaScript
البته با توجه به علاقه‌ی بچه‌ها، تعدادی روی UI Design و Backend مشغول به فعالیت هستن
بعدش قراره سراغ React و Next بریم و یه پروژه‌ی هوش تجاری (Business Intelligence) بیاریم بالا

افرادی که مایل هستن تو این بوت‌کمپ شرکت کنن از طریق سایتی که فرستادم وارد قسمت ثبت‌نام بشن و پرسشنامه رو پر کنن

در شب تاسوعای حسینی، در حرم مطهر امام رضا علیه‌السلام، نایب‌الزیاره‌ی شما عزیزان هستم 🖤

مهلت ثبت‌نام تا پایان امروزه

مرحله‌ی مصاحبه تموم شد و به تمام کسانی که پذیرفته شدن پیام دادم
اگه پیامی دریافت نکردید به این معناست که متاسفانه پذیرفته نشدید. امیدوارم در آینده بتونم در خدمتتون باشم 🙏

جلسه‌ی اول دوره‌ی آموزش رایگان React منتشر شد 🚀
تو این دوره قراره یه پروژه‌ی کامل شبیه Trello رو از صفر بیاریم بالا 😎
اگر میخوای React رو از پایه و به‌صورت عمیق یاد بگیری، این دوره مخصوص خودته!

ویژگی‌های دوره:
💰 کاملاً رایگان
⚡️ از صفر تا نیمه‌پیشرفته
💪 پروژه‌محور + نمونه‌کار قوی
📦 پکیج‌های معروف و کاربردی

برخی از مباحث دوره:
🔥 بررسی عمیق JSX و نحوه‌ی کار React در پشت صحنه
🔥 انواع Hookها؛ از useState تا useCallback و useReducer
🔥 کامپوننت‌های متنوع و متعدد؛ از Button تا Modal
🔥 پکیج‌های کاربردی؛ از dnd kit تا Zustand
🔥 کار با Formها؛ از Zod تا React Hook Form
🔥 کار با APIها؛ از React Query تا احراز هویت
🔥 کاملاً Responsive و دو زبانه با i18next
🔥 دیپلوی با Vercel و دامنه‌ی شخصی

🌐 لیست کامل مباحث رو اینجا ببینید:
https://gist.github.com/BijanProgrammer/3a108b665594d7a2c1f23d5cf329376c

شرکت در این دوره کاملاً رایگانه و فقط کافیه به ازای هر قسمت که مشاهده میکنید یک صلوات بفرستید و ثوابش رو هدیه کنید به شهیدی که در زیرنویس ویدئو یا کپشن نوشته میشه
این قسمت تقدیم به امام حسین علیه‌السلام ❤️

با لایک و کامنت ازم حمایت کنید تا بتونم آموزش‌های بیشتری درست کنم 🤝

https://www.linkedin.com/posts/bijanprogrammer_nextjs-react-frontenddevelopment-activity-7362188860191100929-P1Gu

تالا شده به این فکر کنید چرا باید تو React از useState استفاده کنیم؟ 🤔
چرا نمیشه همینجوری عادی یه متغیر تعریف کنیم و مقدارش رو تغییر بدیم؟ 🤷‍♂️
یا مثلاً چطور میتونیم یه داده‌ای رو از کامپوننت فرزند به پدر پاس بدیم؟ 🤯

تو این قسمت جواب تمام این سوالات رو میدیم و درک عمیقی از این مفاهیم پیدا می‌کنیم:
🔥 Event Handling
🔥 useState
🔥 Component
🔥 Props

🌐 لیست کامل مباحث رو اینجا ببینید:
https://gist.github.com/BijanProgrammer/3a108b665594d7a2c1f23d5cf329376c

شرکت در این دوره کاملاً رایگانه و فقط کافیه به ازای هر قسمت که مشاهده میکنید یک صلوات بفرستید و ثوابش رو هدیه کنید به شهیدی که در زیرنویس ویدئو یا کپشن نوشته میشه
این قسمت تقدیم به شهید محمدهادی ذوالفقاری ❤️

با لایک و کامنت ازم حمایت کنید تا بتونم آموزش‌های بیشتری درست کنم 🤝

https://www.linkedin.com/posts/bijanprogrammer_react-frontenddevelopment-freebootcamp-activity-7363577374296236033-O9wy

تالا شده به این فکر کنید چطور React یه div خالی رو با محتوای کامپوننت‌ها پر میکنه؟ 🤔
زمانی که یه State تغییر میکنه، از کجا میفهمه دقیقاً چه چیزی رو باید تو DOM آپدیت کنه؟ 🤷‍♂️
یا مثلاً چه احتیاجی به Virtual DOM هست؟ 🤯
اصلاً این Key Prop به چه درد میخوره و آیا جای دیگه‌ای به جز حلقه‌ها استفاده میشه؟ 😳

تو این قسمت جواب تمام این سوالات رو میدیم و درک عمیقی از این مفاهیم پیدا می‌کنیم:
🔥 Single Page Application or SPA
🔥 Root Element
🔥 Rendering
🔥 Triggering
🔥 Committing
🔥 Virtual DOM
🔥 Niche Use Case for Key Prop

🌐 لیست کامل مباحث رو اینجا ببینید:
https://gist.github.com/BijanProgrammer/3a108b665594d7a2c1f23d5cf329376c

شرکت در این دوره کاملاً رایگانه و فقط کافیه به ازای هر قسمت که مشاهده میکنید یک صلوات بفرستید و ثوابش رو هدیه کنید به شهیدی که در زیرنویس ویدئو یا کپشن نوشته میشه
این قسمت تقدیم به شهید محمد بروجردی ❤️

با لایک و کامنت ازم حمایت کنید تا بتونم آموزش‌های بیشتری درست کنم 🤝

https://www.linkedin.com/posts/bijanprogrammer_react-frontenddevelopment-freebootcamp-activity-7363895107269312512-11jh

تالا شده به این فکر کنید چرا از React Router استفاده میکنیم؟ 🤔
چجوریه که فقط یه فایل HTML داریم اما می‌تونیم چند صفحه رو باهاش نمایش بدیم؟ 🤷‍♂️
یا مثلاً چرا باید از Link استفاده کنیم و نمیشه از a معمولی استفاده کرد؟ 🤯
اصلاً مگه میشه جوری CSS نوشت که برای Responsive کردن سایت به مشکل نخوریم؟ 😳

تو این قسمت جواب تمام این سوالات رو میدیم و درک عمیقی از این مفاهیم پیدا می‌کنیم:
🔥 React Router
🔥 Layout and Outlet
🔥 Dynamic Routes
🔥 404 Not Found Page
🔥 Global Error Boundary
🔥 TypeScript Button Component
🔥 Global Styles
🔥 CSS Modules
🔥 Google Fonts
🔥 Easy Responsiveness

🌐 لیست کامل مباحث رو اینجا ببینید:
https://gist.github.com/BijanProgrammer/3a108b665594d7a2c1f23d5cf329376c

شرکت در این دوره کاملاً رایگانه و فقط کافیه به ازای هر قسمت که مشاهده میکنید یک صلوات بفرستید و ثوابش رو هدیه کنید به شهیدی که در زیرنویس ویدئو یا کپشن نوشته میشه
این قسمت تقدیم به شهید فریدون عباسی ❤️

با لایک و کامنت ازم حمایت کنید تا بتونم آموزش‌های بیشتری درست کنم 🤝

https://www.linkedin.com/posts/bijanprogrammer_react-frontenddevelopment-freebootcamp-activity-7364725554299711489-eV8P

پیاده‌سازی Kanban Board - دوره‌ی آموزش رایگان React - قسمت 5

تو این قسمت به این موضوعات می‌پردازیم:
🔥 Board Component
🔥 List Component
🔥 List Item Component
🔥 Icon Button Component
🔥 Prop Types

🌐 لیست کامل مباحث رو اینجا ببینید:
https://gist.github.com/BijanProgrammer/3a108b665594d7a2c1f23d5cf329376c

شرکت در این دوره کاملاً رایگانه و فقط کافیه به ازای هر قسمت که مشاهده میکنید یک صلوات بفرستید و ثوابش رو هدیه کنید به شهیدی که در زیرنویس ویدئو یا کپشن نوشته میشه
این قسمت تقدیم به شهید مصطفی احمدی روشن ❤️

با لایک و کامنت ازم حمایت کنید تا بتونم آموزش‌های بیشتری درست کنم 🤝

https://www.linkedin.com/posts/bijanprogrammer_react-frontenddevelopment-freebootcamp-activity-7366140993861062656-UC_J

تالا شده به این فکر کنید useMemo تو سورس‌کدِ React چطور نوشته شده؟ 🤔
زمانی که Rerender اتفاق میفته، از کجا میفهمه باید از مقدار قبلی استفاده کنه یا مقدار جدید؟ 🤷‍♂️
یا مثلاً چه احتیاجی useCallback هست؟ 🤯
اصلاً این memo به چه درد میخوره و چطور میشه الگوریتم مقایسه‌ش رو تغییر داد؟ 😳

تو این قسمت جواب تمام این سوالات رو میدیم و درک عمیقی از این مفاهیم پیدا می‌کنیم:
🔥 memo
🔥 useMemo
🔥 useCallback
🔥 React DevTools

همچنین سورس‌کدِ React رو دانلود و بررسی می‌کنیم تا فهم کاملی از نحوه‌ی کار Memoization و پشت صحنه‌ی React پیدا کنیم.

علاوه بر این React DevTools رو مفصل توضیح می‌دیم و از فیچرهای مختلفش استفاده می‌کنیم برای اینکه بتونیم دید خوبی از پروژه داشته باشیم و مشکلات Performance احتمالی رو شناسایی کنیم.

🌐 لیست کامل مباحث رو اینجا ببینید:
https://gist.github.com/BijanProgrammer/3a108b665594d7a2c1f23d5cf329376c

شرکت در این دوره کاملاً رایگانه و فقط کافیه به ازای هر قسمت که مشاهده میکنید یک صلوات بفرستید و ثوابش رو هدیه کنید به شهیدی که در زیرنویس ویدئو یا کپشن نوشته میشه
این قسمت تقدیم به شهید سید ابراهیم رئیسی ❤️

با لایک و کامنت ازم حمایت کنید تا بتونم آموزش‌های بیشتری درست کنم 🤝

https://www.linkedin.com/posts/bijanprogrammer_react-frontenddevelopment-freebootcamp-activity-7367111312025321473-S2_-

تالا شده به این فکر کنید چطور میشه تغییرات کاربر رو ذخیره کرد که با Refresh صفحه از بین نره؟ 🤔
چطور می‌تونیم بفهمیم یه State تغییر کرده که بتونیم نسبت بهش واکنش نشون بدیم؟ 🤷‍♂️
یا مثلاً useLayoutEffect چیه و چه تفاوتی با useEffect داره؟ 🤯
اصلاً این StrictMode به چه درد میخوره و چرا باید ازش استفاده کنیم؟ 😳

تو این قسمت جواب تمام این سوالات رو میدیم و درک عمیقی از این مفاهیم پیدا می‌کنیم:
🔥 useEffect
🔥 useLayoutEffect
🔥 StrictMode

همچنین داده‌ی کاربر رو با استفاده از localStorage و useEffect ذخیره می‌کنیم که وقتی صفحه رو Refresh می‌کنه تغییراتش از بین نره.

🌐 لیست کامل مباحث رو اینجا ببینید:
https://gist.github.com/BijanProgrammer/3a108b665594d7a2c1f23d5cf329376c

شرکت در این دوره کاملاً رایگانه و فقط کافیه به ازای هر قسمت که مشاهده میکنید یک صلوات بفرستید و ثوابش رو هدیه کنید به شهیدی که در زیرنویس ویدئو یا کپشن نوشته میشه
این قسمت تقدیم به شهید مسعود علی‌محمدی ❤️

با لایک و کامنت ازم حمایت کنید تا بتونم آموزش‌های بیشتری درست کنم 🤝

https://www.linkedin.com/posts/bijanprogrammer_react-frontenddevelopment-freebootcamp-activity-7367402382432911360-MN5J

تالا اسم Reducer به گوشتون خورده؟ 🤔
لابد فک میکنید فقط تو Redux میشه ازش استفاده کرد؟ 🤷‍♂️
یا مثلاً میدونید Context چیه و به چه درد میخوره؟ 🤯
اصلاً چرا باید از اینا استفاده کرد وقتی کارمون با useState راه میفته؟ 😳

تو این قسمت جواب تمام این سوالات رو میدیم و درک عمیقی از این مفاهیم پیدا می‌کنیم:
🔥 Prop Drilling
🔥 Context API (createContext, useContext and use)
🔥 Reducer and useReducer

همچنین کتابخونه‌ی React-Tostify رو نصب و راه‌اندازی می‌کنیم که بتونیم به کاربر Toast Notification نشون بدیم.

🌐 لیست کامل مباحث رو اینجا ببینید:
https://gist.github.com/BijanProgrammer/3a108b665594d7a2c1f23d5cf329376c

شرکت در این دوره کاملاً رایگانه و فقط کافیه به ازای هر قسمت که مشاهده میکنید یک صلوات بفرستید و ثوابش رو هدیه کنید به شهیدی که در زیرنویس ویدئو یا کپشن نوشته میشه
این قسمت تقدیم به شهید مجید شهریاری ❤️

با لایک و کامنت ازم حمایت کنید تا بتونم آموزش‌های بیشتری درست کنم 🤝

https://www.linkedin.com/posts/bijanprogrammer_react-frontenddevelopment-freebootcamp-activity-7369191637660450816-g_Iz

تالا شده بخواید یه Modal رو تو React پیاده‌سازی کنید؟ 🤔
لابد فک میکنید باید از Portal استفاده کرد؟ 🤷‍♂️
یا مثلاً شده فکر کنید useRef چه کاربرد دیگه‌ای به جز دسترسی به Element داره؟ 🤯
اصلاً چرا باید از useState برای ذخیره‌کردن مقدار Input استفاده کرد؟ 😳
تفاوت onSubmit رو Form و onClick رو Button رو که دیگه میدونید؟ 🙄
تفاوت target و currentTarget رو چطور؟ 😬

تو این قسمت جواب تمام این سوالات رو میدیم و درک عمیقی از این مفاهیم پیدا می‌کنیم:
🔥 Controlled vs Uncontrolled Form
🔥 From Validation
🔥 useRef
🔥 useId
🔥 HTML Dialog Element
🔥 Implementing Modal Component
🔥 Dismiss Modal by Clicking on Backdrop
🔥 Caret and Accent Colors
🔥 Ref Prop vs forwardRef
🔥 target vs currentTarget

🌐 لیست کامل مباحث رو اینجا ببینید:
https://gist.github.com/BijanProgrammer/3a108b665594d7a2c1f23d5cf329376c

شرکت در این دوره کاملاً رایگانه و فقط کافیه به ازای هر قسمت که مشاهده میکنید یک صلوات بفرستید و ثوابش رو هدیه کنید به شهیدی که در زیرنویس ویدئو یا کپشن نوشته میشه
این قسمت تقدیم به شهید داریوش رضایی‌نژاد ❤️

با لایک و کامنت ازم حمایت کنید تا بتونم آموزش‌های بیشتری درست کنم 🤝

https://www.linkedin.com/posts/bijanprogrammer_react-frontenddevelopment-freebootcamp-activity-7370040576919879680-P6Ee

تالا شده بخواید Drag and Drop رو تو React پیاده‌سازی کنید؟ 🤔
لابد فک میکنید خیلی راحت میشه از dnd kit استفاده کرد؟ 🤷‍♂️
خب اگه چند تا Container داشته باشیم که آیتم‌ها بتونن بینشون جابه‌جا بشن چی؟ 🤯
اگه خودِ Containerها هم بتونن جابه‌جا بشن چی؟ 😳

تو این قسمت جواب تمام این سوالات رو میدیم و درک عمیقی از این مفاهیم پیدا می‌کنیم:
🔥 dnd kit (Drag and Drop)
🔥 Immer

در نهایت یه Kanban Board خواهیم داشت که با استفاده از Drag and Drop میشه تمام آیتم‌ها و لیست‌ها رو جابه‌جا کرد.
همچنین از React Compiler استفاده می‌کنیم که همیشه بتونیم 60 فریم در ثانیه به کاربر نمایش بدیم.

🌐 لیست کامل مباحث رو اینجا ببینید:
https://gist.github.com/BijanProgrammer/3a108b665594d7a2c1f23d5cf329376c

شرکت در این دوره کاملاً رایگانه و فقط کافیه به ازای هر قسمت که مشاهده میکنید یک صلوات بفرستید و ثوابش رو هدیه کنید به شهیدی که در زیرنویس ویدئو یا کپشن نوشته میشه
این قسمت تقدیم به شهید حسن طهرانی مقدم ❤️

با لایک و کامنت ازم حمایت کنید تا بتونم آموزش‌های بیشتری درست کنم 🤝

https://www.linkedin.com/posts/bijanprogrammer_react-frontenddevelopment-freebootcamp-activity-7371006955227811840-_ELk

تالا شده بخواید یه Custom Input رو تو React پیاده‌سازی کنید؟ 🤔
چطور میشه کاری کرد مثل یه Input معمولی عمل کنه؟ 🤷‍♂️
یعنی میشه یه جوری FormData بتونه بخوندش؟ 🤯
اگه بخوایم هم به صورت Controlled و هم Uncontrolled بشه ازش استفاده کرد چی؟ 😳

تو این قسمت جواب تمام این سوالات رو میدیم و درک عمیقی از این مفاهیم پیدا می‌کنیم:
🔥 CRUD Operations (Create, Read, Update, Delete)
🔥 Integrated Custom Input Component
🔥 Refactor

در نهایت یه Kanban Board خواهیم داشت که میشه عملیات‌های ساخت، ویرایش و حذف رو روی تمام جدول‌ها، لیست‌ها و آیتم‌ها انجام داد.
همچنین از چندین Context و Provider استفاده می‌کنیم که به هم وابستگی دارن و در کنار هم یه Logic پیچیده رو تشکیل میدن.

🌐 لیست کامل مباحث رو اینجا ببینید:
https://gist.github.com/BijanProgrammer/3a108b665594d7a2c1f23d5cf329376c

شرکت در این دوره کاملاً رایگانه و فقط کافیه به ازای هر قسمت که مشاهده میکنید یک صلوات بفرستید و ثوابش رو هدیه کنید به شهیدی که در زیرنویس ویدئو یا کپشن نوشته میشه
این قسمت تقدیم به شهید علی صیاد شیرازی ❤️

با لایک و کامنت ازم حمایت کنید تا بتونم آموزش‌های بیشتری درست کنم 🤝

https://www.linkedin.com/posts/bijanprogrammer_react-frontenddevelopment-freebootcamp-activity-7372273040426074112-SV7_

آموزش Zod برای اعتبارسنجی فرم - دوره‌ی آموزش رایگان React - قسمت 12

تالا شده بخواید یه Form رو تو React اعتبارسنجی کنید؟ 🤔
چه ابزاری هست که قدرتمنده و در عین حال کار کردن باهاش راحته؟ 🤷‍♂️
اگه بخوایم در حین Validation، داده‌هامون رو تمیز هم کنیم چی؟ 🤯
یا مثلاً اگه نخوایم Validation و Type رو دو بار تعریف کنیم چی؟ 😳

تو این قسمت جواب تمام این سوالات رو میدیم و درک عمیقی از این مفاهیم پیدا می‌کنیم:
🔥 Zod
🔥 Customized Error Message
🔥 Infer Type from Schema
🔥 Coerce
🔥 Transform
🔥 Trim
🔥 Enums

🌐 لیست کامل مباحث رو اینجا ببینید:
https://gist.github.com/BijanProgrammer/3a108b665594d7a2c1f23d5cf329376c

شرکت در این دوره کاملاً رایگانه و فقط کافیه به ازای هر قسمت که مشاهده میکنید یک صلوات بفرستید و ثوابش رو هدیه کنید به شهیدی که در زیرنویس ویدئو یا کپشن نوشته میشه
این قسمت تقدیم به شهید محمد باقری ❤️

با لایک و کامنت ازم حمایت کنید تا بتونم آموزش‌های بیشتری درست کنم 🤝

https://www.linkedin.com/posts/bijanprogrammer_react-frontenddevelopment-freebootcamp-activity-7372335703638130689-r2sP