1
00:00:00,00 --> 00:00:05,000
[Music]

2
00:00:05,300 --> 00:00:06,900
Ready

3
00:00:07,000 --> 00:00:10,000
Excited

4
00:00:10,100 --> 00:00:12,000
Without blinking

5
00:00:12,100 --> 00:00:14,000
Everyone was waiting

6
00:00:14,100 --> 00:00:14,700
Of reactjs

7
00:00:14,800 --> 00:00:16,000
Exciting

8
00:00:16,100 --> 00:00:17,500
No,This is enough

9
00:00:17,600 --> 00:00:18,600
excitement needed

10
00:00:18,700 --> 00:00:23,500
ok, Exciting

11
00:00:23,600 --> 00:00:28,400
Tutorial of ReactJs .... get out from here

12
00:00:30,900 --> 00:00:31,500
Friends

13
00:00:31,600 --> 00:00:36,400
My greetings to all coders

14
00:00:36,500 --> 00:00:41,300
We heard alot about ReactJs,Together with 
Angular,VUE,MERN

15
00:00:41,400 --> 00:00:46,200
when learning Node,React is an always hearing 
word is

16
00:00:46,300 --> 00:00:51,100
This is a series about react...[Laughter]

17
00:00:54,000 --> 00:00:55,800
Silence

18
00:00:55,900 --> 00:01:00,700
It's been a while here Abhi,Dilshad,Manna 
tries to teach me the script

19
00:01:00,800 --> 00:01:05,600
There are other two peoples also, I will 
introduce them to you within few minutes

20
00:01:05,700 --> 00:01:10,500
let's start Reactjs tutorial without delay

21
00:01:10,600 --> 00:01:15,400
we plan this series for next ten days

22
00:01:15,500 --> 00:01:20,300
We are planning to do projects like Netflix 
and OLX.

23
00:01:20,400 --> 00:01:34,600
The aim of our series is to generate quality 
ReactJS developers. Companies have a lot 
of vacancies in React jS development, we 
are going to fill those vacancies by creating 
a ReactJs developers circle.

24
00:01:34,700 --> 00:01:46,500
There is  chance to win  cash prizes by completing 
all the 3 projects in this challenge and 
the assignment project.

25
00:01:46,600 --> 00:01:55,900
Let's look at what are the pre-knowledge 
needed before learning React. The first thing 
is basic coding understanding

26
00:01:56,000 --> 00:02:00,800
For that must watch 100k  coding challange 
in our youtube channel

27
00:02:00,900 --> 00:02:05,700
That  10 video series helps you to understand 
basic coding ,even though you don't know 
nothing about it.

28
00:02:05,800 --> 00:02:10,600
After completing 100k challenge.

29
00:02:10,700 --> 00:02:15,500
There is another challenge in our channel 
called Web designing challenge of 10 videos.

30
00:02:15,600 --> 00:02:23,900
After completing that you will get an nderstanding 
about HTML,CSS,Javascript,JQuery and webdesiging

31
00:02:24,000 --> 00:02:28,800
There you are creating a website  by own.

32
00:02:28,900 --> 00:02:33,700
Then watch 'web development for babies' video.

33
00:02:33,800 --> 00:02:43,800
It explains about cloud,Backend,Mobile apps,Hybrid 
apps,Crossplatform,PWA etc

34
00:02:43,900 --> 00:02:52,100
Must watch that single video(Web development 
for babies) to understand all these concepts

35
00:02:55,700 --> 00:03:00,400
Watching above mentioned videos is enough; 
your degree certificates are not applicable 
for us.

36
00:03:00,500 --> 00:03:07,000
you can come here directly after understanding 
and practicing all these concepts.You can 
set further things from here

37
00:03:10,600 --> 00:03:13,500
This is the best field to find a job in IT 
field,and alot of vacancies are available

38
00:03:13,600 --> 00:03:22,600
your friends and relatives may wish to enter 
into this field.Many of us  going for psc 
coaching and banking coaching

39
00:03:22,700 --> 00:03:27,500
Assumes coding is a difficult thing to handle.

40
00:03:27,600 --> 00:03:40,800
You can share these videos to anyone in any 
field.

41
00:03:40,900 --> 00:03:45,700
We wish to complete this video series at 
least by 10,000 peoples

42
00:03:45,800 --> 00:03:58,400
Now we have a lot of subscribers. So at least 
10,000 people must complete this tutorial. 
So you guys must share this video to achieve 
10,000 views per video before reaching the 
tenth video in this series.

43
00:03:58,500 --> 00:04:13,000
We are going to reach 100k subscribers. So 
please introduce this channel to everyone. 
This is a lifesaver channel.

44
00:04:13,100 --> 00:04:17,900
Share these videos with more people hence 
we can touch 100k faster.

45
00:04:18,000 --> 00:04:22,800
We are expecting more support from you.I 
already told we have two guests here.

46
00:04:22,900 --> 00:04:27,700
You may seen their photos before in thumbnails 
now I am going to reveal who they are.

47
00:04:27,800 --> 00:04:40,200
Before introducing them; One thing to reminds 
you, free one-hour technical support available 
in the telegram group daily to clear your 
doubts.

48
00:04:40,300 --> 00:04:45,100
Feel free  to ask doubts in that group,you 
can ask doubts in malayam.

49
00:04:45,200 --> 00:04:50,600
Try to clear your doubts daily from that 
group.

50
00:04:50,700 --> 00:05:08,300
Those who watch this video later and those 
who need more support can take exclusive 
membership,where you will get 24x7 support.

51
00:05:08,400 --> 00:05:21,600
you will be get added to an exclusive group, 
where you can send screenshots, videos and 
ask doubts in Malayalam ,our team will support 
you there.

52
00:05:21,700 --> 00:05:52,600
For building a connection with us through 
WhatsApp. Send your name and place to this 
number shown below. Then you will get notifications 
of new videos on Whatsapp. Don't forget to 
save its number on your phone.

53
00:05:52,700 --> 00:05:57,500
Now let's begin the tutorial, hope you all 
have an idea about what is Reactjs.

54
00:05:57,600 --> 00:06:13,700
You already know ReactJs using in the frontend 
. If you are new to this channel must-watch 
'web development for babies video'.we don't 
want to repeat the stories again.

55
00:06:13,800 --> 00:06:18,600
You know the basic language to do Reactjs 
is javascript.

56
00:06:18,700 --> 00:06:26,400
For an authentic explanation about reactjs 
let's invite one Mr.sidheek.

57
00:06:26,500 --> 00:06:31,300
Mr.Sidheek what is this variety T-shirt?

58
00:06:31,400 --> 00:06:35,000
We are sitting here for doing react tutorial 
right?

59
00:06:35,100 --> 00:06:39,100
That's awesome.There is another person too.

60
00:06:39,200 --> 00:07:13,400
When am ask them to plan a Reactjs tutorial.Instead 
of preparing tutorials they only buy two 
T-shirts

61
00:07:13,500 --> 00:07:23,200
Do you remember this face elsewhere?

62
00:07:23,300 --> 00:07:33,000
Tell them the truth.

63
00:07:33,100 --> 00:07:42,800
There is a series on Netflix called money 
heist, in that series a professor is there. 
Like that this is also a special person.

64
00:07:42,900 --> 00:07:52,600
There is another special person also who 
will come soon.

65
00:07:52,700 --> 00:07:57,500


66
00:07:57,600 --> 00:08:13,800
There is another special person also who 
will come soon

67
00:08:13,900 --> 00:08:28,500
Sidheek. why you select ReactJs instead of 
android or vue? There are two options available 
while learning ReactJs.By learning React 
Js you can enter into Mobile development 
easily.

68
00:08:28,600 --> 00:08:38,300
After learning ReactJS you can easily learn 
React native.

69
00:08:38,400 --> 00:08:57,900
You worked in IoT development before coming 
into SPS So you already know embedded

70
00:08:58,000 --> 00:09:07,700
I want to tell you something, beginners should 
not start to develop mobile app and website 
together

71
00:09:07,800 --> 00:09:25,000
You have to focused on one thing first.If 
you are focused on front end then you have 
to complete at least  two projects in React,then 
try to enter in to a company.

72
00:09:25,100 --> 00:09:29,900
If you are focusing on backend learn Nodejs 
and can add React optionally.But don't try 
to learn mobile development at the same time.

73
00:09:30,000 --> 00:09:34,800
If you are not focusing on one thing it may 
leads to a paralysis mode.You cant reach 
anywhere

74
00:09:34,900 --> 00:09:49,500
I want to claim that i started learned javascript 
for three years,and learn ReactJs for one 
year .Now am stable to handle ReactJs.So 
i switched to other domains.

75
00:09:49,600 --> 00:10:04,200
So you have to think on that way.We have 
already say this in our channel.You have 
to set one domain before entering into other 
domains.

76
00:10:04,300 --> 00:10:18,900
We know ReactJs is a front end language,But 
many of us suspect while learning ReactJS 
is there any need for backend?.Which one 
you used as backend?

77
00:10:19,000 --> 00:10:33,600
Am actually focused on MERN stack.That is 
MongoDB,Express,ReactJs,NodeJS.

78
00:10:33,700 --> 00:10:53,200
One thing to understand is if you learn javascript 
you can become MERN stack because it is the 
common language used in front end and backend.

79
00:10:53,300 --> 00:10:58,100
Thats why i choose this language to learn, 
we can switch into other languages according 
to our need.

80
00:10:58,200 --> 00:11:32,400
You have to skilled in one language first 
.After working with that language at least 
two to three years you can integrate other 
languages such as python,c, etc

81
00:11:32,500 --> 00:11:54,400
You used node as backend.In this tutorial 
we don't teach backend.We mentioned only 
to complete 100k challenge,Web designing 
challenge and Web development for babies.So 
what to do people who don't know web development?

82
00:11:54,500 --> 00:12:14,000
For backened we can use Firebase.We can set 
backend by in clicking UI without learning 
language.

83
00:12:14,100 --> 00:12:18,900
It will be teached by next problem person.Don't 
he?

84
00:12:19,000 --> 00:12:28,700
Heard that he is excellent in that. He already 
started the warm up.

85
00:12:28,800 --> 00:12:48,300
Exactly what is Reactjs?A library or framework?.Many 
of are suspected about that...Exactly React 
is a library.

86
00:12:48,400 --> 00:12:58,100
Many of are doubted about what is library 
and what is framework.

87
00:12:58,200 --> 00:13:03,000
Main difference between them is in their 
controlling.

88
00:13:03,100 --> 00:13:12,800
We are calling library into our code.But 
in framework we are writing code inside it.

89
00:13:12,900 --> 00:13:37,300
We have a set of code...[music]..Do you understand 
anything?...where is the key now? place there 
itself.

90
00:13:37,400 --> 00:14:06,700
I will make it clear to you.If we have a 
tool like android studio. Or we have already 
used languages like C,Java.While using these 
languages if we want to integrate prtinter.We 
will call a library for that.

91
00:14:06,800 --> 00:14:21,400
Adding small part into our code externly 
known as library.But if you set whole the 
environment to work with is known as framework.

92
00:14:21,500 --> 00:14:26,300
Is that correct? yes, the main advantage 
is that.

93
00:14:26,400 --> 00:14:41,000
In the case of React, there is only interfacing 
occurs there. For Routing, we have to use 
different libraries.Routing means going from 
one page to another.

94
00:14:41,100 --> 00:14:50,800
So we can familiarise ourselves with more 
libraries.

95
00:14:50,900 --> 00:14:55,700
That means there is only a small thing with 
us. Can add multiple types of libraries with 
that for more functionalities.

96
00:14:55,800 --> 00:15:05,500
It is very easy to expand and familiarise 
with more libraries while using React.

97
00:15:05,600 --> 00:15:25,100
While looking at React I saw a JSX.what is 
that? That is actually javascript XML(full 
form). We can write javascript inside HTML.

98
00:15:25,200 --> 00:15:44,700
It is a method. We have already learned handlebars 
in web development. We used HTML tags to 
write handlebars. Can we write loops in JSX 
as in handlebars?

99
00:15:44,800 --> 00:15:59,400
Another important thing to note is there 
is a state for each component. It is an object 
to take clicks and events.

100
00:15:59,500 --> 00:16:14,100
We will deep into it while learning.which 
one is using here. functional or class components?

101
00:16:14,200 --> 00:16:23,900
We can use both. But companies are preferring 
class components.

102
00:16:24,000 --> 00:16:33,700
In 2019 class components are more popular. 
But now people using functional components.

103
00:16:33,800 --> 00:16:43,500
In the beginning, there are only class components 
in ReactJS.Later they changed to functional 
components

104
00:16:43,600 --> 00:16:48,400
After introducing functional components, 
major updates were done with functional components.

105
00:16:48,500 --> 00:17:08,000
Main concept in functional components is 
known as hooks. We will explain it later.

106
00:17:08,100 --> 00:17:17,800
These are the basic concepts. Now let's introduce 
the next person, who also wears this type 
of T-shirt.

107
00:17:17,900 --> 00:17:22,700
They excluded me while buying these T-shirts.

108
00:17:22,800 --> 00:17:32,500
React is created by Facebook.

109
00:17:32,600 --> 00:17:37,400
I forgot to ask about it . Tell me now.

110
00:17:37,500 --> 00:17:47,200
It is created by facebook's senior developer 
Jordan Walke. Now it is open source.

111
00:17:47,300 --> 00:18:06,800
Like in his school days, he learned the name 
also. We must know that.

112
00:18:06,900 --> 00:18:16,600
Hundreds of developers are there to contribute. 
Hence updations will come daily.

113
00:18:16,700 --> 00:18:26,400
Shall we start now, sir?

114
00:18:26,500 --> 00:18:41,100
There is a standard to keep in crossroads. 
Where are you going by wearing this cap?

115
00:18:41,200 --> 00:18:46,000
Are you come here to teach React or a fashion 
show?

116
00:18:46,100 --> 00:19:00,700
Why are you wearing a cap? I have a bald 
head now. Let me see that . Not now. Will 
show it in the last episode.

117
00:19:00,800 --> 00:19:05,600
What are you doing now? Am working in a company. 
Say the things before that.

118
00:19:05,700 --> 00:19:25,200
Before that, I was in SPS. In the past, he 
was cleaning plates in the taj hotel. From 
there he learned 100k coding challenge.

119
00:19:25,300 --> 00:19:42,800
After learning c and loops, he comes to SPS. 
Did a six months workout there. Now entered 
for a job in a company for six lakhs per 
annum salary.

120
00:19:42,900 --> 00:19:44,800
You feel so happy right?

121
00:19:44,900 --> 00:19:55,500
yes, am really happy. what about you?

122
00:19:55,600 --> 00:20:00,400
Share your experience with us.

123
00:20:00,500 --> 00:20:10,200
What is your opinion, can a person can achieve 
coding skill with six months?of course you 
can perform in high level

124
00:20:10,300 --> 00:20:15,100
Which is your degree?Bsc hotel management.

125
00:20:15,200 --> 00:20:24,900
After plus two he take degree in Bsc hotel 
management.Good luck with corona,else he 
may entered into job in Mumbai for dish washing.

126
00:20:25,000 --> 00:20:29,800
Not as dish washer, i got job as manager..oh 
really

127
00:20:29,900 --> 00:20:39,600
I can show my offer letter,How much is the 
salary?25k

128
00:20:39,700 --> 00:20:44,500
Only 25k after working day and night.

129
00:20:44,600 --> 00:20:49,400
what's now?Are you happy ? yes

130
00:20:49,500 --> 00:21:04,100
Why they selected you for a job in hotel? 
you are kidding me right?

131
00:21:04,200 --> 00:21:44,300
what is the crieteria to get a job in hotel? 
     How they selected you? is there is no 
standards for a star hotel?Are you done? 
Can I go now?

132
00:21:44,400 --> 00:21:49,200
Now let's talk about React

133
00:21:49,300 --> 00:22:03,900
This is Sree Ganesh; you get an idea about 
him already.

134
00:22:04,000 --> 00:22:13,700
Do you know Ziyaf? he is working in SPS. 
He connected Sree Ganesh to here. Both of 
them are alike. having a lot of challenges.

135
00:22:13,800 --> 00:22:28,400
Everyone in crossroads is also like that. 
Even Dilshad, Manna, Abhi, or Ziyaf are special 
kind of persons

136
00:22:28,500 --> 00:22:38,200
The owner has no problems. Perfect ok!!

137
00:22:38,300 --> 00:22:48,000
Tell something about React.Tell something 
about React. what should say

138
00:22:48,100 --> 00:22:52,900
Say something new. Do you know anything?

139
00:22:53,000 --> 00:23:07,600
Companies using React are NETFLIX, Airbnb 
We are going to do Netflix here.

140
00:23:07,700 --> 00:23:32,100
React works in a different way rather than 
traditional websites. Reactjs works like 
Mobile apps.You can see changes in the URL 
but can't see loading

141
00:23:32,200 --> 00:23:37,000
We only take data from the server.

142
00:23:37,100 --> 00:23:41,900
In the first load, ReactJS take full Skelton 
of the website.

143
00:23:42,000 --> 00:23:51,700
Required data are taken in JSON format by 
using API requests.

144
00:23:51,800 --> 00:24:01,500
We can make our sites very attractive and 
responsive by using React.

145
00:24:01,600 --> 00:24:16,200
We can use any backend like android or flutter 
for React frontend.

146
00:24:16,300 --> 00:24:26,000
Because it follows the same concept of giving 
JSON and taking JSON. (JAVASCRIPT OBJECT 
NOTATION)

147
00:24:26,100 --> 00:24:50,500
JSON is the special format to send data between 
browser and server. You can use XML instead 
of JSON. It is a lite weight and modern method 
used by developers.

148
00:24:50,600 --> 00:24:55,400