YT YouTube2Text

YouTube2Text → Transcripts → 6: بناء ال component الأول في React

6: بناء ال component الأول في React — Transcript

by أكاديمية ترميز · 2,701 words · 358 segments · language en · Watch on YouTube

Open in transcriber Summarize with AI Download SRT/VTT

Full transcript

0:00يا هلا حياكم الله بالدرس السادس من سلسله
0:02دروس رياكت جي اس بالدرس السابق تعرفنا
0:04على هيكله المشروع وايش الاشياء اللي
0:06بيحتوي عليها وبدينا في بعض التغييرات في
0:09هذا الدرس راح نكمل في فهم الطريقه اللي
0:12بتشتغل فيها رياكت وراح نبدا بعمل
0:14الكومبوننت الاول الخاص فينا هذا هو الكود
0:17اللي انتهينا عنده في الدرس السابق ولاحظ
0:19اني اضفت ها الجزئيه اللي هي ترميز
0:20اكاديمي وبناء عليها انعكست ها الجزئيه في
0:23هذا المكان في المشروع وذكرت في الدرس
0:26السابق انه هذا الملف اللي هو الاب دوت جي
0:29اس موجود بداخل السورس او الاس ار سي هو
0:32يعتبر الملف الاساسي اللي بينطلب بس على
0:36اي اساس بصير هذا هو الملف الاساسي او
0:39الروت كومبونت اللي كل الكومبوننت الاخرى
0:42بتصير بداخله خلينا نحاول نفهم ها الجزئيه
0:45ولو بشكل بسيط عاده ملف الاندكس في
0:49المشاريع هو اول ملف يتم تحميله ويتم
0:52المرور عليه سواء كان اندكس دوت اش تي ام
0:55ال او اندكس د جي اس بشكل ضمني فلو دخلت
0:59على ملف اندكس جي اس خلينا نتعرف عليه ايش
1:02في هذا الملف هذا الملف راح تلاقي انه في
1:04مجموعه من الامبورد اول شيء عم يجيب لك
1:07مكتبه رياكت كامله من خلال النود موديول
1:10اللي اسمه رياكت وبعدين عم يحمل شغله
1:13اسمها رياكت دوم وهاي احد العناصر المهمه
1:16جدا عشان رياكت تشتغل بطريقه صحيحه من
1:19خلال النود موديول اللي اسمه رياكت دوم
1:21سلاش كلاينت بعدين عم يجيب لك ملف السي اس
1:24اس بعدين عما يجيب الاب من ملف الاب ولاحظ
1:29انه ما كت دوت جي اس لانه ما في داعي انك
1:31تكتب دوت جي اس فاذا كتبتها او خليتها
1:34عادي وبالتالي هذا الكومبوننت كامل اللي
1:36هو الاب صار موجود عننا هون في ملف
1:40الاندكس دوت جي اس هذا تقريبا من اهم
1:43الاسطر في هذا الملف عشان نستوعب طريقه
1:45العمل بعدين جاب لك مكتبه ثانيه بيستخدمها
1:48باشياء اخرى ما بتهمنا في الوقت الحالي
1:50اللي بيهمني الان انه لاحظ ايش سوى عرف
1:54متغير اسمه روت هذا المتغير ايش بيساوي
1:57هذا المتغير بيروح عند مكتب اسمها رياكت
2:00دوم اللي سو لها امبورت في هذا السطر
2:03الثاني وهي المكتبه بتحتوي على داله اسمها
2:06كريت روت بمعنى سويلي الكومبوننت الاساسي
2:10في رياكت اللي راح ينطلق منه المشروع
2:13واللي كل الكومبوننت الاخرى راح تكون
2:16مضمنه فيه بس عشان تسوي كريت روت فعليا
2:20ترى لازم يكون عندك ملف اتش تي ام ال
2:24مكتوب بطريقه الاتش تي ام ال الطبيعيه
2:27اللي بيفهمها المتصفح وبالتالي من هون
2:30رياكت بتبدا فعليا بانها تبني الروت
2:34كومبونت اللي منه راح تنطلق كل الكومبوننت
2:37الاخرى وراح ينطلق منه المشروع لكن عشان
2:40تكون رياكت قادره على انه تاخذ كمبوننت
2:43معين مثل الاب وتحطه في الصفحه اللي
2:47بيفهمها البراوزر على انها اش تي ام ال
2:50فلا بد انه تكون نقطه الانطلاق اساسا هو
2:54عباره عن ملف اتش تي ام ال بعدين تسوي
2:57انجكت للكمبوند عند عندك او ادخال او
3:01اقحام للكومبو الموجوده عندك بداخل احد
3:04العناصر من عناصر صفحه الاتش تي ام ال
3:07الموجوده عندك عشان يكون كلامي واضح ترى
3:10ملف الاندكس دو جي اس هو ما هو اول ملف
3:13بيبدا فيه المشروع وملف الاب دوت جي اس ما
3:16هو اول ملف بيبدا فيه المشروع مره ثانيه
3:18بذكرك انه مجلد الببلك هو عباره عن مجلد
3:22للاشياء اللي بيقدر يوصلها المستخدم من
3:25المصادر المختلفه واحد اهم المصادر
3:29الموجوده عند عندك في هذا المجلد هو عباره
3:31عن ملف اسمه اندكس دوت ا ت ام ال فبدايه
3:35مشروع رياكت ترى هو ليس الا عباره عن ملف
3:38اش تي ام ال اعتيادي مثل ما بنعرفه لكن
3:41بصير في مجموعه من الاشياء عشان يتم اقحام
3:44رياكت بداخل ملف الاتش تي ام ال هذا فملف
3:48الاتش تي ام ال هذا لو دخلت عليه راح
3:50تلاقي في مجموعه من الاشياء المختلفه
3:53الموجوده عندك لاحظ انه التايتل موجود
3:55عندك ومكتوب في رياكت اب وعشان اثبت لك
3:58انه هذا هو الملف الاساسي انا ما راح
4:00اخليه رياكت اب وانما راح اخليه رياكت
4:03ابلكيشن على سبيل المثال فلو سويت سيف
4:06الان ورجعت مره ثانيه اشوف التايتل تبع
4:08الموقع عندي راح تلاقي انه مكتوب رياكت
4:11ابلكيشن بناء على التغيير اللي انا سويته
4:14وبالتالي هذا هو الملف الاساسي اهم عنصر
4:17في هذا الملف الاساسي هو عباره عن هذا
4:20الدف هذا عباره عن ديف له الاي دي اللي
4:23اسمه روت ايش في بداخل هذا الف فعليا ما
4:27في بداخله اي شيء طقا لاحظ ان هو عباره عن
4:31ديف فاضي طيب ليش هو عباره عن ديف مهم
4:35لانه هو اللي راح يتم تعبئته بشكل تلقائي
4:40بالكومبيوتر
4:42ياكت وبناء عليه راح يتم تعبئته بكل
4:45الكومبوننت الاخرى المضمنه بداخل هذا
4:47الروت كومبونت بمعنى اخر صحيح انه هذا
4:51الدف الان فاضي لكن ماذا لو جيت عند ها
4:54الصفحه وجيت وسويت لها انسبكت خليني ادور
4:56على هذا الروت لاحظ انه هذا هو الدف تبع
4:59الروت ايش في بداخله صار في بداخله ديف
5:02اسمه اب وبداخله هيدر وبداخل هذا الهيدر
5:06مجموعه من الاشياء صار في كميه كبيره من
5:08الكود تم جلبها واقحام او عمل انجكت لها
5:13بداخل هذا الديف اللي له الاي دي روت طيب
5:16كيف تم هذا الشيء هذا الشيء تم من خلال
5:19الملف اللي اسمه اندكس جي اس انا رحت جبت
5:22الاب وجبت عندي مكتبه الرياكت دوم
5:25واستدعيت منها الداله اللي اسم كريت روت
5:28وكبرا له الداله انا بحدد ايش هو النت
5:32اللي بدي استهدفه واصير احط اكواد الرياكت
5:35بداخله اللي هو كان الالن اللي له الاي دي
5:38روت وبالتالي كرامت لهي الداله احنا قلنا
5:42له دكت المنت باي اي دي اللي هو عباره عن
5:46الروت جيب لي هذا النت تبع الروت وبعدين
5:49سويلي منها رندر رندر معناها دخل لي فيها
5:52مجموعه من الاشياء اللي هو حيدخل لك ها
5:55الرياكت بس اللي بيهمني انه راح يدخل هذا
5:58الروت
6:00اللي اسمه اب فبها الطريقه الكود اللي كان
6:03مكتوب في ابدوت جي اس تم اخذه وتم ادخاله
6:08في الملف الاساسي اللي راح يبدا منه
6:10المشروع اللي هو الاندكس اش تي ام ال
6:12وتحديدا عند ها المساحه اللي لها الاي دي
6:15اللي اسمها روت فبها الطريقه اصلا بتشتغل
6:18رياكت وبيتم عمل انشاء للمشروع وبالتالي
6:22كل شيء بيكون موجود بداخل الاب فعليا راح
6:27يدخل بداخل هذا ديف في نهايه الامر اللي
6:30اسمه روت لذلك انا لما جيت وكتبت ترميز
6:33اكاديمي بهذا المكان انا صحيح كتبتها
6:36بصيغه الاب بداخل الجي اس اكس تبع رياكت
6:39لكن في نهايه الامر ترى ترجمت الى لغه
6:42البراوزر
6:43وتحولت الى هذا الاتش 1 الموجود بداخل ايش
6:47الموجود بداخل ديف طبيعي له الكلاس اللي
6:50اسمه اب انا عم اسوي انسبكت باللغه اللي
6:53بيفهمها البراوزر اذا بدك تشوف اكواد
6:55رياكت فبناء على اداه المطورين تبع رياكت
6:59اللي سوينا لها تنزيل في المتصفح بقدر
7:02الان اوسع هذا الانسبيك وبعدين ادور على
7:06السكشن الخاص بالكبوت لو ضغطت عليه لاحظ
7:10انه عم يقول لك ترى في عندك كومبونت كبير
7:12اسمه اب هذا هو الكومبوننت كبير اللي
7:14بيمثل لك كامل الصفحه طيب جميل وبالتالي
7:17هي هي الطريقه اللي بيبدا فيها هذا
7:19الكومبوننت الكبير اللي اسمه اب الان هذا
7:21الاب بحكم انه راح يتم اخذه بكامل ما فييه
7:26ويتم وضعه بداخل هذا الديف بحيث انه يطلع
7:29في صفحه الاتش تي ام ال في نهايه الامر
7:31فانا بقدر احط فيه اي شيء واكون ضامن انه
7:34راح يتم عرضه في نهايه الامر في الصفحه
7:36فلذلك انا حطيت ترميز اكاديمي في المره
7:39الاولى لكن هالمره بدل ما احط ترميز
7:41اكاديمي انا فعليا بدي احط كومبون انتت
7:44متكامل بدي اسوي كومبون انتت جديد مره
7:48ثانيه ايش هو الكومبوننت هو عباره عن جزء
7:51من اجزاء الكود اللي انت بتعرفه في داله
7:54منفصله وهال الداله المنفصله قد تكون كذلك
7:57في ملف منفصل موجود عندك في رياكت فمبل
8:02اعرفها بنفس الملف بس عشان تكون الصوره
8:04واضحه بعدين انا ممكن اخذ هذا الكومبوننت
8:06الى ملف اخر طيب الكومبوننت في نهايه
8:09الامر هو عباره عن ايش هو عباره عن داله
8:12وبالتالي راح اعرف فانكشن ها الفنكشن راح
8:16اسميها باسم الكومبوننت اللي بدي اياه
8:19يتمثل باسم النت اللي انا بدي استخدمه
8:22مهما كان هذا الاسم فراح اسميه مثلا ماي
8:25فيرست كومبونت بهذا الشكل وهذا عباره عن
8:29داله بفتح قوس وبسكر قوس بفتح الكيرلي
8:31براكت وسكرها اي كومبونت موجود عندك في
8:34رياكت لازم يسوي ريتيرن لازم تفتح الاقواس
8:38العاديه وبعدين بتكتب بداخله اكواد الاتش
8:40تي ام ال اللي راح تسوي لها ريتيرن لذلك
8:43انا بقدر اجي اكتب ريتيرن بعدين افتح
8:46القوس وبعدين اسكر هذا القوس طبعا بحط هون
8:49السيمي كولون وبداخله لازم احط اكواد
8:52الاتش تي ام ال مشان هيك هو مطلع لي ها
8:54العلامه الحمراء لانه لازم يكون في عندك
8:57كود اش تي ام ال لذلك راح اكتب مثلا اتش 1
9:00وراح اسكره واكتب هلو ورد بهذا الشكل الان
9:04راح اسوي سيف لاحظ انه رتب لي اياها لحاله
9:06بهذا الشكل طبعا لاحظ انه حاطط لي خط اصفر
9:09على اسم الداله راح نرجع له بعد شوي لكن
9:12الان بعد ما سويت سيف المفروض تتحدث
9:14الصفحه لحالها هذا اللي بيعرف باسم الهوت
9:17ريلود في رياكت لكن فعليا ما طلع لي اي
9:19شيء ما طلع لي هذا الاتش 1 اللي اسمه هلو
9:21ورد ليش لانه هي عباره عن داله ودائما
9:25بقول انا اللي سويته اني عرفت الداله فقط
9:29لسه ما استخدمتها او لسه ما استدعيت طيب
9:31كيف بستخدمها نحن بنعرف انه بالجافا
9:34سكريبت عشان تستدعي الداله بتكتب اسمها
9:37وبعدين بتفتح قوس وبتسكر قوس انت هيك
9:39بتكون استدعيت الداله بس فعليا انا ما بدي
9:42استدعي الداله بطريقه الجافا سكريبت انا
9:45بدي استدع بطريقه رياكت اللي بتحول لي
9:48استدعاء الداله الى تاجات مكتوبه في الاتش
9:52تي ام ال بمعنى اخر انا راح استخدمها ككب
9:55انتت او كاتش تي ام ال المنت فبقدر اجي في
9:58اي كان موجود عندي في الاب مثلا بعد
10:02الترميز اكاديمي هون وبعدين اكتب تاج ما
10:06راح اكتب اتش 1 ولا اتش 2 ولا اش 3 ولا اي
10:10عنصر من عناصر الاتش تي ام ال اللي تعودنا
10:12عليها راح اكتب عنصر جديد انا عرفته بنفسي
10:15ك كومبونت في رياكت اللي هو عباره عن
10:18الماي فيرست كومبونت بهذا الشكل طبعا لازم
10:21اسكره مباشره لذلك بحط السلاش وبعدين
10:25بسكره ضروري جدا انك تحط السلاش عشان
10:27تسكره بناء على هذا التغيير بمجرد ما اسوي
10:30سيف وارجع مره ثانيه راح الاقي انه في شيء
10:33جديد نضاف اللي هو هلو ورد الهلو ورد ها
10:37لو سويت لها انسبكت بحيث انك تشوف ايش
10:41اللغه النهائيه اللي وصلت للمتصفح وفهمها
10:44ترى هي ليست الا عباره عن اكواد اتش تي ام
10:47ال اعتياديه وما راح تلاقي ابدا شيء اسمه
10:50ماي فيرست كومبونت في ها الاكواد تبع
10:52الاتش تي ام ال الاعتياديه لانه رياكت
10:55ترجمتها الى لغه البراوزر عشان البراوزر
10:57يفهمها ويعرف كيف في عرضها لكن اذا حبيت
11:00انك تشوف الكومبوننت الموجوده عندك في
11:03رياكت فمره ثانيه انا بروح على ال
11:05انسبكتور تبع الكومبوننت لاحظ هالمره ايش
11:07عم يقول لي عم يقول لي ترى عندك الاب
11:09كومبونت الكبير اللي بيحتوي على كل شيء
11:12بداخله بعدين بداخله في كستم كومبونت انت
11:15سويته وسميته باسم ماي فيرست كومبونت لو
11:17حطيت المؤشر عليه لاحظ انه عم يظلل لي
11:20عباره هلو ورد هذا الكومبوننت الان انا
11:23بقدر اتحكم فيه على كيفي وبقدر اضيف فيه
11:25الاضافات اللي بدي اياها فعلى سبيل المثال
11:28ايش ممكن اسوي ممكن تقول لي انا بقدر اجي
11:30الان واسوي اتش 2 واكتب فيها هاي لو
11:34سويتها بهذا الشكل وسويت سيف لاحظ انه
11:36حاطط لي خط عليها بالاحمر ولو رجعت راح
11:39يطلع لي انه في خطا الخطا هو انه اي
11:41كمبوننت موجود عندك في رياكت لازم يرجعلك
11:44المنت واحد واذا حابب انك تكتب اكثر من
11:47المنت بداخل بعض فبحط كلهم بداخل ديف واحد
11:51بحيث انه في نهايه الامر ما يرجع لك الا
11:53المنت واحد فلذلك انا لازم هون اجي اكتب
11:56ديف احط بداخله الاتش 1 مع الاتش 2 مع بعض
12:00بهاي الطريقه راح اكون قادر اني اعرضهم
12:03الاثنين مع بعض فراح احط الهاي وبعدين راح
12:06احط الهالو ورد بهذا الشكل طبعا لاحظ انه
12:09مطلع لي اه بالخط الاصفر لو سويت سيف
12:11المشكله انه عندي اكثر من سيمي كولون
12:13المفروض هون ما يكون في سيمي كولون عشان
12:14ما تنتهي جمله الريتن وهون راح امسح
12:17السيمي كولون وهون راح امسح السيمي كولون
12:19بحيث يطلع بهذا الشكل بعدين لازم افتح
12:22الاقواس تبع الريتن فراح افتح القوس هون
12:24وبعدين راح اسكر هذا القوس في نهايه الامر
12:28سويت راح يرتب لي الاكواد بحيث انها تطلع
12:30بهذا الشكل لو رجعت الان لاحظ انه صار
12:33يطلع لي هلو وورد وصار يطلع لي تحتها هاي
12:35مثل ما هو واضح عندك طيب ايش ممكن اضيف
12:38كمان ممكن احط مثلا بوتون على سبيل المثال
12:40فراح اكتب بوتون وبعدين راح اكتب بداخل
12:43هذا البوتون مثلا كليك مي بهذا الشكل لو
12:47سويت سيف ورجعت مره ثانيه لاحظ انه طلع لي
12:50هلو ورد طلع لي هاي وبعدين طلع لي الكليك
12:53مي بتون هذول كلهم كانوا عباره عن جزء من
12:56كومبونت واحد اسمه ماي فيرست كومبونت
12:59استخدمت اسمه كاني عم استدعي الداله
13:01وحطيته كستم المنت بداخل اكواد الاتش تي
13:05ام ال ثم تم ترجمته الى لغه المتصفح عشان
13:09يفهمها وكانها اكواد اش تي ام ال اعتياديه
13:12مثل ما نحنا بنعرفها الان بفضل انه
13:15الكومبوننت عندي في رياكت اصلا هو عباره
13:17عن شيء زبل هو عباره عن فانكشن نحنا بنعرف
13:20ان الفنكشن زبل بتقدر تستخدمها متى ما بدك
13:23فترى هذا الكومبوننت بقدر اخذه واحطه في
13:25مكان مختلف تماما وحاله راح يرجع لعلي كل
13:30الاكواد الخاصه بهذا الكومبوننت مره ثانيه
13:33لكن في مكان ثاني لاحظها لو ورد هاي بعدين
13:35البتون وخلص بقدر اصير اسويلها رييوز بعدد
13:38المرات اللي بدي اياها ليش لانه هي في
13:41نهايه الامر ترى ما هي الا عباره عن
13:43فانكشن فلو سويت سيف الان لاحظ انه في كل
13:47مره عم يطلعلي نفس الكومبوننت مره ورا
13:50الثانيه اخر جزئيه راح اوضح لك اياها في
13:53درس اليوم انه هذا الكومبوننت ترى مو شرط
13:55يكون فقط في داله منفصله وانما ممكن يكون
13:59في ملف مستقل تماما وبالعكس هذا هو الشائع
14:02انه كل كمبوننت عندك يكون له الملف
14:05المستقل الخاص فيه بحيث انه يكون اسمه
14:08بنفس اسم الكومبوننت اللي انت راح تستخدمه
14:11هاي هي الممارسه الشائعه لذلك راح اروح
14:13عند الاس ار سي هون وراح اضغط عليها
14:15باليمين اقول له نيو فايل هذا الفايل راح
14:17اسميه باسم الكومبوننت تبعي اللي انا
14:19سميته باسم ماي فيرست كومبونت بهذا الشكل
14:23دوت جي اس لانه في نهايه الامر هو راح
14:25يكون ملف جافا سكريبت راح اضغط على انتر
14:27بعدين هذا الكود اللي انا حطيته هون فعليا
14:29راح اسوي له كات وبعدين راح يجي عند الماي
14:33فيرست كومبونت واسوي له بيست راح اسوي سيف
14:36الان وراح ارجع عند الاب دوت جي اس اسوي
14:39سيف لاحظ انه مطلع لي اصلا خط احمر ولو
14:42فتحت عندك راح يقول لك ترى في عندك مشكله
14:44الماي فيرست كومبونت از not ديفاين هو ما
14:48بيعرف شيء اسمه ماي فيرست كومبونت في
14:50الملف اللي اسمه ابدت جي اس لاني طلعتها
14:53لملف ثاني فعشان يتعرف عليها مثل ما كنت
14:56عم سوي امبورت للشغلات الخارجيه في هذا
14:59المكان او رياكت كانت عم تسويها فانا لازم
15:01اسوي امبورت لهذا الماي فيرست كومبونت
15:04فلذلك راح اجي اقول له امبورت بعدين بتسمي
15:08اسم الكومبوننت كيف بدك اياه يطلع في ملف
15:11الاب دوت جي اس انا راح اسميه بنفس اسم
15:13الكومبوننت تماما اللي هو ماي فيرست
15:17كومبونت بعدين بكتب فروم عشان نجيب الرابط
15:20اللي هو موجود في هذا الكومبوننت ومنحط
15:23فيه علامات التنصيص ونحدد من وين بدنا
15:26نجيبه فانا راح اقول له من الدوت سلاش
15:28يعني من المكان الحالي اللي انا موجود فيه
15:31لانه الابجي اس موجود في نفس المكان اللي
15:33موجود في الكومبوننت تبعي اللي هو ماي
15:35فيرست كبون فهو من نفس المكان الحالي اللي
15:38انا موجود فيه عن طريق كتابه دوت بعدين
15:40سلاش بعدين بحط اسم الملف اللي هو ماي
15:43فيرست كومبونت ممكن تحط الجي اس ممكن انك
15:46تشيلها ما راح تفرق معك الان لو سويت سيف
15:49ورجعت مره ثانيه لاحظ انه مازال في خطا
15:52لكن هذا الخطا مختلف المره عم يقوللك
15:55اكسبور
15:57ديفولت في هذا الملف اللي اسمه ماي فيرست
16:00كومبونت عشان يكون هذا الكومبوننت قابل
16:03للاستخدام في ملف اخر فمثل ما انت سويت له
16:08استيراد او امبورت من هذا الملف الاخر
16:12لازم تسويله اكسبورت او تصدير من ملف
16:15الكومبوننت نفسه كيف عن طريق انك تكتب قبل
16:19الداله عباره اكسبورت بعدين تكتب ديفولت
16:24بهذا الشكل وتسوي سيف هذا راح يحللك مشكله
16:29نعم نحنا ما تعمقنا بموضوع الاكسبورت
16:36والديفولبر
16:39والاستخدام خارج نطاق هذا الملف اللي اسمه
16:42ماي فيرست كومبونت جي اس وبحكم انها صارت
16:45قابله للاستخدام انا جيت عند الابدو جي اس
16:47وسويت لها امبورت وبعدين استدعيت هذا
16:51الكومبوننت عده مرات عندي لو رجعت الان
16:54راح تلاقي انه كل شيء شغال عندك تماما
16:56وصار الكومبوننت منفصل في ملف مستقل تماما
17:00وكونه صار في ملف مستقل تماما انا الان
17:03بقدر استخدمه في اي كمبوننت اخر مو بس
17:06ابدوت جي اس فانا زدت له من قيمه الريز
17:10بيلتي او قابليه اعاده الاستخدام عن طريق
17:13فصله الى ملف منفصل هذا فيما يخص لمحه
17:18سريعه عن بناء الكومبوننت وطريقه
17:20استخدامها مازال في حديث مهم عن
17:23الكومبوننت وكيف الموقع اساسا بيتشكل
17:26بمجموعه من الكومبوننت الموجوده عن عن راح
17:29اشرح لك هذا الشيء بشكل تفصيلي ونظري في
17:32الدرس الجاي باذن الله اتمنى ان شاء الله
17:34انه كان الشرح واضح اذا عجبك شرح يت تضغط
17:36على زر الاعجاب واذا عندك اي سؤال او
17:38استفسار لا تتردد في كتابته بخانه
17:40التعليقات ونشوفكم ان شاء الله بالدرس
17:44الجاي

About this transcript

This page contains the full transcript of 6: بناء ال component الأول في React by أكاديمية ترميز, generated from the public captions YouTube serves with the video. The transcript has 2,701 words across 358 segments, with the original timestamps preserved so you can click any line to jump to that moment in the embedded player.

What you can do with it

Use the transcript to take notes, quote the speaker, build a study guide, generate a summary with ChatGPT or Claude via the YouTube Summary tool, or export it as a timed subtitle file with YouTube to SRT. You can also re-open it in the transcriber to translate the transcript into 100+ languages.

Free YouTube transcript tool

YouTube2Text is a free YouTube transcript generator — no signup, no daily limit. Paste any YouTube link and get the full transcript instantly, with timestamps, click-to-jump, translation to 100+ languages, AI prompts for ChatGPT, Claude, and Gemini, and exports to TXT, SRT, VTT, or Markdown.