آموزش کتابخانه‌های پرکاربرد React.js مناسب بازار کار
در دوره آموزش کتابخانه ری اکت React.js سبزلرن شما به‌صورت کاربردی با Axios ،Formik ،React Query ،Recharts و ابزارهای دیگر همراه با پروژه‌های عملی آشنا می‌شوید.
توضیحات
دوره آموزش کتابخانه ری اکت با هدف آشنایی با ۲۰ کتابخانه پرکاربرد این اکوسیستم طراحی شده تا بتوانید سرعت و کیفیت توسعه پروژه‌های خود را افزایش دهید و پروژه‌ها را با کیفیت بهتری توسعه دهید. اگر با "ReactJS" آشنا هستید، این آموزش کتابخانه‌های React.js به شما کمک می‌کند با کاربرد کتابخانه‌های این فریمورک بیشتر آشنا شوید و مهارت‌های خود را تقویت نمایید. این کتابخانه‌ها برای ساخت فرم‌های پیچیده، ارسال درخواست به سرور، پیاده‌سازی اسلایدر و ایجاد نمودارهای مختلف کاربردی هستند.
سطح دوره: پیشرفته و مناسب توسعه‌دهندگان آشنا با React
روش آموزش: پروژه‌محور همراه با تمرین عملی و مثال‌های کاربردی
تعداد کتابخانه‌ها: ۲۰ کتابخانه کاربردی
پشتیبانی دوره: رفع اشکال و پاسخ به سوالات رایگان و به‌صورت نامحدود
مناسب برای افراد: مسلط به جاوااسکریپت و فریمورک ری اکت، علاقه‌مندان به توسعه فرانت‌اند
در دوره آموزش کتابخانه ری اکت چه چیزهایی یاد می‌گیریم؟
نحوه کار با ابزارهای مکمل این کتابخانه و استفاده از آن‌ها در پروژه‌های عملی از جمله مطالب دوره آموزش کتابخانه ری اکت سبزلرن است. مباحث دوره آموزش کتابخانه‌های React.js شامل پیاده‌سازی قابلیت‌هایی مانند فرم‌های پیشرفته، اسلایدر، نمودار، درخواست‌های HTTP و پیام‌های تعاملی است. همچنین با مطالعه مستندات فنی کتابخانه‌ها، مهارت انتخاب ابزار مناسب را تقویت می‌کنید تا با کاهش کدنویسی تکراری، سرعت توسعه و نگهداری پروژه‌های React را بهبود دهید.
دوره آموزش کتابخانه‌های React.js پروژه محور
در این دوره پس از آشنایی با کتابخانه ReactJS و نحوه کار هریک از این کتابخانه‌های پرکاربرد، وارد فاز عملی دوره می‌شود. یعنی نحوه مطالعه مستندات فنی کتابخانه‌ها را یاد می‌گیرد و با راه‌اندازی بک‌اند ساده با "JSON Server"، تجربه عملی بیشتری به‌دست می‌آورید. همچنین در دوره آموزش کتابخانه ری اکت یاد می‌گیرید چطور با انتخاب کتابخانه مناسب، سرعت توسعه پروژه‌های مختلف را بالا ببرید بدون اینکه کدهای تکراری بنویسید.
خرید دوره آموزش کتابخانه ری اکت به چه کسانی پیشنهاد می‌شود؟
خرید آموزش کتابخانه‌های پرکاربرد React.js به افرادی پیشنهاد می‌شود که به زبان برنامه‌نویسی جاوااسکریپت مسلط هستند و می‌خواهند مهارت خود در زمینه فرانت‌اند را تقویت کنند. این دوره در واقع فرصتی برای یادگیری نحوه کار با کتابخانه‌ها است و خرید آن به افراد با شرایط زیر پیشنهاد می‌شود:
توسعه‌دهندگان React علاقه‌مند به گسترش مهارت‌های تخصصی
برنامه‌نویسان آشنا با React و نیازمند تسلط بیشتر بر کاربرد کتابخانه‌ها در پروژه‌های واقعی
افرادی علاقه‌مند به افزودن قابلیت‌های متنوع به وب‌سایت‌ها
توسعه‌دهندگان متقاضی کاهش زمان پیاده‌سازی پروژه‌های React
سرفصل‌های دوره آموزش کتابخانه ری اکت سبزلرن
دوره آموزش کتابخانه‌های React سبزلرن شامل ۱۴ ساعت ویدیوی ضبط‌شده و تمرین‌های عملی برای یادگیری کاربرد کتابخانه‌های مکمل React است. در طول دوره، پروژه‌هایی مانند Todo List با "JSON Server"، فرم ورود با "React Google reCAPTCHA"، صفحه اصلی CMS با نمودارهای "Recharts" و هدر چندزبانه با "i18next" پیاده‌سازی می‌شوند تا با نحوه استفاده از این کتابخانه‌ها در پروژه‌های واقعی آشنا شوید.
بخش دوره | توضیحات |
آشنایی با کتابخانه‌های React | شناخت کاربرد کتابخانه‌ها و نحوه انتخاب ابزار مناسب |
Lodash | آشنایی با توابع کاربردی برای ساده‌سازی کدنویسی |
Axios | ارسال درخواست‌های HTTP و انجام عملیات CRUD |
JSON Server | راه‌اندازی بک‌اند ساده برای تمرین پروژه‌ها |
Formik و React Hook Form | پیاده‌سازی و مدیریت فرم‌ها |
Yup | اعتبارسنجی داده‌های فرم |
React Google reCAPTCHA | استفاده از قابلیت کپچا در فرم ورود |
i18next | پیاده‌سازی قابلیت چندزبانه در پروژه |
Recharts | نمایش داده‌ها در قالب نمودار |
React Query | مدیریت واکشی داده‌ها و استفاده از کش |
Styled Components | مدیریت استایل در کنار کامپوننت‌ها |
استقرار پروژه | آشنایی با نحوه دیپلوی پروژه‌های React |
پیش‌نیاز دوره آموزش کتابخانه‌های ReactJS چیست؟
پیش‌نیاز اصلی دوره آموزش کتابخانه‌های ReactJS، تسلط مناسب به React و آشنایی کافی با HTML، CSS و JavaScript است. یادگیری مفاهیم پایه آموزش React و همچنین تسلط به آموزش جاوااسکریپت پیش از شروع دوره به شما کمک می‌کند مباحث کتابخانه‌های مکمل را بهتر درک کنید و از تمرین‌ها و پروژه‌های آموزشی بهره بیشتری ببرید.
مزایای خرید دوره کتابخانه‌های پرکاربرد React.js در سبزلرن
آموزش مقدماتی کتابخانه ReactJS در کنار مباحث پیشرفته و تمرین‌های عملی، این دوره را به گزینه‌ای کاربردی برای افراد تازه‌کار و توسعه‌دهندگان با تجربه تبدیل کرده است. همچنین از دیگر مزایای خرید دوره آموزش کتابخانه های ریکت می‌توان به‌موارد زیر اشاره کرد:
آموزش ۲۰ کتابخانه کاربردی در قالب یک دوره مکمل
انجام پروژه‌های عملی در هر فصل با کتابخانه‌های مختلف
یادگیری نحوه مطالعه مستندات کتابخانه‌ها
آشنایی با ابزارهای فرم، اعتبارسنجی، نمودار و درخواست‌های "HTTP"
تمرین استفاده از "JSON Server" برای پروژه‌های آموزشی
امکان دریافت پشتیبانی آموزشی و رفع اشکال به‌صورت مستمر
دسترسی نامحدود به محتوای دوره
نحوه خرید دوره آموزش کتابخانه ری اکت سبزلرن
برای خرید هر یک از دوره‌ها باید ابتدا در سایت آکادمی برنامه نویسی سبزلرن با شماره موبایل و آدرس ایمیل ثبت‌نام کنید. در صورتی که قبلا در سایت ثبت نام کرده‌اید، نیازی به این مرحله نیست و برای خرید دوره آموزش کتابخانه ری اکت فقط باید وارد حساب کاربری خود شوید و سپس مراحل زیر را به ترتیب انجام دهید:
ورود به صفحه دوره آموزش کتابخانه‌های React
انتخاب گزینه «افزودن دوره به سبد خرید» در صفحه دوره
پرداخت هزینه از طریق درگاه بانکی متصل به سایت سبزلرن
فعال شدن دسترسی به دوره پس از تایید پرداخت
پس از خرید آموزش کتابخانه‌های React.js، می‌توانید ویدیوهای آموزشی و تمرین‌های دوره را از پنل کاربری دنبال کنید و کتابخانه‌های مختلف React را به‌صورت عملی یاد بگیرید. همچنین امکان مشاهده ویدیوی آموزش رایگان دوره آموزش کتابخانه‌های پرکاربرد React.js، پیش از خرید برای آشنایی با شیوه تدریس فراهم شده است.
سوالات متداول
آیا برای شرکت در دوره آموزش کتابخانه ری اکت باید React بلد باشیم؟
بله. تسلط مناسب به React و آشنایی با HTML، CSS و JavaScript از پیش‌نیازهای اصلی دوره هستند.
آیا دوره آموزش کتابخانه‌های React.js پشتیبانی و به‌روزرسانی دارد؟
بله، یکی از مزایای دوره آموزش کتابخانه ری اکت امکان دریافت پشتیبانی آموزشی است، برای رفع اشکال می‌توانید از طریق بخش پرسش و پاسخ سایت سوالات خود را بپرسید و در اسرع وقت جواب بگیرید.
در این دوره چند کتابخانه آموزش داده می‌شود؟
در این دوره آموزش کتابخانه ری اکت که پروژه محور است شما با20 کتابخانه کاربردی React آشنا می‌شوید.
آیا در دوره آموزش کتابخانه ری اکت پروژه عملی هم انجام می‌شود؟
بله. پروژه‌هایی مانند Todo List با JSON Server، فرم ورود با reCAPTCHA، نمودارهای Recharts و هدر چندزبانه با i18next در دوره معرفی شده‌اند.
آیا دوره آموزش کتابخانه ریکت برای ورود به بازار کار مفید است؟
یادگیری کتابخانه‌های کاربردی و تمرین آن‌ها در پروژه‌های واقعی می‌تواند مهارت توسعه‌دهندگان React را تقویت کند و آن‌ها را برای انجام پروژه‌های متنوع آماده‌تر سازد.
آیا در دوره آموزش کتابخانه های ریکت سبزلرن مطالعه مستندات کتابخانه‌ها هم آموزش داده می‌شود؟
بله. یکی از اهداف دوره آموزش کتابخانه های ریکت، تقویت مهارت مطالعه مستندات است تا بتوانید کتابخانه‌های جدید را نیز مستقل یاد بگیرید.
جلسات
معرفی دوره
استفاده از React-Icons - نحوه استفاده
استفاده از React-Icons در پروژه Social Media Box
استفاده از Json-Server - نحوه استفاده
نصب و راه اندازی Json-Server - ایجاد دیتابیس
Filter کردن دیتا های Response
مرتب سازی دیتا های Response
Slice کردن دیتا های Response
پیاده سازی Relation بین Resource ها
تعیین Remote Schema
نحوه تغییر Port
نحوه Post کردن دیتا به Json-Server
نحوه حذف اطلاعات از دیتابیس Json-Server
معرفی پروژه Todolist
دریافت Todos از دیتابیس json-server و نمایش در DOM
توسعه RemoveTodo از Dom و دیتابیس json-server
توسعه قابلیت انجام Todo
توسعه قابلیت AddTodo در دیتابیس json-server
دپلوی پروژه json-server روی سرور
ساخت پروژه ری‌اکت با Vite
دپلوی پروژه ری‌اکت روی سرور
معرفی Lodash
کار با sum و sumBy
کار با متد filter
کار با متد map
کار با pick و pickBy
معرفی و نصب Axios
3 روش ارسال Get Request با Axios
ارسال Post Request با Axios
Axios کلا همینه؟ :|
ساخت Instance در Axios
Error Handling بصورت Local در Axios
ساخت Interceptor در Axios
Error Handling بصورت Global به کمک Interceptor
Folder Structure مناسب برای پیکربندی Axios
نحوه کنسل کردن Request
معرفی و نصب پکیج react-google-recaptcha
استفاده از Google reCaptcha در فرم لاگین
معرفی Formik
توسعه فرم لاگین با Formik
کامپوننت های Field و Form
اعتبارسنجی فرم در Formik
نمایش ارورها با کامپوننت ErrorMessage
استفاده از isSubmitting برای دکمه فرم
استفاده از هوک useFormik
پیاده سازی فرم درخواست با Formik
معرفی و نصب کتابخانه Yup
اعتبارسنجی فرم با Yup
دریافت ارور های اعتبارسنجی از Yup
نمایش ارور های اعتبارسنجی در Dom
تعیین Custom Error Message
استفاده از Yup در Formik - مینی پروژه نهایی
معرفی و نصب کتابخانه React-hook-form
استفاده از متد register برای init کردن اینپوتها
اعتبارسنجی فرم
تعیین Custom Error Message
استفاده از RegEx در Validation
قابلیت Devtool در React-hook-form
اعتبارسنجی کاستوم برای فرم
مقداردهی فرم از طریق سرور
استفاده از آبجکت برای مقداردهی اینپوت های فرم
استفاده از آرایه برای مقداردهی اینپوت های فرم
متد getValues در React-hook-form
استفاده از Yup در React-hook-form
معرفی و نصب کتابخانه React-i18next
initial کردن زبان های مورد نظر
ترجمه قسمت های مختلف پروژه با هوک useTranslation
استفاده از withTranslation
تغییر زبان پروژه به دلخواه کاربر
تغییر استایل های پروژه بنا به زبان انتخابی کاربر
پیاده سازی پروژه Header چند زبانه - سخن پایانی
معرفی و نصب کتابخانه Recharts
رسم نمودار خطی (Line Chart)
رسم نمودار میلهای (Bar Chart)
رسم نمودار دایرهای (Pie Chart)
رسم نمودار رادار و شعاعی (Radial - Radar Chart)
رسم نمودار قیفی (Funnel Chart)
پیاده سازی Chart در پروژه Cms - سخن پایانی
معرفی فصل و مفهوم OTP
دریافت شماره تماس کاربر و ارسال Sms به آن
دریافت کد ارسالی از کاربر
وریفای کد دریافتی از کاربر - سخن پایانی
معرفی و نصب کتابخانه React-Query
آماده سازی بک‌اند با Json-server
چالش ارسال رکوئست های بیهوده به سرور
مدیریت بهینه رکوئستها با React-query
نمایش لودینگ حین Fetch
Error Handling در React-query
آشنایی با Devtools ری‌اکت کوئری
آشنایی با Cache و کانفیگ های آن
مفهوم staleTime
کانفیگ های reFetch
ساخت Dynamic Query
ساخت تبدیل useQuery به Custom Hook
آشنایی با کانفیگ select و تغییر دادن اطلاعات دریافتی از سرور
پیاده سازی Global Configs
انجام reFetch داخل Event Handler
آشنایی با onSuccess و onError
تعیین مقدار دیفالت برای کوئری با کانفیگ initialData
پیاده سازی Pagination با React-query
کاربرد هوک useQueries
هوک useMutation و ارسال Post Request
آشنایی با قابلیت Invalidate Queries
پیاده سازی Delete Request در React-query
پیاده سازی Infinite Scroll در React-query - سخن پایانی
معرفی و نصب کتابخانه CkEditor
پیاده سازی کد ادیتور - سخن پایانی
معرفی SSO و اهمیت آن
پیاده سازی قابلیت لاگین با گوگل
Decode کردن Token جهت دریافت اطلاعات ایمیل
نمایش اطلاعات یوزر
نمایش دیفالت ایمیل های کاربر جهت لاگین - سخن پایانی
معرفی تست نویسی و مراحل توسعه نرم افزار
پیاده سازی Unit Test برای فانکشنها - قسمت اول
پیاده سازی Unit Test برای فانکشنها - قسمت دوم
فلگ Coverage در Jest - سخن پایانی
معرفی و نصب کتاب Styled-Components
استایل دهی Css in js - پیاده سازی استایل بر اساس Props
ارث بری از استایل های کامپوننت
تعیین Attribute برای کامپوننت‌ها
استفاده از Pseudo Class در Styled-Components
پیاده سازی Global Styles
توسعه پروژه با قابلیت Toggle Theme با Styled-Components
معرفی و نصب کتابخانه SWR
استفاده از هوک useSwr
سخن پایانی
معرفی و نصب کتابخانه SweetAlert
استفاده از SweetAlert - قسمت اول
استفاده از SweetAlert - قسمت دوم
استفاده از SweetAlert - قسمت سوم
استفاده از React-spinners - سخن پایانی دوره
پیش نیاز ها
پشتیبانی
این دوره مجهز به «سبزبات» ربات هوشمند مبتنی بر هوش مصنوعی است.
اگر در حین مشاهده جلسات دوره با سوال یا ابهامی مواجه شدید، می‌توانید پرسش خود را از سبزبات بپرسید و در همان لحظه پاسخ دریافت کنید. در صورتی که نیاز به توضیح بیشتر یا پاسخ تخصصی مدرس داشتید، کافی است از سبزبات بخواهید تا سوال شما را به مدرس دوره ارجاع دهد تا مستقیماً توسط مدرس پاسخ داده شود.
نظرات
سلام عزیز.
پکیج React-hook-form تو دوره تدریس شده اما Zod نه. البته سینتکس Zod مثل Validator هایی هست که تو دوره تدریس شدن و با گذوندن دوره به راحتی میتونید طرز استفاده از Zod رو از طریق داکیومنتش یاد بگیرید و اگه سوالی داشتید از طریق قسمت پرسش و پاسخ دوره با بنده در میون بذارید.
ابوالفضل جان سلام.
خیلی خوشحالم که دوره براتون مفید بوده و رضایت داشتید.
پر قدرت ادامه بدید ✌️❤️
