>> [موسیقی بجانے]
>> اونیل مہتا: یہاں یہ جاتا ہے.
>> ویسے، سب، ویب پر خیر مقدم کرتے ہیں کے ساتھ مستقبل کے اطلاقات ردعمل.
یہ CS50 ہے.
میرا نام اونیل ہے.
میں CS50 اور ایک sophomore لئے ایک ٹا ہوں ہارورڈ کالج اور ایک بہت، بہت سے اوپر
پرجوش ویب ڈویلپر.
تو میں بہت دلچسپ ہوں آج آپ سے بات ہو،
آپ یہاں یا گھر پر چاہے دیکھ، کے بارے میں ایک بار پھر، ہے جس میں، ردعمل
میں ویب اطلاقات کی، مستقبل کہا.
>> تو ردعمل ایک ویب فریم ورک ہے.
میں کیا گیا ہے کے طور پر اور کہہ یہاں کچھ لوگوں کو،
ایک فریم ورک صرف ایک ہے آپ استعمال کر سکتے ٹولز کا مجموعہ
تشکیل اور آپ کی ویب اپلی کیشن کی تعمیر کرنے کے لئے.
اور ویب ایپس، پھر، ویب سائٹس ہیں فیس بک کی طرح انٹرایکٹو ہیں کہ،
Twitter.com، Instagram.com، جو.
>> تو فیس بک ایک ویب فریم ورک ہے کہ فیس بک کی طرف سے تیار کی گئی تھی
ردعمل back-- ایک جوڑے سال ہے.
اس کے بعد میں استعمال کیا گیا ہے ان کے موبائل اطلاقات فیس بک پر
اور ویب اپلی کیشن، Instagram.
خان اکیڈمی ایک اور مثال ہے ردعمل کے ممتاز ابتدائی adopter.
>> یہ واقعی میں مل رہا ہے انتہائی مقبول.
کیا تم نے کبھی کونیی یا جیسے چیزوں کا استعمال کرتے ہیں ریڑھ کی ہڈی، اس ایک ہی خاندان سے ہے،
لیکن اس کے بعد اب تک ہے ان کی مقبولیت سے پہلے آسکتی.
یہ گرم، شہوت انگیز نئی چیز ہے.
یہ واقعی، واقعی بہت بڑا ہے.
>> اور اس طرح رد عمل کا اظہار کے طور پر نہ صرف اچھا ہے عمارت انٹرفیس کے لئے ویب فریم ورک.
یہ ویب انٹرفیس کی تعمیر کے لئے اچھا ہے.
کسی چیز کو بھی نہیں ہے نامی مقامی ردعمل جس
آپ انٹرفیس کی تعمیر کی اجازت دیتا ہے لوڈ، اتارنا Android اور iOS کے لئے
مستقبل میں اور شاید دوسرے پلیٹ فارم صرف اسی جاوا سکرپٹ کے کوڈ کا استعمال کرتے ہوئے.
آپ کو عین مطابق اسی استعمال کر سکتے ہیں جاوا سکرپٹ کے کوڈ، فراہم کرنے کے لئے ویب سائٹس
لوڈ، اتارنا Android اطلاقات اور iOS اطلاقات رینڈر کرنے کے لئے.
>> یہ ایک بہت، بہت دلچسپ وقت ہے.
یہ ایک بہت، بہت ٹھنڈا موقع ہے.
یہ واقعی ایک عالمگیر ویب ہے انٹرفیس ترقی کے آلے کے،
تو یہ ایک بہت، بہت ہے اہم بات جاننا.
اور، میں نے لوگوں کو بتا رہا تھا کے طور پر سے پہلے، یہ، مجھے لگتا ہے کہ،
ہم کس طرح تبدیل کرنے کے لئے کی جا رہی ہے ہمیشہ ویب اطلاقات کی تعمیر.
تو یہ ہو سکتا ہے کہ تھوڑا سا مبالغہ ہے، لیکن میں یہ معلوم کرنے کے لئے ایک بہت اچھا بات ہے.
>> ٹھیک ہے، تو رد عمل کا اظہار کیا ہے؟
رد عمل کا اظہار ایک فریم ورک آپ کر سکتے ہیں ہے انٹرفیس کی تعمیر کے لئے استعمال کرتے ہیں.
ایک انٹرفیس، پھر، ہے حق ایک ویب کے صفحے،؟
تو یہاں Instagram.com ہے، استعمال ردعمل.
>> پر بنایا گیا ہے رد عمل کا اظہار اجزاء کے تصور.
ایک جزو ایک ایچ ٹی ایم ایل سٹیرائڈز پر عنصر،
تو ایک HTML عنصر ایک بٹن کی طرح ہے.
یہ ایک پیراگراف ہے.
یہ درست ہے، ایک ہیڈر ہے؟
اور Instagram ان کا استعمال، لیکن یہ کرے گا بھی ردعمل کے اجزاء کا استعمال کریں گے.
>> اجزاء ہیں رد عمل کا اظہار souped اپ HTML عناصر
ان کے اپنے رویے ہے کہ ان کے اندر موجود.
لہذا، ایک مثال کے طور پر، ہم کر سکتے ہیں ایک وقت عنصر، ایک وقت جزو،
جس طرح بھی شامل ہو گی وقت سٹیمپ، آپ جانتے ہیں،
پروفائل جزو جس پروفائل تصویر پر مشتمل ہوگا
اور اس شخص کے نام.
یہ ایک طرح انسداد، ہو سکتا ہے جس پسند کرتا ہے کی تعداد کی طرح اعتماد کر سکتے ہیں،
آپ اس پر کلک، تو یہ کروں گا پسند کرتا ہے کی تعداد میں اضافہ.
ایک جزو صرف ایک ہے HTML کوڈ کے گروپ ہے کہ
کچھ فعالیت ہے اس کے اندر لپیٹ.
تو یہ ایک HTML عنصر کی طرح ہے سٹیرائڈز پر، میں نے پہلے کہا کے طور پر.
تم ان اجزاء لے جا سکتے ہیں، اور آپ کو ان کے ساتھ ڈال کر سکتے ہیں
میں، نئے اجزاء بنانے کے لئے اس صورت میں، ایک پوسٹ جزو،
جس میں تمام اس سامان پر مشتمل ہے.
یہ پروفائل وقت پر مشتمل ہو گی، LikeCounter، شاید تبصرہ
اور شاید تصویر خود.
اور اس طرح ویب اطلاقات صرف لینے کی طرف سے تعمیر کر رہے ہیں اجزاء اور ان کے ساتھ لگانے.
ایک Instagram فیڈ سے زیادہ کچھ نہیں ہے خطوط کا ایک مجموعہ ایک کے بعد ایک،
ہر پوسٹ، وقت کی طرح پر مشتمل ہے اسی طرح، LikeCounter پروفائل، اور.
اس قسم کے گھر کی تعمیر کی طرح ہے.
آپ کی تعمیر نہیں نیچے اوپر سے گھر.
آپ اجزاء لے باتھ روم کی طرح لے.
آپ ان رہنا bedroom-- لے ایک دوسرے کے ساتھ، اور آپ کو ایک نیا جزو ہے.
آپ کے گھر کا ایک نیا حصہ ہے.
>> تو تمام کے ارد گرد تعمیر کیا گیا ہے رد عمل کا اظہار اجزاء کی اس خیال ہے کہ
اعلانیہ ہیں کہ، انٹرایکٹو ہیں.
کیا آپ صرف کا کہنا ہے کی طرح پروفائل ہے، اور یہ دیتا ہے.
وہ composable ہیں.
آپ ایک وقت اور ایک پروفائل لے جا سکتے ہیں، ڈال ان کے ساتھ، کچھ کو بہتر بنانے.
اور وہ تو، دوبارہ پریوست ہیں آپ ایک عہدے کے لئے منبع کوڈ ہے،
آپ کہیں کہ یمبیڈ کر سکتے ہیں.
>> تم ایک Instagram یمبیڈ کر سکتے ہیں اپنی ویب سائٹ پر بات.
آپ فیس بک میں یمبیڈ کر سکتے ہیں، مثال کے طور پر، جب تک اسے استعمال کرتا ہے کے طور پر رد عمل کا اظہار.
تو اجزاء واقعی، واقعی، واقعی ہیں ویب کی طاقتور عمارت کے بلاکس
کہ کہیں بھی استعمال کیا اور کیا جا سکتا ہے ایک دوسرے کے ساتھ نئی عمارت بلاکس بنانے کے لئے.
یہ بہت، بہت ہے اعلی سطح کے جائزہ.
تو، ایک بار پھر، اگر آپ کے پاس کسی بھی موڑ پر کسی بھی سوالات
ری ایکٹر، کے فلسفے کے بارے میں کوڈنگ، مجھے روک، اور مجھے پتہ کرنے.
>> ٹھیک ہے، تو اس کی وجہ سے ٹھنڈا رد عمل کا اظہار ہے دیکھنے کا ایک مختلف طریقہ ہے
آپ کو ویب اطلاقات کی تعمیر کس طرح.
آپ نے شاید MVC، ایک کے بارے میں سنا ہے ماڈل آپ CS50 یا جو کچھ بھی میں کنٹرول
آپ استعمال کرتے ہیں کی تحقیقات کلاسوں دیگر.
اور سب سے فریم ورک ہے MVC کے خیال کے ارد گرد تعمیر.
رد عمل کا اظہار نہیں ہے.
خیال کے ارد گرد بنایا گیا ہے رد عمل کا اظہار یو nidirectional ڈیٹا کے بہاؤ کے
یہاں اس چارٹ یا گرافک کی طرف سے دیکھا کے طور پر.
>> بنیادی طور پر، آپ کو ایک ڈیٹا کا ذریعہ ہے.
اور اعداد و شمار کے ذریعہ فیصلہ کرے گا کس طرح بعض اجزاء باہر بچھانے.
اور اجزاء گے تو، وہ تبدیل جب،
وہ بتائیں گے ڈیٹا کا ذریعہ تبدیل کرنے.
>> انسٹاگرام استعمال کرنے کے لئے مثال کے طور پر، آپ ہو سکتا ہے
طرح پوسٹ اشیاء کی ایک فہرست ایک ڈیٹا بیس یا کچھ میں.
ڈیٹا.
اور پھر ہماری پوسٹ اجزاء کہ اعداد و شمار لے جائے گا،
اور فراہم کرنے کے کہ اعداد و شمار کا استعمال کرتے ہیں سکرین پر ایک بات.
یہی تیر ، اتحادی ہے کے اعداد و شمار سے
اور پھر اس ہی اعداد و شمار استعمال کیا جاتا ہے اجزاء کا ایک گروپ رینڈر کرنے کے لئے.
>> فیس بک رسول میں، کے لئے رد عمل کا اظہار ہے جس میں مثال کے طور پر،،
آپ کی ایک فہرست ہو سکتا ہے آپ کے ڈیٹا کا ذریعہ کے طور پر پیغامات.
اور یہ کہ نہیں رینڈر پیغامات میں سے صرف فہرست
بلکہ دوستوں کی فہرست آپ کو کرنا پڑے.
آپ ناخواندہ شمار.
شاید یہ بھی فیس بک بات رینڈر کہ Facebook.com کے نچلے حصے میں ہے.
ایک ہی ڈیٹا ہے سچائی کا واحد ذریعہ
اور اس کا ایک بہت کا سبب بنتا ہے اجزاء مہیا کیا جائے.
اور جب ان میں سے ایک اجزاء تبدیل کر دیا ہے،
اسے واپس جاتا ہے اور ڈیٹا کا ذریعہ تبدیل.
>> تم نے صحیح، ایک پیغام بھیجنے؟
اس ڈیٹا کا ذریعہ تبدیل.
آپ اپنے پیغامات پڑھنے، تو آپ 0 ناخواندہ مقرر.
اس ڈیٹا کا ذریعہ تبدیل.
اور ایک ان میں سے تمام نوٹس تیر ایک ہی اعداد و شمار کے واپس جا
دیکھئے، آپ کو معلوم ہے تو، ایک مخصوص اعداد و شمار کے سیٹ دی،
آپ بالکل وہی جو جانتے صفحے کی طرح نظر کی جا رہی ہے.
یہ نیتاتمک ہے.
تم، دیا بعض اعداد و شمار معلوم، کیا صفحے کی طرح نظر کی جا رہی ہے.
آپ اس میں جا رہا ہے کہ کس طرح کی پیشن گوئی کر سکتے ہیں برتاؤ کرتے ہیں اور کس طرح چیزوں کو جا رہے ہیں
وہ ایک ساتھ ڈال رہے ہیں جب کام کرنے کے.
>> اور میں نے ایک ملین اجزاء تھا تو یہاں، یہ درست ہے، ایک ہی برتاؤ کریں گے؟
آپ کسی بھی نہیں پڑے گا عجیب کے interconnections.
ایک ڈیٹا ایک ملین اجزاء مہیا.
ایک ملین اجزاء سکتا واپس جاؤ اور ڈیٹا میں ترمیم.
اور اس طرح یہ بہت اچھا ہے.
ہم، composable تعمیر کر رہے ہیں آسانی سے توسیع پذیر ویب اطلاقات.
>> آپ کو ایک ڈیٹا کا ذریعہ ہے، سچ کا ذریعہ.
یہ آپ کو بتاتا ہے اجزاء کس طرح صفحے باہر بچھانے،
اور اجزاء گے بات چیت کو ہینڈل.
اور وہ تبدیل کرنا چاہتے ہیں تو چیزیں صرف واپس جانا
اور اعداد و شمار کے ذریعہ تبدیل کرنے کے لیے کہو.
کوئی مطلب ہے؟
تو ردعمل سمجھ کے بارے میں ہے کس طرح ایک جزو کی تعمیر کے لئے
اور آپ کے جزو بنانے کے لئے کس طرح باہر کی دنیا کے ساتھ بات چیت.
>> جزو بات چیت بنانا بیرونی دنیا کے ساتھ
ایک ٹیکنالوجی کا استعمال کرتا کہا جاتا بہاؤ، جس
ہے کہ ایک فریم ورک ہے ردعمل کے سب سے اوپر پر شامل.
ہم اس بارے میں بات کرنے کے لئے نہیں جا رہے ہیں.
ہم نے دیا، کے بارے میں مزید بات کرنے کے لئے جا رہے ہیں ڈیٹا، کس طرح آپ کو ایک جزو فراہم کر سکتے ہیں؟
>> اور اس طرح آپ کی وجہ سے واقعی ٹھنڈا ہے رد عمل کا اظہار آپ چاہتے ہیں کسی بھی واپس اختتام کے ساتھ اس کا استعمال کر سکتے ہیں.
آپ کو ایک ازگر واپس آخر کی طرح ہے تو، آپ ازگر کچھ اعداد و شمار سے باہر توکنا کر سکتے ہیں تو،
یہ فراہم کر سکتے ہیں رد عمل کا اظہار.
آپ کو کوئی جے نتائج ہیں اعداد و شمار کے، ردعمل یہ دیتا ہے.
روبی کے ساتھ ریلز ڈیٹا، ردعمل یہ دیتا ہے.
>> تو بنیادی طور پر ایک رد عمل کا اظہار ویب اجزاء کے ساتھ ایک سامنے اختتام view--
کسی بھی ڈیٹا کا ذریعہ کے لئے.
اور اس طرح کے اعداد و شمار کے ذریعہ سے کرنے کے لئے جا اجزاء رد عمل کا اظہار بہت آسان ہے.
دوسرے طریقے سے جا تھوڑا مشکل ہے.
میں نے پہلے ذکر کے طور پر اس بہاؤ استعمال کرتا ہے.
ہم اس میں نہیں ملے گا.
ہم پر زیادہ توجہ مرکوز کریں گے ڈیٹا ٹو جزو طرف.
آپ کر سکتے ہیں اس طرح ٹھنڈا، مزہ ویب اطلاقات.
یہ باہر کی دنیا کو متاثر نہیں ہوں گے اب کے لئے، لیکن اس سے ایک کہانی ہے.
>> ٹھیک ہے، اگر ایسا ہے تو تم یہاں تھے میری آخری سیمینار کے لئے
آپ کے لئے کوڈ کی ہے کہ سب جانتے ہیں ہوں آج کی بات اس URL پر ہونے جا رہا ہے
یہاں، افسوس، اس یو آر ایل.
اور بنیادی طور پر ہم جانے کے لئے جا رہے ہیں شاید چار مراحل، پانچ کے ذریعے،
شاید نہیں پانچ.
ہم نے چار مراحل کے ذریعے منتقل کریں گے ایک نمونہ کی تعمیر کے اپلی کیشن ردعمل.
اور اس طرح تمام منبع کوڈ راستے سے ہر قدم کے لئے
اگر ایسا ہے تو، یہیں ہونے جا رہا ہے آپ کے گھر میں ساتھ پیروی کر رہے ہیں
اس کوڈ peruse بلا جھجھک.
آپ یہاں ساتھ مندرجہ ذیل کر رہے ہیں تو، ہم سکرین پر دکھا جائے گا
تو اس کے بارے میں فکر نہ کرو.
لیکن آپ کے گھر پر ہیں تو، محسوس اس ویب سائٹ کا دورہ کرنے کے لئے آزاد.
اور، جی ہاں، آپ کو حاصل کرنے کے قابل ہونا چاہئے کیا تم نے کبھی یہاں کی ضرورت چاہتے ہیں تمام کوڈ.
تو یہ ایک اچھا دھوکے باز شیٹ کے ساتھ ساتھ ہے کے ساتھ اپنے مستقبل مہم جوئی کے لئے رد عمل کا اظہار.
ٹھنڈی، اگر ایسا ہے تو یہاں ہے جو ہر کسی کو، اور آپ کے گھر میں ہیں یہاں تک کہ اگر،
is.gd/cs50react، اس ویب سائٹ ھیںچو، کوئی دارالحکومت، کوئی کشید، کوئی کچھ بھی نہیں.
>> آپ لگتا ہے کہ ایک صفحہ نظر آئے گا اس طرح تھوڑا سا.
یہ CodePen نامی ایک چیز ہے.
CodePen ایک باہمی تعاون ہے کوڈنگ ماحول
جس کے ساتھ میں یہاں کوڈ لکھنے، اور کر سکتے ہیں یہ خود بخود آپ کو بھیجا جائے گا.
اور اس طرح، میں نے کوڈ لکھ سکتے ہیں.
میں یہاں کوڈ کو چلانے کے کر سکتے ہیں.
>> مثال کے طور پر اور یہ دیکھیں reloads-- تو، صفحے پر جاوا سکرپٹ کے کوڈ رہا ہوں
یہیں، اور یہ کروں گا خود کار طریقے سے ایک ویب کے صفحے رینڈر
یہ جاوا سکرپٹ کے کوڈ کے ساتھ.
اور اس طرح یہ ایک طریقہ ہے ہم کوڈ باہر کرنے کی کوشش کرنے کے لئے
استعمال کرنے کے لئے بغیر واقعی فوری ہماری شناخت یا اپنے مقامی مشین کا استعمال
یا جو کچھ بھی.
یہ آپ mockup کی کے لئے ایک بہت ہی تیز طریقہ ہے اور کوڈ کے مختلف قسم کے باہر کی جانچ.
>> تو میں لے جا رہا ہوں مثال کے طور پر کوڈ، اسے یہاں ڈال.
ہم اس کے ذریعے کام کرنے جا رہے ہیں.
اور آپ گھر پر ہیں تو، آپ کو اس کے ساتھ ساتھ ھیںچو کر سکتے ہیں.
اور میں نے پہلے ہی نصب ہے یہاں رد عمل کا اظہار، لہذا آپ کو صرف کر سکتے ہیں
یہاں آپ کے اپنے کوڈ لکھنے، اور آپ کے اپنے کھیل کے میدان کے طور پر اس کی کوشش.
>> جی ہاں، ہر کسی کو تو یہاں اس لنک کو کھولنے.
مجھے ایک انگوٹھوں دے دو آپ اسے کھول ہے ایک بار.
ٹھنڈی، ٹھنڈی ٹھنڈی.
کچھ بھی نہیں، اب کے لئے یہاں کچھ نہیں ہے لیکن ہم بہت جلد ہے کہ بدل جائے گی.
>> ٹھیک ہے، تو ایک جاوا سکرپٹ ہے رد عمل کا اظہار لائبریری، اور اس طرح کے طور پر،
، جاوا اسکرپٹ کا علم کی ضرورت ہوتی جس میں ویب پروگرامنگ زبان ہے.
اور یہ دوسری چیزوں کے لئے استعمال کیا جا رہا اب بھی لیکن بنیادی طور پر ویب کی ترقی
زبان، آپ کے ساتھ نا واقف ہیں تو کہ، JSforCats.com نامی ایک ویب سائٹ کو پڑھنے کے.
یہ حیرت انگیز ہے.
آپ کو جاوا اسکرپٹ سیکھ سکتے ہیں آدھے گھنٹے میں.
یہ ناقابل اعتماد ہے.
>> تو یہ ایک پڑھ دینے کے.
ہم نے بھی کیونکہ یہاں ایچ ٹی ایم ایل کی ایک بہت ہے ہم نے کورس کی ویب صفحات کے ڈیزائن کر رہے ہیں.
آپ سے ناواقف ہیں تو ایچ ٹی ایم ایل، HTMLdog.com چیک.
میں رد عمل کا اظہار ہے ایک سیکھنے لگتا ملین اوقات آسان پہلے سے اگر آپ کو
عمارت کے بلاکس جانتے.
آپ اجزاء ہے، تو یہ ہے آسان ایک بڑا اتحادی بنانے کے لئے.
یہ ہے کہ آپ کے لئے زبان کو رد عمل کا اظہار ہے.
>> لہذا آگے بڑھیں اور دے ان چیزوں کو پڑھنے.
اس ویڈیو کو روکنے کے.
اگر آپ یہ ایک پڑھ دینے کے گھر میں آپ نہیں ہیں تو
HTML یا جاوا سکرپٹ سے واقف
ٹھیک ہے، تو ہم کرنے جا رہے ہیں کیا ہم بنانے کے لئے جا رہے ہیں ہے
ردعمل کا استعمال کرتے ہوئے ایک بہت ہی بنیادی flashcard سے اپلی کیشن.
ہم نے ایک flashcard سے لئے جا رہے ہیں.
آپ کو آگے پیچھے کارڈ پلٹائیں کر سکتے ہیں.
اور ہم بھی کی فہرست پڑے گا ہم ہے کہ تمام کارڈز،
اور ہم محسوس کر رہے ہیں مہتواکانکشی، ہم ہو سکتا ہے
کے درمیان سوئچ کرنے کے قابل ان پر کلک کر کاریں.
>> لیکن یہ اپنے ننگے کے، ہے ہڈیوں، ایک بہت سادہ اپلی کیشن ردعمل.
اور اس طرح یہ اصل میں ہے لاگو کرنے کے لئے چھوٹی سی نہیں،
لیکن ہم آپ کو کرتے ہیں تو، یہ دکھانے کے لئے جا رہے ہیں اس، اسے بڑھانے کے لئے بہت، بہت آسان ہے
دوسرے لوگوں کے ساتھ آپ کی مدد.
تو ہم چار مراحل کے ذریعے جانے کے لئے جا رہے ہیں شروع سے شروع ہونے والے اس کی تعمیر کے لئے.
>> ٹھیک ہے، تو چار مراحل، ہم کریں گے پہلا قدم کے ساتھ شروع.
پہلا قدم ہونے جا رہا ہے آپ کی پہلی جزو کی عمارت.
میں نے پہلے کہا، ایک جزو میں ردعمل سٹیرائڈز پر صرف ایک HTML عنصر ہے.
یہ ایچ ٹی ایم ایل کی وضاحت کرتا ہے اور کچھ رویے، اور یہ
کس طرح لوگوں کی وضاحت کریں گے یہ کس طرح کے ساتھ بات چیت کر سکتے ہیں
یہ اندرونی ریاست ہوگا.
ایک بٹن کتنے طرح پتہ چل جائے گا کی طرح بار یہ مثال کے طور پر کلک کیا گیا ہے،
اور اسے خود باہر بچھانے کے لئے کس طرح پتہ چل جائے گا.
>> تو آگے بڑھو اور تعمیر ہماری جاوا سکرپٹ کو استعمال پہلا جزو.
نحو عجیب لگتا ہے اگر ایسا ہے تو، اس قسم کی ہے اس کی وجہ سے ہے.
تو، ایک بار پھر، ہم جا رہے ہیں نامی ایک متغیر بنانے کے لئے
اپلی کیشن مطلوبہ الفاظ دو استعمال کر رہے ہیں، جس میں ایک متغیر ہے،
اپلی کیشن برابر React.createClass دو.
>> رد عمل کا اظہار ایک لائبریری ہے اور ہے کلاس تقریب تخلیق.
اس تقریب ہے کوڈ کا تھوڑا سا ہے کہ آپ کو
ایک نیا تخلیق کرنے کے لئے استعمال کر سکتے ہیں جزو ردعمل کی قسم.
اور اس طرح React.createClass ایک جزو ہے،
اور اس کے اتحادیوں گا چیزیں کرنے کے لئے کے قابل ہو جائے.
یہ کر سکتے ہیں اہم بات رینڈر ہے کچھ، ایک تقریب کے طور رینڈر.
>> ایک بار پھر، اس انڈیکس پر واضح نہیں ہے تو آپ، میں آپ کو بلیوں کے لئے جے ایس پر جانے کی سفارش کرتے ہیں
اور اسے باہر کی جانچ پڑتال.
اچھی طرح سے کہ میں یکبر ہے؟
ٹھنڈا.
>> تو ہر جزو کی ضروریات ایک رینڈر تقریب ہے.
رینڈر تقریب، کا کہنا ہے کہ میں سکرین پر کیا پرنٹ کروں؟
لیکن اتحادی ہے اگر ایسا نہیں ہوتا بیکار
لہذا، سکرین پر پرنٹ کرنے کے لئے کیا پتہ آپ کو ایک رینڈر تقریب ہے کرنے کی ضرورت ہے.
>> ، آپ بات رینڈر میں So صرف کچھ HTML واپس کرنے کی ضرورت.
اور کیا اچھا ہے یہ ہے کہ نامی ایک چیز ہے
کی ایک توسیع ہے جو JSX، کی طرف سے استعمال کیا جاتا ہے کہ جاوا اسکرپٹ رد عمل کا اظہار.
یہ آپ کے اندر HTML لکھنے چلو آپ کو جاوا اسکرپٹ کا جو
جب عجیب قسم آواز آپ سب سے پہلے اس کے بارے میں سوچنا،
لیکن یہ اس کے بعد احساس کی ایک بہت کرتا ہے.
تو ہم ایسا کر سکتے ہیں.
آپ کو HTML کے ساتھ واقف ہیں تو، میں جانتا ہوں ہم ایک عام مقصد کے ساتھ ایک div ہے
سامان کے لئے کنٹینر.
ہم اندر ایک div واپس کر سکتے ہیں اور اس div، ہم چیزیں ڈال کر سکتے ہیں.
>> تو ہم صرف رینڈر کرنے کے لئے چاہتے ہیں کا کہنا ہے کہ اب کے لئے ایک براہ راست اپ flashcard سے.
flashcard سے، میں، کا کہنا ہے کہ ایک سوال اور اس کا جواب ہوگا.
تو اس div کے اندر، چلو ایک پیراگراف باہر پرنٹ
کہ کیا ہے question-- کا کہنا ہے کہ زندگی کے لئے حتمی جواب، یونیورس؟
اور پھر جواب ہے 42، کورس کے، ہونے جا رہا.
>> یہ سب اچھی طرح سے نہیں آیا تھا.
جی ہاں، تو بنیادی طور پر آپ کر سکتے ہیں واقعی آپ کو جاوا اسکرپٹ اندر HTML لکھنے.
یہ ہونے جا رہا ہے سکرین میں باہر پرنٹ.
تو اسے باہر کرنے کی کوشش کریں.
>> تو ہم ہمارے جزو ہے.
ہم ڈال کرنے کے لئے رد عمل کا اظہار بتانے کی ضرورت ہے سکرین پر جزو
تو React.render، تاکہ ہم محسوس کسی دوسرے عنصر جیسے اپلی کیشن کا علاج.
یہ ایک HTML عنصر تھا کے طور پر ہم یہ لکھ.
بجائے IMG طرح کہہ طرح پیراگراف کے لیے تصویر یا P کے لئے،
اپلی کیشن ہے، لہذا آپ کو اپلی کیشن لکھیں ایک HTML عنصر کی طرح سلوک کیا.
میں نے پہلے کہا، یہ ہے سٹیرائڈز پر ایک عنصر.
>> تو آپ کو اپلی کیشن رینڈر، اور آپ یہ ڈال کرنے کے لئے ایک جگہ دے.
اور یہ کس طرح آپ کر سکتے ہیں ہے کہاں ڈال پر یہ بتانے.
میں نے ایک سادہ div پیدا کیا ہے صفحے کے ایک ID کے ساتھ کہا جاتا صفحے،
اور وہ کہاں ہے عنصر جا رہا ہے.
>> اور ہم HTML کے ساتھ چلانے کے لئے نہیں جا رہے ہیں.
بنیادی طور پر اس کو حاصل کرنے کی جا رہی ہے اس صفحے عنصر کے اندر ڈال دیا
ہم سکرین پر ہے کہ.
تو یہ اس کوڈ چلتا ہے، اور یہ اس ڈرا سکرین پر بات، تو ہم یہاں ہیں.
ہم اپنے پہلے رد عمل کا اظہار جزو بنا دیا ہے.
>> تو صرف ایک recap طور پر، ہم آہستہ بنایا جزو کی ایک نئی قسم، ٹھیک ہے؟
یہی React.createClass ہے.
اس جزو میں، ہم یہ کیا کرنا چاہئے یہ بتایا.
جب اس کے اتحادیوں کے لئے ہے سکرین پر پرنٹ کیا جا،
اس div کے ساتھ باہر پرنٹ گا اس کے اندر دو پیرا.
>> اور ہم نے کیا ہے، ہم ایک نیا اپلی کیشن بنایا زاویہ بریکٹ سنکیتن کا استعمال کرتے اپلی کیشن.
ہم نے اسے ڈال کرنے کے لئے کہا صفحہ عنصر کے اندر.
اور اس طرح میں نے کیا، اسے پیدا اس سانچے کی طرف سے ایک نئے اے پی پی.
اور پھر میں اس رینڈر کو بتایا.
تو اس نے کہا، ٹھیک ہے، اے پی پی، مجھے کیا باہر پرنٹ کرنا چاہئے؟
اپلی کیشن، ایک div باہر پرنٹ جانے کہنا اس کے اندر دو پیرا کے ساتھ.
اور voila، کے ساتھ ہمارے div کی ہے اس کے اندر دو پیرا.
اب تک کوئی مطلب ہے؟
>> تو، ایک بار پھر، کے پورے چیلنج ردعمل صرف اجزاء بنانے کے لئے کس طرح جانتا ہے.
بنانے کے لئے کس طرح اجزاء ایک دوسرے کے ساتھ کام کرتے ہیں.
اب ہم ہمارے پہلے بنایا ہے کہ جزو، کا واپس جانے
اور اجزاء مرضی کے مطابق بنانے.
لہذا آپ کو HTML میں کس طرح جانتے ہیں آپ آپ کے بٹن کلاس دے سکتے ہیں؟
آپ کو آپ کے اینکرز href کی دے سکتے ہیں.
تم نے صحیح، اپنے آدانوں ایک قسم دے سکتا ہے؟
آپ کو زیادہ اپنی مرضی کے مطابق دے سکتے ہیں آپ کے عناصر کے تمام خصوصیات
یہ زیادہ دلچسپ بنانے کے لئے.
اور ہم اصل میں کیا کر سکتے ہیں بالکل وہی بات ہے.
>> تو ہم چاہتے ہیں کا کہنا ہے کہ ہماری اپلی کیشن کسی بھی کارڈ رینڈر جانا.
ٹھیک ہے اب ہم صرف ایک hardcoded کیا کارڈ مہیا.
ہم صرف ایک وہاں ہے کارڈ ایسا کر سکتے ہیں، تاکہ ہم ہیں
کوشش اور تو اب اس کو تبدیل کرنے جا رہا ہم صرف یہ کچھ کارڈ دے سکتے ہیں.
یہ کارڈ باہر پرنٹ کریں گے.
>> آپ کوشش کریں اور بنانے کے لئے چاہئے آپ اجزاء ایک بہت عام مقصد.
تو اس طرح میں نے ای میل کر سکتے ہیں یہ میرا دوست اور طرح ہو،
آپ کے پاس جو کچھ بھی flashcard سے، صرف یہاں میں اس کو کھانا کھلانا،
اور یہ خود کی طرف سے یہ کروں گا.
آپ دیگں ڈال کر سکتے ہیں آپ کے اپنے اے پی پی میں چیزوں کو.
>> لیکن سب سے پہلے، اس کے توڑ دو دو اجزاء میں،
لیکن ہم کارڈ الگ کرنا چاہتے ہیں اصل اپلی کیشن حصے سے پرنٹنگ حصہ.
تو ہم کیا کر سکتے ہیں ہم ہے اپلی کیشن سے اس کو تبدیل کر سکتے ہیں
CardView کے لئے، صرف ایک اپلی کیشن کے لئے نیا نام،
اور ہم ایک نیا کر سکتے ہیں جزو، اپلی کیشن نامی
پرانے اپلی کیشن کے ساتھ الجھن میں نہیں.
ہم createClass مل گیا ہے، اور HTML کی طرح،
آپ گھوںسلی اجزاء ردعمل کر سکتے ہیں ایک دوسرے کے اندر.
>> ، اس رینڈر تقریب میں تقریب واپسی CardView،
اور یہ بالکل وہی بات ہے.
یہ ایک ہی بات ہے کیوں دیکھتے ہیں؟
اس کی بجائے صرف اپلی کیشن دے کے کہ ، اس کے اندر div اور جوڑی ہے
اپلی کیشن CardView دیتا، اور CardView div اور پیراگراف دیتا.
تو اس کی ہماری پہلی مثال ہے ایک دوسرے کے اندر nesting کے عناصر.
اس کا کوئی مطلب ہے؟
تو، ایک بار پھر، ہم نے ایک CardView عنصر ہے.
ہم اپلی کیشن عناصر ہیں اس سے بڑا ہے کہ.
>> ٹھیک ہے، تو ہم چاہتے ہیں ہماری CardView-- اگر ایک اچھا CardView ایک مخصوص کارڈ دے،
یہ درست ہے، آپ کے لئے باہر پرنٹ کریں گے؟
تو سب سے پہلے، ہم نے ایک کارڈ بنانے کے لئے کی ضرورت ہے، تو ایک کارڈ اعتراض بنانے.
تو میرا کارڈ دو equal-- آپ سب واقف ہیں تو،
یہ صرف علامت سازی ہے جاوا اسکرپٹ میں اعتراض.
یہ ایک struct کی طرح قسم کی ہے C میں، تو ہم، ایک کارڈ دیا
اور تو اب ہم اس کارڈ کو منتقل کر سکتے ہیں ایک پراپرٹی یا HTML میں ایک خصوصیت کے طور پر
ہمارے اپلی کیشن کو اصطلاحات.
تو ہم اس، اپلی کیشن کر سکتے ہیں کارڈ myCard برابر.
>> آپ ان پٹ میں، آپ کو کس طرح جانتے ہیں ان پٹ کی قسم متن یا بٹن کے برابر ہے
کلاس بوٹسٹریپ کے لئے BTN برابر ،؟
اسی خیال، اپلی کیشن کارڈ برابر آپ منحنی خطوط وحدانی ڈال کرنے کے لئے مل گیا ہے یہاں
اپلی کیشن کارڈ myCard برابر، تو یہ ہم اس کارڈ چیز ہے کا کہنا ہے کہ.
میں نے ایک کے طور پر منتقل کرنے کے لئے جا رہا ہوں اپلی کیشن جزو پر جائیداد.
اور اس اپلی کیشن جزو گا اس تک رسائی حاصل کرنے کے قابل ہو اور ایسا
اس کے ساتھ دلچسپ چیزیں.
>> تو ہمارے اپلی کیشن ہونے جا رہا ہے ایک کارڈ دیا، تو اب کے لئے،
صرف دینے کی اے پی پی ہے دو CardView کے لئے کارڈ
خود اپلی کیشن نہیں ہے کی طرح ہے کیونکہ اس کے ساتھ کیا کرنا ہے جاننے کے لئے جا،
تو ہم صرف CardView کو دے دونگا.
تو ہم اس کو منتقل کریں گے اسی طرح، کارڈ، برابر
اور اس طرح ہر جزو تک رسائی حاصل کر سکتے ہیں اس کو دیا گیا ہے کہ چیزوں کو.
وہ خصوصیات تک رسائی حاصل کر سکتے ہیں کہ اس کے لئے دیا گیا ہے
this.props.card، اس نحو استعمال کر رہے ہیں.
>> تو کیا یہاں ہے کیا ہوتا ہے آپ myCard چیز ہے.
آپ کو اپلی کیشن میں منتقل اپلی کیشن کارڈ استعمال myCard برابر.
اس کارڈ اعتراض اپنے اے پی پی کو دیا جاتا ہے.
اپلی کیشن اس تک رسائی حاصل کر سکتے ہیں this.props.card طور پر.
یہ ایک تصویر کی طرح قسم کی ہے اس کے ذریعہ کیا ہے جانتا ہے.
>> اس اپلی کیشن یہ کارڈ ہے کیا جانتا ہے ہے، اور یہ اس کے ساتھ چیزیں کر سکتے ہیں.
یہ سنگننا کر سکتے ہیں.
یہ دور کی بنیاد پر فیصلے کر سکتے ہیں.
>> اب کے لئے، میں منتقل کرنے کے لئے جا رہا تھا CardView پر this.props.card.
اب تک کوئی مطلب ہے؟
اب یہ زیادہ احساس بنا دیں گے.
>> ٹھیک ہے، تو اب ہم CardView پر ہیں.
کارڈ دیا ہمارے CardView،، ہونا چاہئے اس سوال اور جواب باہر پرنٹ.
ٹھیک ہے اب ہم صرف باہر طباعت کچھ hardcoded کیا سوالات اور جوابات.
ہم نے کی ضرورت out-- جاننے کی ضرورت ہے انہوں نے ہمیں دیا ہے کہ کارڈ پوچھنا
کیا سوال اور جواب ہے، اور پھر سکرین میں اس سے باہر پرنٹ.
>> تو ہم یہاں ایسا کر سکتے ہیں.
میں سب سے پہلے برابر begin-- رینڈر.
تو کیا ہم یہاں کیا کر رہے ہیں ہم جانتے ہیں کہ ہے کارڈ، ایک پراپرٹی کے لئے ہمیں دیا جاتا ہے
ٹھیک ہے؟
یہ ایک ان پٹ کے طور پر ہم کو دیا ہے.
یہ تقریبا کی طرح ہے جیسے ایک تقریب میں دلائل.
کارڈ کی ایک دلیل ہے تقریبا اس CardView کرنے.
>> ہم نے اس کو ہٹا دیں، اور ڈال دیں گے یہ متغیر سوال میں.
اس بات کا یقین کا جواب گیا بنائیں متغیر جواب.
کارڈ جواب دینے کے لئے کہ اشارہ.
اور اب ہم ان ہے کہ، بجائے کہ متن پرنٹنگ کے،
ہم باہر پرنٹ کرنے کے لئے جا رہے ہیں جو کچھ انہوں نے ہمیں دی.
>> تو یہ تو ہم جا رہے ہیں stuff-- سوال کا جواب باہر ڈال دیا.
یہ کام کرتا ہے چلو دیکھتے ہیں اگر.
ٹھنڈا، تو اس کے ذریعے قدم دو ایک بار صرف اس بات کا یقین کرنے کے لئے.
>> تو میرا کارڈ اعتراض ہے، اور ہم اپلی کیشن کے لئے اس کارڈ دے رہے ہیں.
اور اے پی پی لینے کے لئے کی جا رہی ہے کارڈ اور اس CardView کو دے.
اس CardView اگر، کا کہنا ہے کہ ، مجھے کوئی اعتراض flashcard سے دے
میں نے اس سوال باہر پرنٹ کریں گے اور اس کا جواب، ٹھیک ہے؟
>> تو میں کیا کر سکتا ہوں کر سکتے ہیں ہے ، سب سے پہلے اس کوڈ بھیجیں
میرے دوست کے لئے اپنے کوڈ کے 10 لائنیں، کی طرح.
انہوں نے کہا کہ اس میں یمبیڈ کر سکتے ہیں اپنی درخواست.
اور اس نے وہی کام کیا جب تک کے طور، ، CardView کارڈ اس کے برابر کی طرح
وہ CardView پیدا کے طور پر اور یہ صحیح معلومات دی،
وہ اپنے کارڈ رینڈر سکتا.
اور اس طرح اس طرح، یہ ایک بہت ہے آپ کو تعمیر کرنے کے لئے ٹھنڈی طریقہ
صحیح، ایک دوسرے استعمال کرتے ہیں کہ اجزاء؟
یہ کارڈ، میں شائع کر سکتے ہیں انٹرنیٹ پر اس CardView،
اور لوگوں کو استعمال کرنے کے قابل ہو جائے گا.
تو بنیادی طور پر، اس کا ایک طرح ہے سی لائبریری میں معیاری کام کرتا ہے.
>> یہ ایک تقریب ہے جہاں کسی کو اس میں لکھا ہے.
آپ کو ایک مخصوص پٹ دے.
یہ ایک مخصوص پیداوار پیدا کریں گے.
تم نے اسے اندرون ملک کیسے کام کرتا ہے کی پرواہ نہیں کرتے.
جب تک آپ کو یہ حق دینے کے طور پر ان پٹ، یہ درست پیداوار بنا دیں گے.
>> اور ایک جزو ہو سکتا ہے اسی طرح کے بارے میں سوچا.
یہ CardView کی طرح ہے ایک لائبریری تقریب.
آپ اسے کچھ کارڈ دے تو ایک جائیداد کے طور پر، یہ کروں گا
اس کارڈ کے مندرجات باہر پرنٹ.
میں اپنی کارڈ کو تبدیل تو طرح بجائے 5 پلس 37 کی طرح کیا،
اس کے مطابق اپ ڈیٹ کرے گا.
تو ان پٹ تبدیل کرنے کی طرف، یہ ایک خاص پیداوار ہے.
تو آپ کو تقریبا اجزاء کے بارے میں سوچ کر سکتے ہیں اس طرح کام کرتا ہے، کے طور پر جس
آپ کے ساتھ ڈال کر سکتے ہیں.
آپ کو اس CardView طرح، ان پٹ حاصل ان پٹ کے طور، آپ کی پیداوار حاصل.
اس صورت میں، پیداوار HTML ہے.
اب تک کوئی مطلب ہے؟
ٹھنڈا، تو پھر، خصوصیات ہیں آپ کی معلومات کو منتقل کر سکتے ہیں کہ کس طرح
میں اور اجزاء کے باہر.
>> ٹھیک ہے، تو اس بنا دو بات انٹرایکٹو.
ٹھیک ہے اب یہ بورنگ کی طرح ہے.
[اشراوی] کیا ہے؟
آپ کو کچھ باہر پرنٹ کر سکتے ہیں لیکن یہ کیا کر سکتے ہیں ہے.
>> تو واپس جانے صرف اب کے لئے پرانے سوال.
ٹھیک ہے، تو اب ان اجزاء تمام وہ ایسا کرتے ہیں کیونکہ بورنگ رہے،
وہ ان پٹ حاصل.
وہ پیداوار، صحیح ہے؟
یہ بورنگ کی طرح ہے.
ہمارے کرنا چاہتے ہیں اجزاء کے قابل ہو جائے کرنے کے لئے
اندرونی ریاست کے کچھ قسم کی، کی طرح کچھ یاد.
>> ایک flashcard سے کے لئے، کے لئے ریاست کی مثال، کس طرح
آپ کو چاہتے ہو سکتا ہے ایک flashcard سے کے لئے یاد ہے؟
کیا عارضی حیثیت آپ کو یاد کرنا چاہتے ہیں
ایک flashcard سے اپلی کیشن میں ایک flashcard سے لئے؟
سامعین: یہ بس الٹ رہا ہے کہ آیا؟
اونیل مہتا: صحیح، ہاں.
تو آپ کو رکھنے کے لئے چاہتے ہو سکتا ہے کا ٹریک آپ کو سامنا کرنا پڑتا ہے یا ہیں
آپ کارڈ پر نیچے کا سامنا.
فیس بک پر، مثال کے طور پر، آپ چاہتے ہیں نیوز فیڈ میں جہاں یاد کرنا چاہتے ہیں
تم ہو یا پروفائل کون ہے پسند تم ابھی کر رہے ہیں.
>> رسول، کیا متن آپ کی طرح صحیح، ان پٹ باکس میں ٹائپ کریں؟
آپ صفحے کو ریفریش، تو یہ دور ہو جاتا ہے.
لیکن اگر تم واقعی پرواہ نہیں کرتے.
یہ صرف عارضی ہے.
جی ہاں؟
>> سامعین: [اشراوی]
اونیل مہتا: ایک فلیش کی طرح کارڈ، آپ کو دیکھ کر کیا جا سکتا ہے کی طرح
سوال طرف یا جواب کی طرف؟
>> سامعین: ٹھیک ہے.
>> اونیل مہتا: کی طرح ایک صحیح، flashcard سے دو رخا؟
جی ہاں، تو آپ کرنا چاہتے ہیں اب کے اس خیال ہے
میں، آدانوں کی طرح ہے جو، خصوصیات ہیں لیکن اہ، عارضی ہے جس میں ریاست،،
آپ کے صفحے پر ہیں جہاں، ٹھیک ہے؟
ایک بار پھر، میں نے فیس بک میں کہا رسول، میں جس شخص کی طرح ہے
اگر آپ فیس بک دیکھ رہے یا کون صحیح، پروفائل ہے؟
>> یہ صرف عارضی ہے.
یہ صارف کو دکھانے کے لئے ضروری ہے کیا چل رہا، لیکن صفحے کو ریفریش ہے.
یہ واقعی کوئی فرق نہیں پڑتا.
تو یہ، عارضی حالت ہے اس لئے ہم سب یہ ریاست.
>> تو، ایک بار پھر، ریاست اور جاتا ہے.
سہارے پٹ دیا جاتا ہے آپ کے ڈیٹا کے ذریعہ سے.
ریاست صرف ڈیفالٹس طرح ہے.
یہ چیزیں کی طرح ہے کہ بات انٹرایکٹو بنا دیتا ہے.
>> میں تو ہمارے CardView-- کی ہے دو ہمارے CardView-- یہ اچھا تھا تو.
ہم یہاں کیا کرنے جا رہے ہیں، ہم جا رہے ہیں CardView اور صرف CardView چھونا.
اور اس طرح میرے دوست یہ وہ، ہے جو کوئی فرق محسوس نہیں کریں گے.
وہ تبدیل کرنے کی ضرورت نہیں کرے گا ان کے اپنے کوڈ کے کسی بھی،
لیکن وہ دیکھنا چاہتے ان CardView اوپر souped گیا.
کہ اس کے اجزاء کے بارے میں ایک اچھا حصہ ہے.
>> ٹھیک ہے، ہمارے CardView میں اتنی، کرنے کی کوشش کریں اور ہم اپ مرحلے رہے ہیں کے ٹریک رکھنے کے
یا نیچے کا سامنا.
ردعمل میں ہم سب سے پہلے کی طرف سے ایسا ابتدائی حالت کی وضاحت.
جہاں کارڈ شروع ہوتا ہے؟
>> تو getInitialState نامی ایک تقریب ہو کام، اور ہم کسی چیز کو واپس.
یہ اعتراض، کچھ ریاستی مشتمل ہے اور حالت صرف ایک اہم قدر جوڑی ہے.
ہدایت کی طرح، آپ کو ایک چابی اور ایک ہے نام ایک تار ہے جیسے قیمت، آپ کو کرنا پڑے.
>> اس صورت میں، کے سامنے سچ ہے کا کہنا ہے کہ.
یہ ہم نے ایک ریاست ہے کا کہنا ہے کہ.
ریاست کے ایک جزو سامنے نامی ایک وصف ہے.
[اشراوی]، پہلے سے طے شدہ کی طرف سے، ہم کارڈ کے سامنے میں ہیں،
اور ہم نے اس کو تبدیل کر سکتے ہیں کے طور پر ہم کارڈ پلٹائیں.
کوئی مطلب ہے؟
>> ٹھیک ہے، تو میں ابھی، ہم، رینڈر سوال اور جواب دکھا.
اب ہمیں کیا کرنا چاہئے سوال دکھا رہا ہے
ہم کارڈ کے سامنے پر ہو تو جواب کارڈ کے پیچھے کے لئے ہے.
آپ سب کو یہی وجہ ہے کہ کارڈ انٹرایکٹو.
تو اور اس کے لئے یہاں کی کوشش کریں.
ویسے، سب سے پہلے صرف ایک متغیر بنانا.
ہم this.state.front اب پوچھ سکتے ہیں.
ہم ایک ہی ہم ریاست تک رسائی حاصل رسائی جاتا، تو this.state.front.
>> ہم سامنے ہیں تو، پھر متن this.props.card.question ہے.
ہم کے سامنے پر ہیں تو کارڈ، ہم کوشش کریں اور قبضہ کرنے کے لئے جا رہے ہیں
کارڈ سے سوال.
دوسری صورت میں، ہم واپس پر ہیں تو کارڈ کی، ہم کیا کرتے ہیں؟
>> سامعین: جواب؟
>> اونیل مہتا: جی ہاں، اس لئے متن this.props.card.answer برابر.
اگر آپ کو نوٹس، ہم استعمال کر رہے ہیں ریاست فیصلہ کرنے کے لئے
اب جزو کی وجہ سے مختلف نظر آئے گا
ان کے ساتھ بات چیت کس طرح دور کی بنیاد پر.
تو بجائے اس سے باہر پرنٹنگ کے، ہم صرف متن کے باہر پرنٹ کریں گے.
ٹھنڈی، اب، آپ کو دیکھ کے طور پر، ہم صرف سوال.
اور میں دستی طور پر یہاں ریاست بدل جاتا ہے تو سامنے جھوٹی ہے ہم 42 واپس حاصل.
>> تو، ایک بار پھر، اس کے اتحادیوں اپنے ریاست ہے.
ایک بٹن چاہے وہ جانتا ہے کی طرح یہ، دبایا یا نہیں رہا ہے
اس بات پر کیا ہے سامنے یا پیچھے.
ڈیفالٹ کی طرف سے، اس کے سامنے پر ہے.
اور پھر اس کے سامنے پر ہے، ہم سوال باہر پرنٹ کریں گے.
اس کی پیٹھ پر ہے تو، ہم کریں گے جواب باہر پرنٹ.
تو، ایک بار پھر، معلومات دی ہی ہے.
یہ صرف مختلف لگ رہا ہے آپ اس پروگرام کتنا پر مبنی.
تو، مثال کے طور پر، فیس بک رسول، آپ کو ایک ہی ڈیٹا کا ذریعہ حاصل یہاں تک کہ اگر،
یہ مختلف نظر ہو سکتا ہے ریاست مختلف ہے کیونکہ.
آپ دیکھ رہے ہیں مختلف شخص کا پیغام.
>> ٹھیک ہے، تو یہ سب ٹھیک ہے اور اچھا، لیکن اب کیا اصل ہے
چاہے، تبدیل کرنے کے قابل بنانے کے ہماری کارڈ سامنے یا واپس آ گیا ہے.
ہم ایک فلپ انہوں نے مزید کہا کی طرف سے ایسا کر سکتے ہیں بٹن، کارڈ کے لئے ایک بٹن ہے
یہ [اشراوی] ہے تو کارڈ پلٹائیں گے.
لہذا یہاں کی، یہ ایک بٹن شامل ہیں بٹن، اور اس بٹن فلپ کہیں گے.
>> اور تو اب، یہ کچھ بھی نہیں ہے.
یہ اچھا لگ رہا ہے.
کیا ہم کر سکتے ہیں ہم نے ایک پر کلک کریں کر سکتے ہیں ہے ہینڈلر، ہیں OnClick، this.flip برابر
اور ہم نے فلپ کی وضاحت کریں گے.
لیکن بنیادی طور پر، ہیں OnClick ایک تقریب ہے کہ
صارف اس پر کلک کرتا ہے جب بلایا جاتا ہے.
>> تو بٹن پتہ چل جائے گا اس پر کلک کیا گیا ہے جب.
اس پر کلک کیا گیا ہے گیا، یہ کارڈ پلٹائیں گے.
یہ آپ کی طرح کی طرح ہے پججا کی ترسیل آدمی.
آپ، کی طرح تمام صحیح ہو، جب بھی کسی میں نے صحیح، پیزا فراہم کریں گے، مجھے بلاتا ہے؟
>> آپ کو اس سامع رجسٹر کریں.
آپ کو ایک تقریب کے لئے سننے کے.
آپ کو بلایا، اور جب جاتے ہیں واقعہ آپ کو کچھ ہوتا ہے.
آپ کو pizza کے حاصل.
اس صورت میں، جب آپ ہیں کلک، آپ کارڈ پلٹائیں.
>> اور اس طرح ہم نے ایک وضاحت کرنے کی ضرورت کارڈ پلٹائیں گے اس تقریب،
تو ہم اس کا حق لکھیں گے یہاں، تقریب پلٹائیں.
اور اس لئے تم فلپ کروں گا کیا سوچتے ہیں؟
پھر اس وقت بلایا جاتا ہے ہم فلپ بٹن پر کلک کریں.
فنکشن پلٹائیں کیا کرنا چاہیے؟
>> سامعین: تبدیلی this.state.front سچی سے درست کرنے کے لئے جھوٹے، جھوٹے کے لئے.
>> اونیل مہتا: جی ہاں، تو لے جو کچھ بھی this.front سامنے ریاست ہے is--.
تو، سامنے ریاست لے لو یہ جھوٹے بنانے، سچ ہے.
یہ جھوٹ ہے تو، صحیح، یہ سچ ہے؟
تو چلو کہ کی کوشش.
>> تم حالت کو تبدیل نہیں کر سکتے ہیں صرف this.state کر.
تم ایسا نہیں کر سکتے.
آپ کو ایک تقریب کا استعمال کرنا پڑے this.setState بلایا.
>> تو آپ this.setState سامنے کہہ سکتے ہیں بڑی آنت یہ کہاں، ایک بار پھر، فجائیہ
نقطہ مخالف کا مطلب.
میں اگر یہ لگتا ہے. state.front سچ ہے، یہ باطل تبدیل کر دونگا.
تو ہم ریاست قائم کریں گے سچی سے جھوٹے.
یہ جھوٹ ہے تو، ہم کریں گے درست کرنے کے لئے یہ باطل مقرر.
>> بس ہم نے مقرر اور تھوڑا سا حاصل ہے کہ نوٹس مختلف، اور تو اس کی کوشش ہے.
بڑا بنگ، یہ دیکھو.
پلٹائیں بٹن اب گے ریاست واپس سامنے سوئچ.
>> آپ دیکھ اور کہاں تو یہاں ہے ردعمل کے جادو کے تھوڑا سا.
ہم اس سے کبھی نہیں کہا کی طرح اسے دوبارہ رینڈر کرنے کے لئے.
ہم نے اسے کچھ redraw کبھی نہیں بتایا.
آپ کو اس کر رہے ہیں ردعمل کے بغیر، تم ہوتا
جب to-- پسند ہے پلٹائیں بٹن، کلک کیا جاتا ہے
آپ کو یہ بتانے کے لئے پڑے گا دستی طور پر صحیح، دوبارہ رینڈر؟
>> واقعی میں ٹھنڈا ہے رد عمل کا اظہار ہے کہ اگر آپ کو یہ ایک مخصوص ریاست اور خصوصیات دے،
یہ ہمیشہ فراہم کرے گا بالکل وہی بات ہے.
اور اس طرح ہم نے کبھی ہم کو تبدیل جب ریاست اور خصوصیات،
رد عمل کا اظہار صرف پوری بات دوبارہ دیتا.
یہ ایک ہے کہ وہاں جانتا ہے ون ٹو ایک خط و کتابت
ریاست اور پیرامیٹر اور ایچ ٹی ایم ایل کے درمیان.
جب بھی ان میں سے کسی ایک سیٹ کی طرف سے ریاست کے ذریعے تبدیلی،
اسے تبدیل کریں گے کہ کس طرح تنخواہ دوبارہ مہیا کیا جاتا ہے.
اور تو بنیادی طور پر رد عمل کا اظہار کی طرح ہے آپ کو تبدیل کرنے کے لئے انتظار کر رہے ہیں.
>> جب یہ کچھ تبدیل، اس پورے صفحے دوبارہ رینڈر گا.
اور یہ غیر موثر لگتا ہے تو، یہ ہو جائے گا اس کی وجہ سے، ہے
لیکن رد عمل کا اظہار کسی چیز استعمال کرتا ایک شیڈو ڈوم نامی.
اس کے بجائے براہ راست صفحے ڈرائنگ کی، یہ یاد میں مجازی HTML درخت رکھتا ہے.
>> تم جانتے ہو، ایچ ٹی ایم ایل ایک درخت کی طرح ہے، ایک پدانکردوست آنکڑا ڈھانچہ کی طرح.
یہ یاد میں ایک جعلی درخت رکھتا ہے اور آپ کے صفحے کو اپ ڈیٹ جب بھی،
یہ ایک جعلی اپنی طرف متوجہ کریں گے درخت اور اس کا حساب لیں گے
کیا اسے بنانے کے لئے کی ضرورت ہے کو تبدیل کرنے صفحہ دو درختوں کے برابر کرنے کے لئے.
تو بنیادی طور پر، یہ عملی طور پر ایک بہت دوبارہ دیتا.
اور پھر یہ صرف کی طرح تبدیلیاں تھوڑا سا انداز میں صفحہ کی ضرورت کے طور پر،
تو یہ بہت، بہت، بہت موثر ہے.
>> تو بنیادی طور پر ردعمل ظاہر کریں گے جب بھی آپ کو کچھ تبدیل،
یہ دوبارہ رینڈر تقریبا صفحے گا.
یہ میں نے کرنے کی ضرورت ہے پتہ لگا لیں گے اصلی صفحہ عکاسی کرنے کے لئے تبدیل
مجازی صفحے، اور یہ کہ کروں گا.
کہ مجازی ڈوم ہے.
یہ سب سے بڑا میں سے ایک ہے کی خصوصیات ردعمل.
>> اس کا کوئی مطلب ہے؟
کوئی سوال؟
جی ہاں؟
>> سامعین: کس طرح کرتا ہے MVC اب بھی آپس میں موازنہ
ہم کے بارے میں بات کی ہے کہ جیسے وسائل سے پہلے.
>> اونیل مہتا: جی ہاں، سوال یہ MVC کا موازنہ کرتا ہے کس طرح ہے؟
آپ کو وسائل کے بارے میں پوچھا.
ٹھیک ہے، اس کے افعال کے بارے میں بات کرتے ہیں.
>> MVC میں، آپ کو ماڈل کو اپ ڈیٹ کروں گا.
اس صورت میں ہم نے ایک کارڈ ماڈل پڑے گا.
نقطہ نظر پڑے گا فلپ کے بٹن، اور کنٹرول
فلپ تقریب پڑے گا.
تو نقطہ نظر کو بتائیں گے کنٹرولر پلٹائیں پلٹائیں کرنے کے لئے.
پلٹائیں بتائیں گے تبدیل کرنے کے لئے ماڈل، ٹھیک ہے؟
>> اور اس لئے تم ایک MVC آپ، کرتے ہیں جب ماڈل کو تبدیل کرنے کے لئے سننے،
اور آپ کو دوبارہ رینڈر کے مطابق نقطہ نظر.
یا آپ کو صرف کی طرح کرنا ہے کنٹرولر ہے.
پھر ماڈل کو تبدیل کرنے کے لئے انتظار کریں، اور لینے اور ایک چیز کی طرح کا ایک حصہ منتخب کریں
بدلنا.
یہاں ہم ایک بات ہے، لیکن ایک بڑا اپلی کیشن میں،
آپ کو کیا یاد کی طرح کرنا ہے ہر ایک جگہ میں تبدیلی،
تو یہ ایک چھوٹا سا پریشان ہے.
اور بہت اچھا ہے رد عمل کا اظہار یہ ایک شیڈو ڈوم ہے کیونکہ.
یہ صرف کرنے کے متحمل کر سکتے ہیں پوری بات کو دوبارہ سے لکھنا.
آپ کو مہیا کرنے کی ضرورت نہیں طرح اپ ڈیٹ کرنے کے کیا لگتا ہے.
>> فیس بک پر اگر تم چاہو تو MVC میں، ایک نیا پیغام ملے،
آپ کو یاد کرنا پڑے گا ٹھیک ہے، چیزوں کو تبدیل
کے سب سے اوپر صفحہ، پیغام آئکن.
علاوہ نچلے حصے میں ایک نئی ونڈو پاپ.
اس کے علاوہ اس ونڈو میں ایک نئی چیز بنانے.
اس کے علاوہ ایک آواز ادا.
>> وہ سامان کی ایک بہت ہے ایک ہی وقت میں باہر جا.
اور تم نہیں جانتے تو ایک شیڈو ڈوم ہے، تم ہوتا
کہ دستی طور پر کی وجہ سے کرنا پڑے آپ کو پورے صفحے کے چھٹکارا حاصل نہیں کر سکتے.
آپ کو متحمل نہیں ہو سکتا، تو آپ کے پاس دستی طور پر ہر چیز کو تبدیل کرنے،
جس MVC میں واقعی پریشان کن ہے.
>> تو ترتیب میں ہونا دوستوییی، وہ مہیا
ہے جس میں، صفحے کو اپ ڈیٹ موثر، بلکہ پریشان.
کیونکہ سائے کے رد عمل کا اظہار ڈوم، آپ مفت کے لئے دونوں چیزوں کو حاصل.
یہ موثر ہے کیونکہ شیڈو ڈوم کی.
bottleneck کے صفحے کو اپ ڈیٹ ہے.
یہ درخت ہیرا پھیری نہیں کر رہی.
آپ کی کارکردگی ملتا ہے.
آپ کو بھی استعمال میں آسانی کی وجہ سے حاصل آپ کو صرف پورے صفحے کو دوبارہ سے لکھنا تو،
لیکن آپ کو صرف، ٹھیک، چیزوں کو جانتے ہیں کہیں صفحے پر جا رہے ہیں.
یہ ایک مختلف جگہ میں ہوں، لیکن ہو سکتا ہے یہ درست ہے، صفحے پر ہونے جا رہا ہے؟
تو کیا تم صرف دوبارہ مہیا پوری بات عملی طور پر،
اور آپ کو ایک جوڑے بنا سکتا ہے صفحے کو خود میں تبدیلی.
>> تو، ایک بار پھر، MVC میں انتخاب کرنا پڑے گا
استعمال اور کارکردگی کی آسانی کے درمیان، اور تم دونوں ملے، رد عمل کا اظہار.
تو یہ بہتر ہے.
کوئی مطلب ہے؟
ٹھوس.
>> ٹھیک ہے، تو چلو بات کرتے دیکھتے ہیں مرحلہ 4 کے بارے میں تھوڑا سا،
ہم کس طرح اجزاء یمبیڈ کر سکتے ہیں.
تو اب ہم اس کا حق ہے.
ہم اپنے ٹھنڈا چھوٹے بٹن ہے.
ہم اسے واپس پلٹائیں کر سکتے ہیں اور نکل، اور یہ کہ یہ سب کرتا ہے.
ہم کرنا چاہتے ہیں کا کہنا ہے کہ ایک جزو ہے.
ہمارے flashcard سے اپلی کیشن ہونا چاہئے کہتے ہیں تمام کارڈ کی ایک فہرست پر مشتمل ہے
آپ کو کرنا پڑے، تاکہ ہم کا مطلب ہے کہ ایک اور اتحادی ہونا چاہئے.
ٹھیک ہے، شاید ایک فہرست دیکھیں یہ کہتے ہیں.
کی ایک فہرست دیکھیں بنا دو کہ CardView ساتھ coexists،
اور یہ فہرست دیکھیں اور CardView ساتھ مل کر کام کو پسند کریں گے.
اور اگر تم ان کو اکٹھا کر سکتے آپ کے لئے ہماری اپلی کیشن بنانے کے لئے.
>> تو سب سے پہلے، ایک بنانے جوڑے سے زیادہ کارڈ حق.
چلو کا کہنا ہے، کیا کارڈز؟
اور صرف اس میں نہیں ہے اس میں ٹائپنگ کے ساتھ بور آپ،
میں نے صرف اسے یہاں سے کاپی کرنے کے لئے جا رہا ہوں.
اور اس میں نہیں جا رہا ہوں یہ صرف ایک کارڈ دے.
میں یہ کارڈ کی ایک سرنی دینے جا رہا ہوں.
تو سب سے پہلے اطلاقات اب کے لئے کو توڑنے کے لئے جا رہے ہیں.
ٹھیک ہے، تو ہم بنانے کے لئے جا رہے ہیں اس کے قابل ایک سے زیادہ کارڈ کو ہینڈل کرنے میں.
تو سب سے پہلے، ہم اسے دینے کے لئے نہیں جا رہے ہیں صرف ایک کارڈ لیکن کارڈ کی ایک سرنی،
کارڈ کی ایک فہرست کی طرح.
اور اس معاملے میں، ہم نے ان میں سے تین ہے.
>> ٹھیک، اپلی کیشن ہے تو ایک فہرست کارڈ حاصل کرنے کے لئے جا،
اور یہ فیصلہ کرنے جا رہی ہے جس ایک CardView کو دکھانے کے لئے.
CardView صرف کر سکتے ہیں ایک کارڈ، لیکن اے پی پی رینڈر
ٹھیک ہے، کارڈ کی ایک فہرست ہے؟
>> لہذا آپ کو ایک پتہ جب کارڈ، CardView کو دینے کے لئے
آپ کے قابل ہو سکتا ہے لگتا ہے گا کہ کس طرح ایک فیصلہ کرنے کے لئے جس میں کارڈ کے بارے میں
دکھانا؟
آپ کو ایک اشارہ دینے کے لئے، یہ عارضی طور پر ہے آپ کو ایک مخصوص کارڈ دیکھنے جائے گا.
آپ صفحے کو ریفریش تو، تمہیں صرف واپس سب سے پہلے کارڈ پر جائیں.
یہ عارضی طور پر ہے کیونکہ یہ ٹھیک ہے.
ہم کیا ٹیکنالوجی کا استعمال ہو سکتا ہے؟
>> سامعین: آپ کو ایک متغیر کر سکتا ہے تو آپ کے سامنے تھا کی طرح.
یہ سچ ہے، آپ کر سکتے تھے موجودہ کارڈ 1 کے برابر ہے؟
>> اونیل مہتا: جی ہاں، ہم ایسا صحیح، ریاست کرنا چاہتے ہیں؟
تم میں ریاست کا استعمال کریں گے جزو معلوم کرنا
جس میں کارڈ ہم حاصل کرنا چاہتے ہیں.
کی طرح ہم کی ایک فہرست ہے تمام کارڈز، ہم کریں گے
پتہ کرنے کے لئے ریاست کو استعمال پہلے کارڈ کی ایک،
اسی طرح دوسرے کارڈ، تیسری کارڈ، اور.
>> تو ایک اپلی کیشن تاکہ ایک اپلی کیشن ایک ملے گا ، getInitialState تقریب ہے
getInitialState تقریب واپسی.
اور ہم صرف activeIndex 0 کہیں گے.
تو اب ہمارے اپلی کیشن اس کی اپنی ریاست ہے.
>> اور اس طرح اب پتہ کرنے کے لئے، رینڈر ایک کارڈ، صرف سرنی کے لئے جانے دو
اور یہ کہ انڈیکس میں بات قبضہ.
منتخب کارڈ برابر this.props.cards this.state.activeIndex.
آپ کو یہاں دیکھ کے طور پر تو، props اور ریاست اصل مل کر کام کریں.
تو اب ہم ہمارے activeCard ہے کہ، ہم اس activeCard فون کروں گا
اور یہ کام کرتا ہے تو دیکھتے ہیں.
[اشراوی]
>> اوہ، کہ ایک متن غلطی تھی.
آہ.
>> ٹھنڈی، جی ہاں، تو اب ہم واپس تھے ہم سے پہلے کہاں تھے، ٹھیک کرنے کے لئے؟
سوائے ایک ہی پرانے پروگرام اب ہم حمایت کر سکتے ہیں
کارڈ کی ایک فہرست، نہ صرف ایک کارڈ.
اور اب، ایک بار پھر، ہم کو تبدیل تو activeIndex، ہم 0 سے 1 تک جا سکتے ہیں
اور اب اس دوسرے کارڈ، اور پھر ہم 0 گیا.
تو یہاں ایک نیا souped اپ ہمارے ورژن.
>> ٹھیک ہے، تو اب ہم ایک فہرست دیکھیں پڑے دو کہ ، آپ کے پروگرام میں تمام کارڈ کو ظاہر کرتا ہے
تو ہم نے ایک نیا بنا لیں گے جزو listView بلایا.
listView react.createClass برابر ہیں.
تو ہم ایک بے ترتیب فراہم کرنے کے لئے چاہتے ہیں ہر کارڈ کے لئے ایک فہرست کی اشیاء کے ساتھ کی فہرست.
اور اس طرح ہم کارڈز کے ایک گروپ ہے.
ہم ایک فہرست کی اشیاء چاہتے ہیں ہر کارڈ کے لئے، ٹھیک ہے؟
ہم لوپ کے لئے ایک کر سکتے ہیں یا کچھ نئی فہرست مرتب شے بنانے کے لئے.
لیکن جس طرح تم میں ایسا رد عمل کا اظہار، نقشہ نامی کسی چیز کا استعمال کرتے ہیں.
نقشہ ایک آلہ یا آپ استعمال ایک تقریب ہے کہ ہر شے کے لئے، کچھ تقریب چلتا ہے،
واپسی کی قیمت لیتا ہے، اور آپ کو اس واپس دیتا ہے.
>> ایک مثال کے طور، ہم صف ہے تو 1، 2، 3.map function-- اور اس
ایک کے لئے آشلپی ہے function-- X تیر X اوقات ایکس.
یہ ہر تعداد کے لئے، کا کہنا ہے کہ 1، 2، 3، اسے لے لو.
یہ مربع، اور اسے واپس دے.
تو آپ 1 کیا سوچتے ہیں، 2، 3.map ایکس اوقات کو جاتا ہے
X آپ کو واپس دیا دیتا اس تقریب ہے
اس صف کے ہر عنصر پر چلاتے ہیں.
>> سامعین: 1، 4 9
>> اونیل مہتا: جی ہاں، 1، 4، 9 آپ 1 بار 1 کرتے ہیں کیونکہ.
کہ آپ کو ایک دیتا ہے.
یہ پہلی عنصر ہے.
>> 2 مرتبہ 2 4 ہے.
کہ ایک دوسرے عنصر ہے.
3 اوقات 3 9.
یہ ایک تیسرا عنصر ہے.
کوئی مطلب ہے؟
تو نقشہ ایک ٹیکنالوجی ہے آپ فنکشنل پروگرامرز میں استعمال کرتے ہیں،
کے نئے سٹائل کچھ کرنا پروگرامنگ
آپ کی فہرست میں ہر عنصر کے لئے.
اور اس طرح یہ واقف لگتا.
ہم کارڈ کی ایک فہرست ہے.
ہم ہر ایک کے لئے ایک فہرست کی اشیاء حاصل کرنے کے لئے چاہتے ہیں ایک، تو ہم صرف یہاں نقشے کا استعمال کریں گے.
ہم نے فہرست برابر دو، کہیں گے this.props، کارڈ، نقشہ.
>> اور اس طرح ہم ہیں، ایک کارڈ دیا ایک فہرست کی اشیاء پیدا کرنے کے لئے جا رہا
اس کے اس کارڈ کے مواد کی طرف سے.
صرف ہم باہر دینے کے لئے چاہتے ہیں، کارڈ تو card.question سوال.
تو اس فہرست پر مشتمل ایک لشکر اسلام کے یا اشیا کی فہرست کی ایک سرنی
جہاں ایک فہرست ہے ہر کارڈ کے لئے اشیاء،
اور یہ کہ کارڈ سوال پر مشتمل ہے.
کوئی مطلب ہے؟
>> ٹھنڈا، تو اب چلو اصل میں اس سے باہر پرنٹ.
تو ہم نے ایک UL واپس آ جائیں گے.
کہ بے ترتیب فہرست کے اندر، ہم صرف پورے فہرست رہنا گے
انہوں نے ہمیں دیا ہے.
ٹھنڈا.
>> ٹھیک ہے، تو اب یہ فہرست دیکھیں صرف تلاش کام.
فہرست دیکھیں کے بارے میں کوئی سوال ہے؟
آپ کارڈ کا ایک گروپ ہے.
آپ کو ہر کارڈ کے لئے ایک فہرست کی اشیاء بنانے کے.
اور آپ کو ایک بے ترتیب کے اندر ڈال فہرست، اور تم نے اسے واپس دے.
تو اب تو ہم یمبیڈ کام دو ہماری اے پی پی کے اندر،
تو ہم، فہرست دیکھیں ایسا کر سکتے ہیں.
کیا دلیل ہم نقطہ نظر کی فہرست پر منتقل کرتے ہیں؟
کیا خصوصیات ہم اسے دے سکتا ہوں؟
آپ کو دے تو یاد رکھیں یہ کارڈ میں سے ایک گروپ،
اس کی فہرست بنا دیں گے ان کارڈز کے لئے دیکھ سکتے ہیں.
تو ہم کیا گزر جائے گا یہاں دلیل کے طور پر؟
سامعین: کارڈ کی ایک فہرست؟
اونیل مہتا: جی ہاں، تو کارڈ صحیح، this.props.cards برابر ہے؟
اور اس طرح صرف ایک مسئلہ کہ آپ کو صرف کر سکتے ہیں ہے
، رینڈر میں ایک سب سے اوپر کی سطح کو منتخب عنصر دیا لہذا آپ کو ایک div میں لپیٹ کرنے کے لئے ہے.
یہ عجیب ہے.
تو ہے کہ اگر دیکھتے ہیں.
کہ کام کرتا ہے؟
>> جی ہاں، تم وہاں جاؤ.
تو اب ہم ایک فہرست ہے نچلے حصے میں کارڈوں کی،
اور پھر ہم اپنے ہے سب سے اوپر پر خود CardView،
اور اس کے درمیان پلٹائیں گے کارڈ کے دونوں اطراف.
اب میں نے اس نے کس طرح اس کا احساس ہے؟
جی ہاں، تو پھر، ہم دو اجزاء ہیں.
پہلا جزو پرنٹس باہر فہرست میں ہر کارڈ.
اس فہرست نقطہ نظر ہے.
اور دوسرا جزو صرف یہ ہے کہ کارڈ باہر پرنٹ.
تم نے اسے ایک مخصوص کارڈ دے، تو یہ کروں گا اس کارڈ کے بارے میں معلومات کو پرنٹ
اور آپ کو آگے پیچھے پلٹائیں دو.
>> ہم چاہتے ہیں تو، ہم کوشش کرتے ہیں اور بات کر سکتے ہیں تو اس کے لئے کچھ نئی خصوصیات شامل کرنے کے بارے.
دوسری صورت میں ہم تھوڑا سا زیادہ بات کر سکتے ہیں ری ایکٹر کی رفتار کے بارے میں،
یا ہم جواب دے سکتے ہیں سوالات آپ ہو سکتا ہے
ان کی وجہ سے بنیادی حصوں کے ہیں میں نے کے بارے میں بات کرنا چاہتا ہوں کہ رد عمل کا اظہار.
ہم آگے جا سکتے ہیں.
ہم سوال کا جواب کر سکتے.
تمہیں جو بھی چاہیئے.
>> سامعین: آپ استعمال کر سکتے ہیں عام جاوا اسکرپٹ میں JSX؟
یا کہ کچھ ہے کہ [اشراوی] کے ساتھ آئے تھے؟
>> اونیل مہتا سوال کر سکتے ہیں ہے آپ کو معمول کی جاوا سکرپٹ کے ساتھ JSX استعمال کرتے ہیں؟
جواب ہاں میں ہے.
JSX صرف اس کا ایک طریقہ آپ کے لیتا ہے اس کے اندر ایچ ٹی ایم ایل ہے کہ جاوا اسکرپٹ،
اور یہ جاوا سکرپٹ میں آگاہ ہے کہ اس کے اندر ایچ ٹی ایم ایل کی ضرورت نہیں ہے.
تو یہاں محسوس that-- محسوس.
آپ div کی طرح ہے جیسے یہ لگتا ہے اور آپ کو اس کے اندر چیزیں ہیں.
>> جاوا سکرپٹ کے لئے آگاہ ہے کہ کی طرح ایک ہی چیز پیدا.
میں کیا کہہ رہا ہے کہ لگتا ہے یہ ہے جیسے JSX، صرف ایک نحوی ہے
جاوا سکرپٹ کے لئے ایک پریپروسیسر زیادہ پی ایچ پی کی طرح ایچ ٹی ایم ایل کے لئے ایک پریپروسیسر ہے.
JSC ایک پریپروسیسر ہے جاوا سکرپٹ کے لئے کی اجازت دیتا ہے کہ
آپ آپ کو جاوا اسکرپٹ کے اندر HTML ڈال.
اور تو آپ کو حق ہے تو ٹرانسفارمر جس [اشراوی] نامی ایک چیز ہے،
جس کو تبدیل کرے گا.
حق پریپروسیسر، یہ آپ کو ایسا کرنے دیں گے.
>> سامعین: [اشراوی]
اونیل مہتا: عام طور پر آپ کی ضرورت نہیں جاوا کے اندر ڈال کرنے کے لئے ایچ ٹی ایم ایل
آپ کر رہے جب تک ردعمل.
لیکن آپ ویسے بھی ایسا کر سکتے ہیں.
جی ہاں؟
>> سامعین: میں آپ کو لگتا ہے ردعمل بیان کیا تھا
ایک فعال programing کے زبان کے طور پر.
ہم CS50 میں C سیکھنے کر رہے ہیں.
سی بھی ایک فعال زبان ہے؟
اونیل مہتا: تو سوال فعال کے بارے میں ہے
نامی ایک اور بات بمقابلہ ضروری یا عمل کی پروگرامنگ.
مقبول پروگراموں کی دو قسمیں ہے.
ایک، طریقہ کار کہا جاتا ہے جس ، سب کر حکم دیتا ہے کی طرح کے بارے میں ہے
اور جن میں سے ایک ہے، فعال ہے افعال ہے اور کے بارے میں
ان پٹ اور ان کی پیداوار.
رد عمل کا اظہار ایک فعال مثال ہے.
C ایک بہت طریقہ کار مثال ہے.
>> اور ایک مثال کے طور پر، مثال کے طور پر C، آپ کو اس اعلانیہ راستہ نہیں کرتے
پروگرام بنانے کے، ٹھیک ہے؟
آپ کا کہنا ہے، یہ پرنٹ.
یہ آنکڑا ڈھانچہ تبدیل کریں.
یہ پرنٹ.
یہ سب احکام کے بارے میں ہے.
>> ردعمل میں، وہاں نہیں ہے کہ بہت سے حکم دیتا ہے.
اس کے ہونے کے بارے میں ہے اجزاء آپ کے ساتھ ڈال دیا.
وہ افعال کی طرح ہو.
آپ کو ایک تقریب کی طرح ہے CardView بلایا،
جس میں ایک تقریب ہے کہ، ان پٹ، پیداوار ہے
اور تو رد عمل کا اظہار ہے اس فلسفے کے بارے میں
آپ اعداد و شمار ہیں having-- ہمیں.
آپ کو اس کے ذریعے منتقل الگورتھم، اور یہ کریں گے
ایچ ٹی ایم ایل کی پیداوار ہے کہ آپ کو صرف صفحہ چھپا ہوا،
اور تو آپ کو کرنا پڑے یہ ٹکڑا کی طرف سے ٹکڑا کی تعمیر.
>> پس ایک استعارہ اپنی طرف متوجہ کرنے کے لئے کیا میں نے پہلے کہا، آپ کو کس طرح جانتے ہیں
فیس بک پر آپ کو ایک پیغام ملتا ہے تو اور آپ کو اپ ڈیٹ کرنے کے لئے کیا حصوں کو منتخب،
کہ طریقہ کار ہے.
یہ درست ہے، ضروری ہے؟
ٹھیک ہے، میں نے ایک پیغام ملا.
وہاں اکاؤنٹ کو تبدیل کرتے ہیں.
>> یہاں ایک کھڑکی پاپ ہیں.
وہاں اکاؤنٹ کو تبدیل کرتے ہیں.
یہاں یہ اپنی طرف متوجہ کرتے ہیں.
یہ ایک طریقہ کار کے نقطہ نظر ہے.
>> کہ، کونیی طرح کیا چیزیں فروغ، ریڑھ کی ہڈی، دوسرے فریم ورک کا استعمال کرتے ہیں.
رد عمل کا اظہار فعال ہے.
یہ ایک بہت ہی مختلف طریقہ ہے کی چیزوں کے بارے میں سوچ.
یہ ہے دو کے اس خیال سے لیتا ہے کام کرتا ہے یا کہ آپ کو یلگوردمز
یہ اعداد و شمار دے.
اسے باہر توک گا کیا یہ کمپیوٹر ہونا چاہئے، اور
باہر وزن کی دیکھ بھال کرے گا.
تم نے اسے اپنے آپ کو سنبھال نہیں.
اس معنی کا ایک تھوڑا سا ہے؟
جی ہاں؟
>> سامعین: ایک فعال زبان میں، سب کچھ ایک ہی بار میں کیا ہوتا ہے؟
>> اونیل مہتا: نہیں، چیزوں کے لئے میں ہو.
یہاں کی طرح وہاں اب بھی ہے آرڈر، لیکن یہ نہیں ہے
طرح کے حکم میں ہو ، کمانڈ، کمانڈ کی تعریف.
یہ کے حکم میں ہوتا ہے تقریب آپ کی پیداوار فراہم کرتا ہے.
ایک اور تقریب میں ہے کہ ڈال دیا.
دوسرے میں ڈال تقریب، ایک اور تقریب.
>> آپ CS51 کرتے ہیں، تمہیں فعال پروگرام سیکھنے
اس کے دائرہ کار کا ایک چھوٹا سا.
لیکن بنیادی طور پر، کیا کرتا ہے رد عمل کا اظہار ٹھنڈا نہ صرف ہے
ایک طرفہ ڈیٹا کے بہاؤ اور مجازی ڈوم،
لیکن بھی اس خیال فعال پروگرامنگ.
اور فنکشنل پروگرامنگ کے لئے بہت آسان ہے تحریر اور باہر ٹھنڈی چیزیں بنانے کے لئے،
اور یہ سوچنے کے لئے بہت آسان ہے کے بارے میں اور کے بارے میں وجہ.
تو یہ ردعمل کا ایک اچھا ڈرا ہے.
کوئی سوال؟
جی ہاں؟
>> سامعین: ام، تم کیوں کرے گا متغیر کے طور پر مخالفت کی اجازت استعمال کرنے والا؟
>> اونیل مہتا: تو سوال یہ ہے کیوں آپ اس کے بجائے متغیر کے دو استعمال کرتے ہیں؟
یہ کہا جاتا ہے ایک بات ہے ES6 یا ECMAScript 6.
یہ جاوا سکرپٹ کا نیا ورژن ہے.
تکنیکی وجوہات میں سے ایک گروپ ہے، لیکن لشکر طیبہ متغیر کا ایک بہتر ورژن ہے.
>> آپ متغیر کا اعلان کے لئے کس طرح یہ.
آپ کو دو استعمال کر سکتے ہیں.
تم متغیر استعمال کر سکتے ہیں.
چلو تکنیکی کا ایک گروپ ہے آپ ان دیکھ سکتے ہیں reasons--
یہ بہتر ہے کیوں کے لئے later-- اپ.
بنیادی طور پر، ES6 کچھ اچھا ہے نئے نحو، کچھ نئی خصوصیات
پرانے جاوا اسکرپٹ کا سب سے اوپر پر.
>> تو ہم پانچ منٹ کی طرح ہے.
میں صرف کے بارے میں بات کرنا چاہتا تھا ایک بات اور حقیقی روزہ.
آپ کا کوئی سوال تھا تو، اس کے بعد اس کے بارے میں بات کرتے ہیں.
لیکن صرف تو یہ ملتا ہے کیمرے پر پکڑے گئے، میں نے صرف
آپ کو کس طرح کے بارے میں تھوڑا سا بات کرنا چاہتا ہوں اصل میں آپ کے اطلاقات میں رد عمل کا اظہار کرتے ہیں.
>> آپ یہاں جاتے ہیں، Facebook.GitHub.IO/react،
اس تبصرے کے لئے گھر صفحہ ہے، اور یہ آپ کو اصل کا استعمال کس طرح آپ کو دکھائے گا
اپنے صفحات میں رد عمل کا اظہار.
بنیادی طور پر، یہ ایک چھوٹا سا ہے پیچیدہ ردعمل نصب کرنے کی کوشش.
آپ کو صرف ھیںچیں کے طور پر آسان نہیں ہے اور وہاں میں ایک جاوا اسکرپٹ چھوڑ.
>> آپ کو آپ کے ٹرانسفارمر کی ضرورت ہے اس سے پہلے کے طور پر کیا،، جس میں قائم،
میں آپ JSX باری عام جاوا.
تم نے اس گے بات کرنا پڑے آپ معمول پر ES6 مرتب.
جاوا اسکرپٹ کو منتقل کرنے کے ایک بہت کچھ ہے حصوں تمہیں کیا کرنا ہے، تاکہ ایک چیز ہے
Yeoman، Yeoman.io بلایا.
اور یہ ایک کمانڈ لائن کا آلہ ہے گا ہے آپ کو آپ کے تبصرے کو پاڑ مدد
آسانی سے منصوبوں.
>> لہذا آپ کو اس کے بارے میں پڑھ سکتے ہیں بعد میں، لیکن کچھ اوزار موجود ہیں
Yeoman فراہم کرتا ہے.
انہوں نے ایک رد عمل کا اظہار آپ کی تشکیل دیں گے میں تعمیر سب کچھ کے ساتھ اپلی کیشن.
اس کی تعمیر کریں گے کی طرح اجزاء، میں تعمیر.
یہ آپ کے ٹرانسفارمر میں تعمیر پڑے گا.
وہ ٹھنڈی کی ایک بہت ہے چیزیں خود کار طریقے سے تعمیر
جنریٹرز بلایا ان چیزوں کا استعمال کرتے ہوئے.
>> آپ چاہیں تو اس کے بارے میں پڑھا.
بس Yeoman، Y-E-اے-ایم-اے (ن)، اور پر جانے آپ ان کی طرح جنریٹرز تلاش کر سکتے ہیں.
طرح جنریٹرز کے ساتھ ان، آپ کو صرف ایک کی طرح
ایک جوڑے کمانڈ لائن حکم ہے.
یہ ایک باہر پاڑ گا پورے آپ کے لئے اپلی کیشن ردعمل.
یہ سب دستی پائپنگ حاصل کریں گے، اور گھرگھر کام، آپ کے لئے کیا
اور یہ آپ کو صرف توجہ مرکوز یہی وجہ ہے بس میں لکھنے پر رد عمل کا اظہار.
>> تو بنیادی طور پر عمارت اپلی کیشن nontrivial نجی ہے رد عمل کا اظہار.
یہ سب ایک دوسرے کے ساتھ وائرڈ، لیکن وہاں آپ کے لئے کیا کریں گے کہ فورم کے اوزار ہیں.
آپ کو بنانے کے لئے چاہتے ہیں تو ایک رد عمل کا اظہار تو اپلی کیشن، اس طرح کرنے کی کوشش کریں.
آپ کو صرف استعمال کرنے کے لئے کرنا چاہتے ہیں تو، آپ کو اس CodePen استعمال کرنے کی کوشش کر سکتے ہیں
اس CodePen ہے کیونکہ تمام وائرنگ رد عمل کا اظہار.
میں نے پہلے ہی آپ کے لئے کام کیا ہے.
>> آپ کو ایک طرح بنانے کے لئے چاہتے ہیں تو پیداوار اپلی کیشن کی رہائی کے لئے رد عمل کا اظہار،
ان جنریٹروں کی ایک کوشش.
آپ کو صرف کھیلنے کے لئے چاہتے ہیں، تو کے ارد گرد، یہ اکثر صرف قابل ہے
کی طرح یہاں CodePen پر کے ارد گرد کھیلنے کی کوشش.
اچھا لگ رہا ہے؟
ٹھنڈا.
>> تاکہ میں ہے ہے.
ایک بار پھر، تمام کوڈ اور مثالیں ہیں یہاں اس ویب سائٹ پر ہونے جا رہا.
تو، ایک بار پھر، ہم نے بات نہیں کے بارے میں ردعمل کے زیادہ نحو،
لیکن تمام ان لوگوں کو تلاش کرنے کے لئے تھوڑا نحوی تفصیلات،
یہ تمام دستیاب ہونے جا رہا ہے یہاں اس ویب سائٹ پر.
>> تو میں طرح کی سفارش کروں گا پہلا قدم اٹھانے کے.
آپ CodePen میں ڈال.
بنانے پر کام کرنے کی کوشش کریں اس دوسرے مرحلے پر.
وہاں ایک چوتھے مرحلے ہے، اور صرف تم نے اس سے حاصل جہاں دیکھنے.
>> کوئی مزید سوالات، چیک یا اس صفحہ کو مجھے ای میل.
یہ میرا ای میل ہے.
لیکن میں سے کسی کے ساتھ آپ کی مدد کرنے پسند کروں گا آپ کے بارے میں ہو سکتا ہے سوالات ردعمل.
تو، جی ہاں، کہ میں ہے ہے.
بہت کے لئے آپ سب کا شکریہ دیکھ یا شرکت کے لئے.
اور میں کوئی سوال لے لیں گے اب آپ کو اس کے بعد ہو سکتا ہے.
تو دیکھ کے لئے آپ سب کا شکریہ.