All language subtitles for 003 React Code Is Written In A _Declarative Way_!_en

af Afrikaans
ak Akan
sq Albanian
am Amharic
ar Arabic
hy Armenian
az Azerbaijani
eu Basque
be Belarusian
bem Bemba
bn Bengali
bh Bihari
bs Bosnian
br Breton
bg Bulgarian
km Cambodian
ca Catalan
ceb Cebuano
chr Cherokee
ny Chichewa
zh-CN Chinese (Simplified)
zh-TW Chinese (Traditional)
co Corsican
hr Croatian
cs Czech
da Danish
nl Dutch
en English
eo Esperanto
et Estonian
ee Ewe
fo Faroese
tl Filipino
fi Finnish
fr French
fy Frisian
gaa Ga
gl Galician
ka Georgian
de German
el Greek
gn Guarani
gu Gujarati
ht Haitian Creole
ha Hausa
haw Hawaiian
iw Hebrew
hi Hindi
hmn Hmong
hu Hungarian
is Icelandic
ig Igbo
id Indonesian
ia Interlingua
ga Irish
it Italian
ja Japanese
jw Javanese
kn Kannada
kk Kazakh
rw Kinyarwanda
rn Kirundi
kg Kongo
ko Korean
kri Krio (Sierra Leone)
ku Kurdish
ckb Kurdish (Soranî)
ky Kyrgyz
lo Laothian
la Latin
lv Latvian
ln Lingala
lt Lithuanian
loz Lozi
lg Luganda
ach Luo
lb Luxembourgish
mk Macedonian
mg Malagasy
ms Malay
ml Malayalam
mt Maltese
mi Maori
mr Marathi
mfe Mauritian Creole
mo Moldavian
mn Mongolian
my Myanmar (Burmese)
sr-ME Montenegrin
ne Nepali
pcm Nigerian Pidgin
nso Northern Sotho
no Norwegian
nn Norwegian (Nynorsk)
oc Occitan
or Oriya
om Oromo
ps Pashto
fa Persian Download
pl Polish
pt-BR Portuguese (Brazil)
pt Portuguese (Portugal)
pa Punjabi
qu Quechua
ro Romanian
rm Romansh
nyn Runyakitara
ru Russian
sm Samoan
gd Scots Gaelic
sr Serbian
sh Serbo-Croatian
st Sesotho
tn Setswana
crs Seychellois Creole
sn Shona
sd Sindhi
si Sinhalese
sk Slovak
sl Slovenian
so Somali
es Spanish
es-419 Spanish (Latin American)
su Sundanese
sw Swahili
sv Swedish
tg Tajik
ta Tamil
tt Tatar
te Telugu
th Thai
ti Tigrinya
to Tonga
lua Tshiluba
tum Tumbuka
tr Turkish
tk Turkmen
tw Twi
ug Uighur
uk Ukrainian
ur Urdu
uz Uzbek
vi Vietnamese
cy Welsh
wo Wolof
xh Xhosa
yi Yiddish
yo Yoruba
zu Zulu
Would you like to inspect the original subtitles? These are the user uploaded subtitles that are being translated: 1 00:00:02,220 --> 00:00:05,160 So React is all about components 2 00:00:05,160 --> 00:00:07,210 and I hope I could make it clear 3 00:00:07,210 --> 00:00:09,430 why it's all about components 4 00:00:09,430 --> 00:00:11,960 and what exactly a component is. 5 00:00:11,960 --> 00:00:14,240 So therefore the next question is, 6 00:00:14,240 --> 00:00:17,330 how exactly is a component built? 7 00:00:17,330 --> 00:00:21,030 Now we'll dive into the concrete code in just a second. 8 00:00:21,030 --> 00:00:24,180 In general, it's just important to keep in mind 9 00:00:24,180 --> 00:00:25,800 what I mentioned earlier. 10 00:00:25,800 --> 00:00:29,070 In the end user interfaces are about HTML, 11 00:00:29,070 --> 00:00:31,700 CSS and JavaScript. 12 00:00:31,700 --> 00:00:36,080 And therefor all these components are about combining HTML, 13 00:00:36,080 --> 00:00:38,700 CSS and JavaScript. 14 00:00:38,700 --> 00:00:42,420 When we work with React and we build components, 15 00:00:42,420 --> 00:00:44,750 we in the end do just that. 16 00:00:44,750 --> 00:00:49,650 We combine HTML, CSS and JavaScript in all these components 17 00:00:49,650 --> 00:00:52,850 and then we combine all of these components together 18 00:00:52,850 --> 00:00:55,940 to build the entire user interface. 19 00:00:55,940 --> 00:00:59,840 Though, I will say while CSS of course matters 20 00:00:59,840 --> 00:01:02,930 and we're going to add CSS in this course, 21 00:01:02,930 --> 00:01:05,950 it's the least important part here. 22 00:01:05,950 --> 00:01:08,230 Mostly React components 23 00:01:08,230 --> 00:01:12,910 are about combining HTML and JavaScript and then of course, 24 00:01:12,910 --> 00:01:17,250 you also can add CSS but that's not the focus of React. 25 00:01:17,250 --> 00:01:19,430 Nonetheless, I will teach you of course 26 00:01:19,430 --> 00:01:23,790 how you can make sure that your components look beautiful. 27 00:01:23,790 --> 00:01:25,900 So long story short, 28 00:01:25,900 --> 00:01:29,040 React is all about components and about building 29 00:01:29,040 --> 00:01:31,710 these components which we combined together. 30 00:01:31,710 --> 00:01:34,370 React allows you to create these re-usable 31 00:01:34,370 --> 00:01:36,170 and reactive components, 32 00:01:36,170 --> 00:01:37,270 and you are going to see 33 00:01:37,270 --> 00:01:39,950 what reactive means in detail later, 34 00:01:39,950 --> 00:01:42,210 React allows you to build these re-usable 35 00:01:42,210 --> 00:01:45,610 and reactive components consisting of HTML and JavaScript 36 00:01:45,610 --> 00:01:48,710 and as I mentioned also a bit of CSS. 37 00:01:48,710 --> 00:01:50,950 Now here's the important part though. 38 00:01:50,950 --> 00:01:53,000 As you will learn throughout this course, 39 00:01:53,000 --> 00:01:57,850 React uses something which is called a declarative approach 40 00:01:57,850 --> 00:02:00,380 for building these components. 41 00:02:00,380 --> 00:02:02,420 And you will see what exactly that is, 42 00:02:02,420 --> 00:02:06,010 but it basically means that with React, 43 00:02:06,010 --> 00:02:11,009 you will not tell React that a certain HTML element 44 00:02:11,510 --> 00:02:16,370 should be created and inserted in a specific place 45 00:02:16,370 --> 00:02:19,570 on the user interface as you would be doing it 46 00:02:19,570 --> 00:02:21,750 with Vanilla JavaScript, 47 00:02:21,750 --> 00:02:25,570 so with just JavaScript, for example. 48 00:02:25,570 --> 00:02:29,060 Instead with React and that's really important, 49 00:02:29,060 --> 00:02:33,850 you will always define the desired end state, 50 00:02:33,850 --> 00:02:38,080 the target state or possibly also different target states 51 00:02:38,080 --> 00:02:40,010 depending on different conditions 52 00:02:40,010 --> 00:02:43,610 and it's then React's job to figure out 53 00:02:43,610 --> 00:02:48,610 which elements on the actual webpage might need to be added 54 00:02:49,840 --> 00:02:52,400 or removed or updated. 55 00:02:52,400 --> 00:02:55,290 And you don't write these concrete DOM 56 00:02:55,290 --> 00:02:57,880 updating instructions on your own 57 00:02:57,880 --> 00:03:01,580 as you would be doing it with just JavaScript, 58 00:03:01,580 --> 00:03:04,140 instead with React and React components, 59 00:03:04,140 --> 00:03:07,220 you just define these end states 60 00:03:07,220 --> 00:03:11,150 and under which conditions which state should be used 61 00:03:11,150 --> 00:03:15,090 and then React will do all of the rest under the hood. 62 00:03:15,090 --> 00:03:16,640 It's a bit like magic, 63 00:03:16,640 --> 00:03:18,340 it's of course not actual magic 64 00:03:18,340 --> 00:03:22,900 but it will make your life as a developer much easier. 65 00:03:22,900 --> 00:03:24,810 So you could say that in the end 66 00:03:24,810 --> 00:03:28,600 we just built our own custom HTML Elements 67 00:03:28,600 --> 00:03:33,040 and we combined them together for building a user interface. 68 00:03:33,040 --> 00:03:35,600 But that's enough of the theory for now. 69 00:03:35,600 --> 00:03:37,890 Let's now finally dive into some code 70 00:03:37,890 --> 00:03:40,053 and start building these components. 5534

Can't find what you're looking for?
Get subtitles in any language from opensubtitles.com, and translate them here.