دوره متخصص ریکت و ریداکس

دوره جدید ری اکت ۱۸ و ریداکس به زودی اضافه میشود 😍. 16 فصل اول دوره جدید ریکت آپلود شد ✅

۵۳:۰۷:۰۰
۲۶۴ جلسه
۲۲۵۹ دانشجو
۴.۹  از  ۳۲  رای
روش دریافت: اسپات پلیر
تاریخ انتشار :۱۴۰۱/۹/۲۶
آخرین بروزرسانی:۱۴۰۳/۱/۱۰
پشتیبانی: دائمی تلگرام

توضیحات دوره

دوره جدید ری اکت ۱۸ و ریداکس به زودی اضافه میشود 😍. 16 فصل اول دوره جدید ریکت آپلود شد ✅

ریکت دیگه چیه ؟

آمارهای گیت هاب و سایت stack overflow نشان میده که بازارکار کتابخانه ریکت چه در ایران و چه در خارج از کشور رشد چشم گیری در این چند سال اخیر داشته. تا جایی که در سال 2020 ریکت (React.js) به عنوان محبوب ترین کتابخانه جاوااسکریپت شناخته شده است. یکی از دلایل این محبوبیت، سادگی یادگیری، بازار کار فوق العاده، جامعه آماری بالا، سرعت و عملکرد بالا و پشتیبانی فیسبوک هست.

چرا باید ریکت رو فرا بگیریم ؟

ریکت به عنوان تیر خلاص برای یک هنرجوی فرانت برای استخدام هست. چون این روزا عملا هیچ پروژه ای با جاوااسکریپت خام (vanilla JavaScript) انجام نمی شود. چون که به کمک ریکت پروژه در نهایت سادگی و در کمترین زمان ممکن با بالاترین عملکرد انجام می شود. علاوه بر این، استفاده از ابزار جدیدی مثل ریکت، هزینه توسعه و نگه داری پروژه ها رو تا حد چشم گیری کاهش می دهد. پس طبیعتا شرکت ها هم به دنبال متخصص ریکت هستند.

چرا ریکت بازار کار رو به رشدی داره ؟

شرکت ها هزینه های زیادی برای به روز کردن برنامه های خود پرداخت می کنند. هم چنین، یادگیری بسیار ساده ریکت، وجود کتابخانه های قدرمتند، منابع یادگیری فراوان و پشتیبانی فسیبوک همه این ها باعث شده که نیروی متخصص ریکت خواهان زیادی داشته باشد.

صاحب، وجه تمایز دوره ت چیه ؟

بیش از 5 دوره کامل یودمی و یوتوب رو کامل دیدم و واقعا تا الان ندیدم که یک دوره ریکت فرآیند احراز هویت (Authorization - Authentication)، ثبت نام، لاگین، سفارش، مدیریت خطاهای سمت سرور (Error handling)، مدیریت استیت ها به کمک context ، Redux را در یک پروژه واقعی فروشگاه آنلاین (shopping) بررسی کند. به همین دلیل، بک اند و دیتا بیس واقعی رو آماده بهتون میدم که یک پروژه واقعی را تمرین کنید.

آیا صرفا یادگیری ریکت کافیه ؟

بله قطعا، رمز موفقیت توی برنامه نویسی تمرکز روی یک حوزه هست. شما رو باید به عنوان متخصص یک حوزه بشناسن تا از بقیه متفاوت باشید. قطعا یادگیری ریکت به تنهایی برای شما کافی خواهد بود و نیازی به یادگیری vue.js یا angular نیست.

چرا این دوره آماده شد ؟

این دوره حاصل کار با بیش از 125 دانشجو به صورت coach خصوصی، بیش از 4 سال سابقه کار با کتابخانه ریکت در پروژه های داخلی و خارجی و مشاوره چندین استارتاپ و پروژه تحت ریکت (React.js ) و نکست (Next.js) هست. ریکت رو مثل بچه خودم میدونم و بعد این همه سابقه تدریس ریکت، واقعا چالش های آموزش ریکت رو شناسایی کرده ام و یک دوره کاملا پروژه محور و حرفه ای برای شما آماده شده است. انتظار من از شما، بعد این دوره یک توسعه دهنده ارشد ریکت هست که بتونید بدون نیاز به هیچ بوت کمپ و کاراموزی با چندین نمونه کار حرفه ای وارد بازار کار شوید.

آیا همین دوره ریکت کافی خواهد بود؟

مطمین باشید که اولین و آخرین دوره ریکتی هست که شرکت خواهید کرد. تمرین ها و پروژه های این دوره فرآیند یادگیری شما را تکمیل می کند. دوره حرفه ای متخصص ریکت، کاملا متفاوت هست که شما رو به بازار کار می رساند، به شرطی که شما هم همت کنید و همراه من باشید.

برای پشتیبانی چه برنامه ای داری ؟

این دوره پشتیبانی منحصربفرد دارد. پشتیبانی به صورت گروه های ویژه تلگرامی هست و فقط خودم جوابگوی هر گونه سوال و ابهام شما چه در مسائل فنی و چه در پروسه استخدامی و رزومه سازی هستم.

وبینار توی دوره جریانش چیه ؟

اگه دانشجو احساس کنه، کسی کنارش هست که کل مسیر رو رفته با اطمینان خاطر بیشتری یاد میگیره، در این مسیر تجربه های خودم رو بهش میگم و نمیذارم مسیر اشتباهی بره و یادگیری براش لذت بخش خواهد شد. این دوره یک وبینار داره که در طول دوره برگزار میشه. در این وبینارها مسائل مربوط به فرایند استخدامی، رزومه سازی، نمونه کار و سوالات فنی دانشجویان جواب داده میشه.

صاحب میشه بگی، ساختار کلی دوره چطوریه ؟

مفاهیم class / functional component روی یک پروژه تمرینی بررسی میشه. استیت و پراپس ها رو میگیم. بعدش میرسیم به context و چرخه عمر کامپوننت ها. قدم بعدی، مفاهیم filter, search, sort رو بهتون میگم. بعدش میریم سمت react-router ، http request و پروژه های دیگه برای ترکیب مفاهیم گفته میشه. بعدش Redux رو میگیم و میریم سمت پروژه اصلی دوره.

راجب پروژه ها یکم بیشتر توضیح میدی ؟

تمرین ها، چالش ها و پروژه ها با نهایت حساسیت انتخاب شدن تا همه مفاهیم مثل هوک ها، استیت های global، درخواست های سمت سرور، http requests و چالش هایی با هم ترکیب بشه و مجددا استفاده بشه تا مطالب تثبیت بشه. پروژه های todoList, contactList, shopping cart, expense tracker جزء مهم ترین پروژه های این دوره هست.

این دوره برای چه کسانی توصیه میشه ؟

یادگیری ریکت بعد از جاوااسکریپت، یکی از بهترین انتخاب ها برای ورود به بازار کار در سال 1400 است.

وجه تمایز تدریست چیه ؟

برای من باعث افتخاره که خودم رو معلم بدونم و توی آموزش مساله ای که برام اهمیت داره اینه که توی تدریس همراه دانشجو باشم و همیشه یک مفهوم رو با طرح یک مساله تدریس میکنم. به راه حل ها فکر میکنیم و پیاده میکنیم. مساله رو پیچیده تر میکنیم و با ترکیب چیزایی که از قبل یاد گرفتیم، به بهینه ترین راه حل میرسیم. این مدل تدریس من هست. قطعا پشتیبانی، وبینارها و پروژه محور بودن از ویژگی های این دوره هست که توی هیچ دوره ی برنامه نویسی دیگه ای، وبیناری برای آسان کردن مسیر استخدامی برگزار نمیشه و بعد یادگیری دانشجو سردرگم میشه و میره دنبال دوره های دیگه. این دوره دقیقا جاییه که جلو همه ی این اتفاقات رو میگیره.

بخاطر مبلغ دوره، نمیخواهم در این دوره شرکت نمایم. پیشنهاد شما چیست؟

به دست آوردن هر چیزی بهایی دارد؛ خیلی از هزینه های زندگی به ما برنمیگرده اما شما توی این دوره روی ارتقاء کیفیت زندگی خودتان سرمایه گذاری می کنید. از امروز شروع کنید و روی رشد خودتان و مهارتتان سرمایه گذاری کنید. هر چیز ارزشمندی می‌خواهید به دست بیاورید باید ابتدا بهای آن را بپردازید.

جلسات دوره

۱Wellcome Wellcome
۴
دانلود ویدیو
۲What is React.js
۱۰
دانلود ویدیو
۳Install React.js
۱۱
دانلود ویدیو
۴What is package.json file
۸
۵React source files
۱۱
۶Separation of componnet
۱۴
۷Component in React.js
۱۰
۸CourseCard componen markup
۹
۹Extract CourseList Componnet
۱۲
۱۰Render list in React.js
۱۱
۱۱JSX in React.js
۱۲
۱۲props in React.js
۱۴
۱۳Extract CourseCard component
۱۲
۱۴Key in React.js
۹
۱۵Dynamic className in jsx
۷
۱۶Header and Footer component
۷
۱Tab component markup
۱۰
۲Events in React way
۱۰
۳What is State in React.js
۵
۴Creating state in useState
۱۲
۵Do NOT mutate state in React.js
۱۲
۶Adding another state in React.js
۹
۷Update state based on previous state
۷
۸NoteApp project introduction
۵
۹NoteApp structure for component
۸
۱۰Building Form and handling submission
۷
۱۱Controlled component in React.js
۱۲
۱Thinking in React.js
۸
۲State management in React.js
۱۰
۳Lifting state up
۱۰
۴Update lifted state in parent
۸
۵NoteList markup
۸
۶Deleting note from child component
۱۸
۷Toggle note to complete
۱۲
۸NoteStatus component
۸
۹Sort notes
۲۰
۱۰children prop
۱۲
۱۱Accordion component V1
۱۹
۱۲Dynamic style in chevron
۱۲
۱۳Accordion componnet V2
۱۷
۱Overview
۶
۲How to split component
۹
۳CharacterList and Navbar component
۱۸
۴CharacterDetail component
۱۴
۵Component categories
۴
۶props drilling
۱۲
۷Component composition
۱۱
۸Pure component
۱۲
۹Render logic in component
۲۲
۱Overview
۲
۲How react re-renders component
۸
۳Pure component
۱۲
۴Rules of render logic
۲۲
۵State update batching
۱۲
۱Overview
۳
۲Component lifecycle
۸
۳How to NOT fetch data in React.js
۱۰
۴useEffect hook introduction
۱۰
۵Async await in useEffect
۷
۶Adding loading state in React.js
۹
۷Error handling
۱۸
۸Error handling in axios
۱۰
۹Dependency array in useEffect
۱۷
۱۰Search in characters based on query
۱۵
۱۱Select a character
۹
۱۲Fetch a single character
۲۱
۱۳Load episodes
۱۳
۱۴Add character to favourite list
۱۲
۱۵Clean up function
۱۶
۱۶Clean up data fetching
۱۵
۱۷Sort episodes
۸
۱۸Modal component
۸
۱۹Remove item from favourite list
۱۶
۲۰Save Favourite list in LocalStorage
۱۰
۱Overview
۱
۲Main React Hooks
۸
۳Rules of React Hooks
۱۲
۴useRef in React
۸
۵Dom Manipulation using useRef
۲۲
۶Persis data between renders
۱۴
۷Timer challenge with useRef
۱۴
۸forwardRef in React
۱۸
۹Custom Hooks in React
۷
۱۰Create useCharacter Custom Hooks
۹
۱۱Create useLocalStorage Custom Hook
۱۱
۱۲useReducer Count Example
۲۵
۱۳useReducer NoteApp Example
۱۸
۱۴useReducer fectch Example
۱۳
۱۵useContext theme Example
۲۰
۱۶Advanced pattern for useContext
۱۴
۱۷Mutli Context in App
۱۴
۱۸Combine context and useReducer
۱۴
۱Overview
۲
۲Adding Routes on App
۱۰
۳Link and NavLink component
۸
۴Nested Routes
۱۲
۵More on Nested Route
۹
۶Dynamic Route
۱۵
۷SearchParams
۱۷
۸useNavigate Hook
۱۵
۹Navigate Component
۸
۱Overview
۹
۲Header SearchItems
۱۲
۳Search options dropdown
۱۱
۴Operation on option
۱۲
۵useOutsideClick Hook
۱۲
۶Date Range
۱۰
۷LocationList Component
۱۰
۸Install json-server
۸
۹setSearchParams and nvaigate to hotels
۱۲
۱۰Create nested route on hotels
۷
۱۱Filter based on SearchParams
۱۵
۱۲Search Result Item
۱۲
۱۳Create Hotel Provider
۷
۱۴Show hotel on map
۱۲
۱۵Sync map center with latitude and longitude
۱۲
۱۶useGeolocation hook for detect user location
۱۹
۱۷Single hotel view
۸
۱۸Current hotel as Context
۱۴
۱۹Event click on map
۱۴
۲۰Add bookmark context
۱۳
۲۱Bookmark list
۱۰
۲۲Current bookmark
۱۳
۲۳Add new bookmark
۱۱
۲۴Fetch location data
۱۹
۲۵Create new bookmark
۱۹
۲۶Delete bookmark
۱۱
۲۷Advanced pattern for context and useReducer on Async actions #1
۱۶
۲۸Advanced pattern for context and useReducer on Async actions #2
۱۶
۲۹Fake Auth provider
۱۱
۳۰Implementing login and logout
۱۵
۳۱Protected Route
۱۱
۱Overview
۱
۲State Managment methods
۱۰
۳Redux principles
۷
۴Adding first reducer
۱۱
۵useSelector and useDispatch
۱۲
۶Action creator and action types
۶
۷Multi state in redux store
۱۰
۸Reducer on Async actions
۱۱
۹Action creator on async action
۱۹
۱۰Load async data in component
۷
۱۱Redux devtool extention
۹
۱Overview
۱
۲Local (client) state in redux-toolkit
۱۹
۳Async (Remote) state in redux-toolkit
۱۷
۴Emit Async actions
۶
۵TodoSlice
۱۶
۶TodoSlice action for local state
۱۲
۷getAsyncTodo
۱۴
۸addAsyncTodo
۸
۹Toggle and Remove asyncTodo
۱۳
۱Overview
۶
۲Run backend project
۸
۳user authentication in postman
۱۵
۴refresh token and access token approach
۹
۵Create project and proposal
۱۶
۶Install tailwindCSS
۱۰
۷Add color to tailwindCSS
۱۷
۸authentication scenario
۱۰
۹Feature based folder structure
۱۵
۱۰SendOTP form
۱۶
۱۱Customzie tailwind class
۷
۱۲CheckOTP markup
۱۷
۱۳HttpService module
۱۰
۱۴sendOTP handler
۱۵
۱۵Mutate getOTP
۱۲
۱۶Mutate check OTP
۱۷
۱۷Resend OTP
۱۶
۱۸Edit PhoneNumber
۷
۱۹Complete profile form
۹
۲۰RadioInput Component
۶
۲۱Complete profile
۸
۲۲push user after complete profile
۱۰
۱AppLayout
۱۱
۲useUser Hook
۱۲
۳Owner sidebar
۱۷
۴useOwner Projects
۸
۵ProjectTable V1
۱۳
۶Utils function
۸
۷Compound componnet on Table
۱۳
۸Modal markup
۱۴
۹Confirm Delete Componnet
۱۵
۱۰useRemvoe Projects
۱۸
۱۱useOutsideClick hook
۱۲
۱۲Introducing React Hook Form
۱۰
۱۳TextField with React Hook Form
۱۷
۱۴Apply React Hook Form on all forms
۲۰
۱۵Select Option,Tags and DatePicker Component
۱۶
۱۶useCategories hook
۸
۱۷Create New Project
۱۱
۱۸useEditProject
۱۶
۱۹Toggle Project Status
۱۸
۱AppHeader
۱۱
۲User Logout
۱۲
۳Adding Dark Mode on Application
۱۸
۴useLocalStorageState
۱۹
۵Dynamic App Layout
۱۲
۶Owner Dashboard
۹
۷Stat Component
۱۵
۱Freelancer Layout
۷
۲Freelancer Stats
۱۷
۳ProposalTable
۱۰
۴ProjectList (لیست پروژه های کارفرما ها)
۱۵
۵Create Proposal Form
۱۱
۶useCreateProposal
۱۵
۷Filter Drop Down (فیلتر داده ها به کمک کوئری استرینگ)
۱۳
۸Filter Component (فیلتر داده ها به کمک کوئری استرینگ)
۱۶
۹Query String For Filtering Data
۱۵
۱۰Convert Query String to Quer Object
۵
۱۱useAuthroize (بررسی سطح دسترسی کاربر)
۱۹
۱۲Protected Route (ایجاد گارد بر اساس نقش کاربر)
۸
۱Overview
۲
۲Admin Layout
۷
۳Admin Dashboard
۹
۴UsersTable
۱۰
۵useChangeUserStatus
۱۵
۶Projects and Proposals Route
۵
۷Fix minor bugs
۷
۱متغیرهای محیطی چیست ؟ کاربردشون چیه؟
۹
۲جدا کردن فایل env از سورس کد
۷
۳متغیر node_env چیه ؟ کاربردش چیه؟
۴
۴ایجاد متغیرهای محیطی در ریکت
۵
۱بررسی مشکلات سئو در اپلیکیشن های ریکت
۱۴
۲رندر سمت سرور (SSR) چیست و اهمیت آن
۱۱
۳بررسی مفهوم داینامیک رندرینگ (DR)
۱۳
۱معرفی پروژه و نصب ریکت و تیلویند
۹
۲بررسی ساختار کامپوننت های برنامه
۱۰
۳ایجاد فرم اضافه کردن دسته بندی
۱۲
۴ایجاد استیت برای دیتای دسته بندی
۸
۵اضافه کردن دسته بندی جدید
۷
۶ایجاد فرم اضافه کردن محصولات
۹
۷ایجاد استیت برای دیتای محصول
۹
۸اضافه کردن محصول جدید
۷
۹نشان دادن لیست محصولات
۷
۱۰حذف محصولات - نشان دادن عنوان دسته بندی
۹
۱۱سرچ بر روی محصولات
۱۱
۱۲مرتب سازی (sort) محصولات
۱۰
۱۳ایجاد توابع search و sort
۱۲
۱۴ذخیره سازی دیتاها در لوکال استوریج
۱۱
۱۵فیلتر بر اساس دسته بندی
۱۳
۱what is webpack and babel
۱۴
۲adding gitignore and run scripts
۵
۳compile javascript with babel in project
۶
۴adding webpack to Application
۸
۵adding webpcakc.config.js file
۸
۶adding babel in webpack
۱۲
۷adding css and style loader
۹
۸adding webpack devServer
۶
۹minimizing and uglifying code
۶
۱۰چرا لازمه اپلیکیشن های ریکت (CRA) کانفیگ بشه؟
۹
۱۱نصب ریکت با webpack - babel
۱۸
۱۲اضافه کردن لودرهای css - image
۵
۱۳تغییر ساختار برنامه
۶
۱۴ایجاد تنظیمات جداگانه webpack بر اساس فاز توسعه و تولید
۱۹
۱۵اضافه کردن react-refresh به برنامه
۷
۱۶اضافه کردن prettier - eslint
۴
۱۷استفاده از CRACO برای کانفیگ CRA
۱۳
۱۸ایجاد react-scripts fork
۶
۱۹publish custom CRA on NPM
۱۱
۲۰استفاده از CRA کاستوم خودمان
۶
۱دیپلوی اپلیکیشن های ریکت روی vercel netlify
۲۰
۲دیپلوی روی سرورهای مجازی
۲۰
۱دوره در مسیر فریلنسری و گیت هدیه دوره ریکت هست و همه مباحث فریلنسری کامل ارائه شده.
۲۰۰

سوالات متداول

بله قطعا. این دوره در تابستان ۱۴۰۲ به صورت کامل بر اساس ریکت ۱۸ و ریکت روتر دام ۶ ضبط مجدد شده است.

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

یکی از مزیت های این دوره جدا از سرفصل های جامع، تدریس مباحث پیشرفته هم چون Redux, Redux-thunk. Redux-saga, Context, کار با دیتابیس و API بک اند Redux-toollkit, custom hooks, بهینه سازی ریکت و اعتبار سنجی فرم هاست.

ریکت یک طرز فکر مبتنی بر جاوااسکریپت است و اگر شما بتونید اون چیزی که بهتون میگم رو خوب درکش بکنید، قطعا برای استخدامی مشکلی نخواهید است. چون نحوه کدنویسی پروژه دقیقا مشابه یک پروژه واقعی است.

۲,۹۸۹,۰۰۰
صاحب محمدی

صاحب محمدی

مدرس دوره

داستان برنامه نویس شدن من برمیگرده به سال 93. همون موقع که برای پروژه های دانشگاه (رشته مهندسی نفت) برنامه نویسی میکردم. کم کم با MATLAB آشنا شدم و بعدا وارد حوزه برنامه نویسی وب شدم و الان حدود 7 ساله که شغل تخصصی من برنامه نویسی وب هست. علاقه من جاوااسکریپت و خاندانش است. به همین دلیل فرانت هوکس رو بنا کردم تا تجربه چند ساله رو در قالب دوره های پروژه محور به علاقه مندان این حوزه انتقال بدم ☘️🤍.

میتوانید دیدگاه خود را ثبت کنید