آموزش ReactJs ورژن 16
سلام دوستان.در این دوره قصد داریم ReactJs رو به شما آموزش بدیم.ReactJs اساسا یک کتابخانه open-source جاوا اسکریپته که برای ایجاد رابط کاربری مخصوصا برای برنامه های تک صفحه ای مورد استفاده قرار میگیره. این کتابخونه برای مدیریت لایه های نمایشی برنامه های تحت وب و تلفن همراه استفاده میشه.همچنین ReactJs این امکان رو به شما میده تا کامپوننت هایی طراحی کنید که در بخش های مختلف پروژتون قابل استفاده باشه(reusable UI components).
ReactJs این امکان رو به توسعه دهنده ها میده تا وب اپلیکیشن های بزرگ و پیچیده که داده ها رو بدون بارگزاری مجدد مدیریت میکنند ، بسازند.هدف اصلی ReactJS سادگی،سرعت و مقیاس پذیری است که در رابط کاربری برنامه عمل میکنه.ReactJS با ترکیب با کتابخونه ها و فریمورک های دیگه جاوا اسکریپت مثل AngularJs در MVC استفاده میشه.برای آشنایی بیشتر با ReactJS میتونید مقاله ReactJs چیست رو مطالعه کنید. در ضمن از آخرین درس میتونید دوره رو به صورت یکجا و در یک فایل زیپ دانلود کنید.
توجه داشته باشید که این دوره به صورت مقدماتی و فقط مفاهیم پایه react js و مورد نیاز react native آموزش داده شده است.به زودی آموزش پروژه محور react در سایت قرار خواهد گرفت.
پیش نمایش آموزش ReactJs(ویدئو معرفی)
ویژگی های دوره
- درس 12
- آزمونها 0
- مدت زمان 72دقیقه
- سطح مهارت مقدماتی
- زبان فارسی
- دانشجو 3496
- ارزیابی بله
90 نظر
سلام بسیار عالی
سلام ،خیلی خوشحالیم که این دوره براتون مفید بوده
موفق باشید
با سلام و خسته نباشید.
من یه قالب html دارم حالا میخوام این قالب رو به react تبدیل کنم و برای همین اومدم و این قالب رو به کامپوننت های کوچکتر تبدیل کردم و همچنین لینک هم شدن به هم.اما مشکلی که هست اینه که میخوام برای هر صفحه css,js های خودش لود بشه.ویا اینکه من بتونم همه ی این استایل ها و js ها رو به نحوی بشناسونم که در تمام صفحات کار کنه.من الان اومدم و همه ی فایل ها رو به فایل ایندکس الحاق کردم و وقتی توی صفحه اصلی هستم همه چی درست نمایش داده میشه اما وقتی روی یه لینک کلیک میکنم و صفحه بدون رفرش جابجا میشه دیگه تس ها کار نمیکنن اما اگه توی همین صفحه جدیدی که الان رفتم رفرش کنم بازم مجددا بیشتر فایل ها شناخته میشن و سایت کار میکنه تا حدودی.از چه طریقی میتونم فایل های css,js قالبم رو به ری اکت بشناسونم؟چون قالب پیچیده هستش امکان اینکه بیام از صفر کد بزنم تقریبا نشدنیه چون وقتم محدوده.ممنون میشم کمکم کنید
شما باید از webpack استفاده کنید و داخل هر کمپوننت فایل sass داشته باشید و این فایل را داخل فایل js ایمپورت کنید.
اخه چجوری ازتون تشکر کنم
ممنون که در کنارمون هستین ،کامنت های پرانرژی شماس که به ما روحیه کار بیشتر میده
سلام
با تشکر از تمام زحمات استاد عزیر.
از خدا برای شما سلامتی و عمر با عزت میخوام .
سلام.خیلی ممنون از انرژی مثبتتون
موفق باشید
این react رو کامل آموزش میده؟؟؟؟
سلام ، آموزش مقدماتی هستش و سرفصل های اون رو میتونید از قسمت برنامه تحصیلی مشاهده کنید ، درحال آماده سازی یک دوره پروژه محور نیز هستیم ، موفق باشید
سلام خسته نباشید
دوره ی پروژه محودتون تقریبا کی آماده میشه؟
سلام سلامت باشید ، در حال حاضر داریم دوره 100 قسمتی react native رو اماده میکنیم(این دوره اموزشی به صورت جامع ، پروژه محور هستش و به زودی حدااقل تا یک هفته اینده منتشر میشه) و انتشار دوره پروژه مجور react مشخص نیست متاسفانه . موقق باشید
من از دوره ها استفاده کردم . بسیار بسیار مفید بود . واقعا تشکر .هم بخاطر رایگان بودنش و هم بخاطر پشتیبانی قوی که انجام میدید
ممنون از شما کاربر عزیز بابت روحیه ای که به تیم ما میدین
سلام
آیا امکانش هست آموزش ارتباط ووکامرس با react native در سایت قرار بدید.
اپ های اماده ای هست که بصورت اختصاصی فروشگاه با ووکامرس نوشته شده و براحتی میشه ازشون استفاده کرد
ممنون میشم در این خصوص هم فیلم آموزشی تهیه کنید
مرسی از سایت خوبتون
سلام.این مورد رو بررسی میکنیم اگه درخواست بقیه کاربران هم باشه در برنامه آموزشمون قرارش میدیم.
موفق باشید
سلام
من دوره های خارجی زیادی رو دیدم اما این دوره یه چیز دیگه بود و چیزای تازه ی زیادی یاد گرفتم
ممنون از زحماتتون
درخواست داشتم ادامه بدید و ادامه مباحث پیشرفته ی React رو هم بذارید
به عنوان مثال یه مشکلی که دارم بحث پیاده سازی Authentication در React هستش
من می خوام بدون استفاده از JWT و تنها با استفاده از Ajax این کار رو انجام بدم ولی هنوز موفق نشدم
ممنون می شم کمک کنید
سلام.خیلی عالی که این دوره براتون مفید بوده.
در برناممون هست که یک دوره آموزش پروژه محور React ضبط کنیم.ولی هنوز زمانش مشخص نیست
سلام خسته نباشید
من هنگام نصب react به مشکل خوردم
این پیغام رو میده :
mahdi-Air:~ karimi$ npm install -g create-react-app
npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules
npm ERR! path /usr/local/lib/node_modules
npm ERR! code EACCES
npm ERR! errno -13
npm ERR! syscall access
npm ERR! Error: EACCES: permission denied, access ‘/usr/local/lib/node_modules’
npm ERR! { Error: EACCES: permission denied, access ‘/usr/local/lib/node_modules’
npm ERR! stack: ‘Error: EACCES: permission denied, access \’/usr/local/lib/node_modules\”,
npm ERR! errno: -13,
npm ERR! code: ‘EACCES’,
npm ERR! syscall: ‘access’,
npm ERR! path: ‘/usr/local/lib/node_modules’ }
npm ERR!
npm ERR! Please try running this command again as root/Administrator.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/karimi/.npm/_logs/2018-05-18T11_27_57_886Z-debug.log
ممنون میشم راهنمایی کنید / با تشکر
سلام.
CMD رو بصورت run as adminstrator اجرا کنید
سلام
بنده تو ترمینال مک این کار رو دارم انجام میدم
از کد
npm sudo create-react-app my-app
استفاده کنید
ممنون استاد. فقط کاش سطح پیشرفته رو هم آموزش بدید.
خواهش میکنم.
در برناممون آموزش دوره پیشرفته React Js هست .ولی زمان ضبط و انتشار هنوز مشخص نیست.در کانال تلگراممون عضو بشید تا از زمان انتشار آگاه بشید.
سلام
میشه بدون یادگیری react یادگیری reactnative رو شروع کنیم؟
سلام.
شما برای یادگیری React Native باید با React Js آشنا باشید.چون React Native از ساختار React Js استفاده میکنه و بدون درک ساختار،نمیشه با یک فریمورک کار کرد
سلام خسته نباشید
محتوای index.js به صورت پیش فرض
import React from ‘react’;
import ReactDOM from ‘react-dom’;
import ‘./index.css’;
import App from ‘./App’;
import registerServiceWorker from ‘./registerServiceWorker’;
export * from’./tableRow’;
ReactDOM.render(, document.getElementById(‘root’));
registerServiceWorker();
بود که من
export * from’./tableRow’;
ایتو اضافه کردم
ولی نمی تونه کامپایل کنه و خطای
./src/index.js
Module not found: Can’t resolve ‘./tableRow’ in ‘D:\project\reactjs\src’
میدهد فایل index.js پاک کردم و فقط اینو نوشتم
export * from’./tableRow’;
ولی باز همین خطا را میدهد
چی کار می تونم بکنم
سلام.شما اصلا فایلی به نام tableRow.js دارید و اینکه کامپوننت رو export کردید.
توجه داشته باشید که وقتی از * برای export استفاده میکنید باید حتما کلاس رو بصورت {} export کنید
ببخشید ولی متوجه نشدم یعنی الان چه تغییری باید بدم؟
شماب ابتدا باید یک فایل به نام tableRow.js داشته باشید و همچنین برای exportگرفتن باید بصورت زیر عکل کنید
class ExampleComponent extends component{
}
export{ExampleComponent}
خوب منم طبق اموزش از همین روش پیش رفتم
import React,{component} from ‘react’;
class TableRow etends component{
render(){
return(
{this.props.stateName.id}
{this.props.stateName.name}
{this.props.stateName.age}
)
}
}
export {TableRow}
که به خطا خوردم
شما از tr و td اصلا استفاده نکردید.بخاطر همین error دارید.باید این props ها داخل یک تگ قرار بگیره
نه مشکلشو فهمیدم فایل index.js باید بسازیم و از فایل index.js خودش که برامون ساخته استفاده نکنیم :)))))
فقط نمی دونم چرا چیزی نشون نمیده درصورتی که تو ویدیو دیگه state ,props ها را نشون میدعه
سلام .
مطمئن بشید که propدارای محتوا است و اون رو به کامپوننت پاس دادید.
سلام
چرا تو ویدیو4 که قسمت کامپونت ها هست من وقتی سیو می کنم توی مرورگر چیزی نمیاد و یه صفحه سفید نشونم میده
در صورتی که عیناا مثل شما نوشتم و چندبار چک کردم
سلام
تشکر میکنم از آموزش های خوب شما و از سایت خوبتون . یه خواهشی داشتم . اگه ممکنه دوره پیشرفته react js رو هم بزارید . واقعا عالی میشه .
سلام.ممنون
در برنامه آموزشیمون هست و در آینده نزدیک قرارش میدیم
سلام
دنبال آموزش reactبودم که به این سایت رسیدم بعد دیدن چنتا از ویدیوهاتون متوجه شدم بچه ها دانشگاه خودمونین
موفق باشین به امید کسب موفقیت های بیشتر
مرسی ، شماهم موفق باشی ، البته از بچه های دانشگاه بودیم الان دیگه نیستیم 🙂
سلام
خیلی ممنون از آموزشهای خوبتون
سوالم اینه که آیا بهتره که من از react در asp.net core استفاده کنم یا اینکه پروژه react جدا باشه و با api کار کنم ؟
react در asp.net core چه مزیتهایی یا چه معایبی نسبت به پروژه react ی داره که با api کار میکنه داره؟
سلام.
ممنون از لطفتون
در واقع شما با react فقط بر لایه V یعنی View تمرکز دارید و فقط میتونید رابط کاربری رو طراحی کنید.و شما اطلاعاتی دریافتی از سرور رو باید با استفاده از Api دریافت و نمایش بدید.
سلام .برای استفاده از فیلم ها باید چیکار کرد؟اینجا که ناقصن.از ۱۲قسمت فقط ۳ تاش فعاله.ممنون میشم که راهنمایی کنید.
سلام.
3 قسمت بصورت پیش نمایش است و برای مشاهده مابقی ویدئوها کافیه که ثبت نام کنید.
موفق باشید
خیلی عالی . ممنون . آموزش های پروژه محور و واقعی بیشتری تولید کنید. سپاس
ممنون مهدی عزیز ، البته که همینطوز هست و در حال آماده سازی چندین دوره هستیم و در نظر داریم بعد از اتمام این دوره ها ، دوره پروژه مجور reactjs هم آماده کنیم ،ممنون از پیشنهادت و موفق باشی همیشه
سلام . ایا میشه از react js مثل jquery در صفحاتphp استفاده کرد و اطلاعات به صورت ایجکس بفرستیم و بگیریم ؟ یا همون جی کوئری راحتتره ؟
سلام –
اول تشکر ویژه کنم از سایت بسیار خوبتون
میخواستم بدونم الان با اومدن اموزش جامع react native ایا بازم نیازه که مطابق چارت اموزشی پیش بریم یا نه همون دوره es6 رو بگذرونیم و بعدش بریم دوره جامع react native کافیه ؟؟؟ کدومشو توصیه میکنید ؟؟
سلام حامد عزیز.
ممنون از لطفت
شما باید ابتدا دوره es6 و reactjs رو مشاهده کنی و بعدش میتونی دوره جامع رو شروع کنی و با قدرت بیای سمت react native دوست داشتنی
با سلام
آقا یه سوال؟؟
react با jQuery تداخل داره؟؟
سلام
میتونید با هم استفادش کنید ولی بهتره که اینکار رو نکنید.
علت استفاده نکردن Jquery با React
نحوه استفاده react با jquery
سلام
من nodejs نصب کردم و حتی تا مرحله نمایش در لوکال هاست و کمی کد زنی در فایل app.js هم پیش رفتم ولی روز بعد که اومدم ادامه بدم، لوکال هاست نمایش داده نمیشد… من قبلا با لوکال هاست آشنا بودم و از Wamp و Xampp استفاده میکردم ولی این چون نرم افزاری نداره نمیتونم الان به نود جی اس ادامه بدم…. لطفا راهنمایی نمایید.
باتشکر
سلام.
برای React راهنمایی میخواین یا React Native؟؟
سلام و عرض خسته نباشید
من دوره رو گرفتم و دارم نگاه می کنم. می خواستم یه تشکر ویژه بکنم برای آموزش هاتون
دوم اینکه آموزش پیشرفته که گفته بودید شروع شده؟ تاریخ مشخصی داره یا نه؟
سلام امیدوارم حالتون خوب باشه ، دوره پروژه محور داره مراحل ضبط ویدئو خودش رو طی میکنه و خب طبیعتا درک میکنید که برای یه دوره کامل و خوب باید مدرس ساعت ها زمان بزاره تا بتونه بهترین کیفیت رو به کاربران ارائه بده ، احتمالا تا یک ماه آینده منتشر بشه ، روز فوق العاده ای داشته باشید
بسیار عالی. اینکه خلاصه و مفید اموزش میدین عالیه.
و مرسی بابت اینکه علمتونو انتشار میدین
ممنون از لطفتون و انرژی مثبتی که به ما میدید
erfanalinaghiyan با chmod دسترسی بده که بتونه نصب کنه ماژول هاتو
سلام
خواستم تشکر کنم ازتون. برای هر مبتدی که بخواد ری اکت رو شروع کنه واقعا خیلی مفیده.
سلام به شما وقتتون بخیر ، این دوره کاملا مقدماتی و برای مبدتیان هست و هنوز دوره پروژه محورمون منتشر نشده ، خیلی ممنون که بهمون انرژی مثبت میدین
سلام من میخوام ری اکت نیتیو کار کنم و تا حدی هم باهاش کار کردم
الان من این دوره ری اکت جی اس شما رو ببینم برای ری اکت نیتیو کافیه یا باید دوره های دیگه ای از ری اکت جی اس رو هم ببینم
سلام رضا عزیز
برای کارکردن با ریکن نیتیو تماشای همین دوره کافیه و میتونی با قدرت به سمت react native بری و از کارکردن با این فریمورک دوست داشتنی لذت ببری
ممنون تشکر که سریع جواب دادین
حقیقتش من اصلا ری اکت نیتیو دوست ندارم اصلا مشخص نیست چی به چی شرکت مجبورم کرده بیام سمت ری اکت نیتیو
من جاوا و کاتلین بیشتر دوست دارم و اگر هم بخوام کراس پلتفرم کار کنم فلاتر رو ترجیح میدم ایشالا گوگل یک api میده برای کاتلین که بشه ios هم زد از شر این ری اکت نیتیو و فلاتر راحت بشیم
رضای عزیز اگه به کاری علاقه نداری پس لطفا اون کارو شروع نکن ، چون شما وقتی با این دید منفی به سراغ ری اکت نیتیو میای طبیعتا فقط چالش هارو میبینی و اون همه مزیت فوق العاده ای که داره رو کنار میزاری ، ما در reactapp به هیچ عنوان تعصبی بر روی زبان یا فریمورک خاصی نداریم و از شماهم میخوایم که به دنبال علاقه خودتون برید ، اگه شما فکر میکنید فلاتر خیلی قدرتمند تر هست و حالا نظرتون بر روی کاتلین هستش این وظیفه شما هست که شرکت رو مجاب کنید تا از پیشنهاد های شما استفاده کنند و یک سری دلیل بیارید تا اونها قانع بشن ، حتما شرکت دلایل خودش رو برای استفاده از ری اکت نیتیو داره که به شما اون رو پیشنهاد میده ، من بازهم نظرم این هست که علاقه خودتون رو انتخاب کنید . امیدوارم موفق باشید
سلام وقت بخیر
بعد درست کردن ری اکت با create-react-app و ساختن کامپوننت و ساخت یک پروژه ی ری اکت
حال من چجوری این رو ادیت کنم(تو ورژن 15 یه فایل bundle.js میساختی و خب اونو با index میذاشتی تو هاست و یا ارسال برا رزومه و…)
تو ورژن جدید باید کدو فایل یا فایلا رو بذاریم؟
چون میخام حالت |روژه ای بذارم و خب طبیعتا node modules نباید فرستاده شه
ممنون میشم کمک کنید
سلام با معذرت دکمه بنام ثبت نام دوره چیست در کنار کلمه رایگان کنجکاو شدم
سلام.امید عزیز.
این دوره رایگان هست ولی برای اینکه به محتوای دوره دسترسی داشته باشی باید ثبت نام کنی.
با سلام و تشکر از شما بابت ارائه این مجموعه ی آموزشی رایگان
سئوالم اینه که آیا این دوره به پایان رسیده؟ یا قرار هستش تکمیل بشه؟
منظورتون از دوره مقدماتی چی هستش؟ می تونید بفرمایید که چه مباحثی از ری اکت باقی مانده که نگفتید هنوز؟
اما من در خواست دارم تا این دوره که مربوط به درس میشه رو کامل بفرمایید، و تمام مباحث اولیه اعم از مقدماتی و پیشرفته رو توضیح بفرمایید، سپس در انتهای کار هم چند پروژه کوچک را با ری اکت اجرا کنید.
اما برای پروژه بزرگتر اینکه ی دوره مجزا درست کنید قابل درک هستش.
سپاس از شما
سلام.ممنون از لطفتون
این یک دوره مقدماتی برای افرادی هست که قصد دارند کار با React Native رو شروع کنند و این دوره به اتمام رسیده.
در حال ضبط یک دوره پیشرفته با React js هستیم که به زودی در سایت منتشر خواهد شد
لطفا اگر دوره به اتمام رسیده امکان دریافت یکجا را قرار دهید.
با سلام.دوره به اتمام رسیده اما امکان دانلود یکجا برای دوره های غیر رایگان وجودددارد و برای دوره های رایگان باید درس ها را به صورت تکی دانلود کنید
با سلام
منم همین رو گفتم که وجود نداره، لطفا ایجادش کنید، رحمت بدنبال داره برای همه، از جمله من و شما و آن دوست ِ دِگَر هم …
سلام چرا اینقدر سر فصل ها کمه
سلام مهرداد عزیز.
این دوره مقدماتی هستش و برای کسایی که قصد ورود به دنیای react native رو دارند.تهیه شده.دوره پیشرفته به زودی در سایت منتشر خواهد شد
اگه حدودی تاریخ انتشار دوره پیشرفته رو بگید ممنون میشم
هنوز به صورت قطعی مشخص نیست ولی در سال آینده خواهد بود
,و سوال اخر بک اند وبسایت شما با چه زبانی نوشته شده؟
php
سلام. آموزش های پروژه محور این دوره شروع شده؟
سلام.
در حال برنامه ریزی و ضبط است
سلام اگه میشه کل قسمت هارو توی یه فایل زیپ بذارید برای دانلود
سلام مهرداد
سعی میکنیم چند روز آینده این امکان رو برای تمامی دوره ها فراهم کنیم ، البته اکثر دوره ها این قابلیت رو دارن
موفق باشی
مجددا سلام ، این امکان برای همین دوره و دوره native base فراهم شد ، موفق باشید
با سلام
من قسمت اخر (آشنایی با key) را نمی توانم دانلود کنم و با اینکه لاگین هستم پیام ابتدا ثبت نام کنید به من میده لطفا راهنمایی کنید
با سلام.بعد از لاگین لازم است که برای هر دوره ثبت نام کنید تا به محتویات و درس های اون دوره دسترسی پیدا کنید
با سلام
دوره پروژه محور کی آماده میشه؟
سلام حمید عزیز.
انشالله در سال جدید منتشر خواهد شد
سلام، خسته نباشید. من بعد از ورود به سایت نمی تونم این دوره رو دانلود کنم. با پیغام این دوره برای شما قفل است مواجه میشم.
سلام مهرداد عزیز
شما باید در دوره ثبت نام کنید تا مشکلتون رفع بشه
اگه دفت گنید دکمه ثبت نام سایت رو خواهید دید ، اگر باز هم مشکل دارید لطفا با آیدی پشتیبانی تلگرام در ارتباط باشید تا سریعا رسیدگی بشه
id:
alirezabakamal
سلام
مشکل این کدها چیه که کامپوننتی که نوشتم اجرا نمیشه؟
باتشکر
import React, { Component } from ‘react’;
import logo from ‘./logo.svg’;
import ‘./App.css’;
class App extends Component {
render() {
return (
);
}
}
class App1 extends Component {
render() {
return (
header
);
}
}
export default App;
سلام.
در return شما باید حتما یک مورد رو برگردونید و اینکه اگر header یک کامپوننته باید حتما داخل تگ باشه