Learn React JS Fundamentals With Project | React Tutorials for Beginners

[@DipeshMalvia]

Guys, if you feel this video was helpful in any sort than please hit the like button and subscribe channel. Need your support to keep myself motivated😎

[@masnunahmedsporsho612]

bro are u a professional developer?

[@ramubhukya3238]

How to communicate this application to firebase database? Pls explain for this problem👏👏

[@DaniyalKhan-hk4uf]

I have facing a problem when I access props there is nothing shown on my localhost when I run in console.log its show data

[@TheHelpOfNS]

Bro really awesome... explanation...can you please make a vedio crud operation using functional components........we will support you..plz share your details.... thanks bro 💕💕💕💕💕💕👍

[@faizanali-gr8yx]

sir useEffect to retrieve data back from local storage not working when i refresh page

[@Abogida11]

I love this tutorial, clear and to the point, the only Issue is why you need to mix class with functional component, I am trying to change the class comp. to FC butting getting some issues already.

[@johnherrera5913]

Master! Great build, so much value condensed into a small amount of time!

[@DipeshMalvia]

Glad you liked it!

[@bilalshuja131]

35:01 you remove &&(and operator) and write ||(or operator) but its still not working and adding empty fields

[@tomasburian6550]

Bro! I came here to learn how to delete items and refresh the list and you didn't disappoint! Thanks a lot.

[@DipeshMalvia]

Glad I could help!

[@blosq2673]

I'm from Kyrgyzstan , bro you helped me a lot!!! Forward only forward

[@DipeshMalvia]

Thanks buddy. More videos to come😊

[@vinothkumars7421]

To the point explanations .. Love it...Way to go brother

[@DipeshMalvia]

Glad you liked it!

[@abhimanyuarora9262]

I am *gonnu* like this video for sure :)

[@ProssCraft]

I usually don't comment vidoes on YT, but this time I need to say I really appreciate your content and time given to those projects, they are very helpfull :)

[@sujairsuhaim2769]

Useful brother do not stop your works❤

[@DipeshMalvia]

Thank you, I will

[@ronaldrendessyrealtormba8824]

Hi there!! I look forward to watching your instructional video!!

[@DipeshMalvia]

Thanks! Hope it's helpful!

[@prasannanaik1023]

Really great video so far I found for react js project. From the beginning the way you started by first building basic components and then by using react concepts building functionality one by one really helped a lot for me . Thanks

[@ambushtunes]

Thank you man...you really helped me out. I was able to merge this with a ruby backend.

[@DipeshMalvia]

Excellent!

[@Adarshabinash]

24:48- at this point I am facing some trouble...my jsx component when I copy and paste in ContactCard shows that the map elements are not defined. should I use props and transfer these to this component?

[@narayanankanchipuram1468]

Hey Dipesh, your service is so useful, thanks for your videos, please do lot of videos like this, it is most useful people like me,

[@DipeshMalvia]

Sure I will

[@debrad.castleberry2457]

Nice Explanation. Subscribed. Love from Pakistan 🇵🇰

[@DipeshMalvia]

Thankyou so much! Welcome to the family 🙂

[@rishabhprabhakarfilms]

not able retrive the data

[@abhishekshivgan1884]

Same here!

[@ankitapandey8655]

Same 😢, can't even figure out why it's not happening

[@ishaneemandal9783]

Only form is visible in my case .....and when am adding new contacts nothing is added to the contact list !!

[@sherinfernando2720]

Your tutorial is amazing,Way to go !! 🔥 It would be great if you had a project with context API too. Just a suggestion. :)

[@DipeshMalvia]

Noted! I have a whole bunch of videos covering all topics of React. You will see more in coming months. Thanks!

[@diwakarsingh68]

Hi Dipesh, You are great!!. This video really helpful for me.

[@DipeshMalvia]

Glad it was helpful!

[@swethasandeep3025]

This video is really helpful to learn react. Its crisp and clear. Thankyou for your effort

[@DipeshMalvia]

Glad you enjoyed it!

[@joe86569]

evidayum malayalee 😆

[@jasoncysiu]

Why do we use class component for addContact?

[@hiteshsuthar1097]

Dil ❤️ maange more 🔥

[@Redstarcrew]

Could you please show us how to code Addcontact as a function instead of a class?

[@ankitkumar-bg7dr]

Could you please share which company and model headphone you are using?

[@naveenkumarkota2090]

@dipesh i think error in contact card saying props.clickhandler is not a function

[@dhanyakrishnan5795]

It is great tutorial I could ever see , just a suggestion if you decrease your speed a little bit it will more convenient as it made me pause and do it again but expecting more tutorial for MERN stack too

[@joe86569]

evidayum malayalee 😃

[@felipebatista7469]

i am from brazil, thanks for the video bro!! helps a lot!

[@mescalsour]

Thank you for the great tutorial. This one is the most helpful I found so far.

[@anrgkdm]

I created the app and started it, It worked initially, Then I stopped it. And then Deleted the files not required for this application, as said in video from 7:04 to 7:38. But after that the application never ran. It gave errors like "ENOENT: no such file or directory, open "

[@sai6157]

Same issue I am also getting, did u get it ?

[@rojamanepalli3068]

@@sai6157 try to navigate to correct directory path then run the application

[@TechnicalHeaven]

Nice tutorial Dipesh, I learn a lot 👌🔥

[@dineshkumar8893]

Best content, your explanation was so easy tp understand the working principles

[@DipeshMalvia]

Glad you enjoyed 😊

[@MohitKumar-tn1cf]

It was going good to learn!! thanks

[@niravsanepara3934]

props.clickHandler is not function error shows plz help !!!!

[@bankauday7784]

how to fix the vulenrablities while downaloding packages??

[@Redstarcrew]

Thanks a lot for the video my friend!

[@DipeshMalvia]

My pleasure!

[@corneliusluka3555]

Thanks for this great video, you can make more complex app with React Sir. you are a great instructor

[@pk_officl]

You just taught short and sweet all things what I have learnt from 100 videos. You have fulfilled the starting level. This should be a first try for every React beginners. I can't import uuid from uuid4. Have anyone faced this issue kindly post the solution.

[@HARSHKUMAR-fi5fr]

same here

[@saitejapendli7036]

Bro,where i can import this delete icon.instead this icon we can put button for this ??

[@sudhakiran8292]

I have an swetting, when i am same cide write on my laptop ro as weyas understand

[@Crickeuzz]

You are doing great work i appreciate it ,thanks all about your efforts.

[@programmer5475]

Thank you for theReactJS video series. It makes learning React JS way simpler. But while implementing this application, I was struck in useEffect part. I was not able to restore values on reload. After debugging, I came to know that useEffect was running twice due to React.StrictMode. This issue makes me do some research on it and one additional point that has been added to my React knowledge is that for security purposes, StrictMode forces every component to render twice. Thank you again!

[@DipeshMalvia]

This happens in React 18 so I have a video how to make the code work please check - kzbin.info/www/bejne/rHLThX2mh9asrpY

[@shivamsingh-ud5hb]

I used ui container center class but the content is not rendered at center

[@DipeshMalvia]

I think you should refer to semantic UI documentation for classes as the documentation might have changed in last one year.

[@5minupsc723]

how to fetch local storage and display it on screen

[@DipeshMalvia]

If you are using react 18 then you can follow this video for fixing the breaking changes - kzbin.info/www/bejne/rHLThX2mh9asrpY

[@5minupsc723]

@@DipeshMalvia ok

[@anilkumardas7662]

Sir give me solutions..... how to cheack localstroage is empty or not ? (If the localstroage is empty simple write please add data other wish localstroage data will write )

[@nandagopal375]

Thank you for providing valuable information sir 🙏🙏🙏

[@anubhapant5227]

Please make more videos on such kinds of projects on React.

[@DipeshMalvia]

Sure! Keep watching!

[@rudragoudapatil5913]

I needed to install util to run uuidv4 Later again I am getting error of maximum storage exceeded Can you please help me out from this.

[@akhilaakki4912]

Yes how to solve this

[@Ali_Cook20]

Hi Dipesh . Can you say me about your course ? If i do this project and others . Will i be a junior or middle react developer? Thanks for your reply.

[@girishpandey9976]

Hey guys you done the good job and keep it up

[@sarojakulkarni1030]

LOVELY VIDEO SIR

[@DipeshMalvia]

Thanks a lot

[@manishkuswhaha2563]

Today I tried to implement the same app but the local storage functionality is not working. DATE: 09-07-2022

[@inevitableman4159]

Have you solved that problem?

[@chanelj5072]

Hello, I keep on getting this error 'Uncaught RangeError: Maximum call stack size exceeded' it is shown in the console when I try and add a contact. How would I fix this?

[@DipeshMalvia]

Please use the reference code for comparison.

[@hitechofficial]

please upload tutorial series and project building in next js please thanks. Your way of teaching is awesome

[@imprasna2539]

Dipesh, the localstorage is not working for me

[@neets7519]

Amazing video

[@DipeshMalvia]

Thanks!

[@jhunconsole8492]

What are the cons and pros of using classbase components vs functional components?

[@DipeshMalvia]

Hi Jhun, I don't have a straight and small answer for your question but they both have their props and cons. Also function components with React Hooks are getting popular as a modern way of building components. I found an article that would be a good read to understand about both type of components and their pros & cons. Article - www.twilio.com/blog/react-choose-functional-components

[@bhoomikasb147]

Can you please also help me to edit the data from local storage....

[@46aniketchandivkar82]

I'm just starting react so Can I begin with this?

[@pendhotapavankumar7297]

Thanks for the support 🔥 to us sir, i have a doubt in my project? that is how to add navigation as well as sidebar , here i'm adding navigation but sidebar? please help me, how to do?

[@ankitanand3216]

i seen this now , and i implemented but after refreshing data went hide from the document. what might be reason to happen this ?

[@DipeshMalvia]

The reason is you are using React 18 and there were some breaking changes in working of useEffect - You can refer to this video how to fix the issue - kzbin.info/www/bejne/rHLThX2mh9asrpY

[@ankitanand3216]

@@DipeshMalvia thankyou

[@sandeeppinasimham8000]

Class name not getting applied what is ui class?

[@2784raj]

hi, Dipesh love they way you explain the code , can you guide where is second part of this contact app ?

[@DipeshMalvia]

Hey Raj, the second part is the next video React Router, after that it's React Axios CRUD and last is Search Filter. Playlist link - kzbin.info/aero/PLTP3E5bPW7944Ec1lfXzavqRHzxY5FigD

[@2784raj]

@@DipeshMalvia thanks you are Legend, I will highly recommend to my colleagues who wants to learn react,

[@DipeshMalvia]

@@2784raj : Thanks, my channel needs support. Happy Learning 😃

[@bhukyaramu7047]

Hii sir,can you explain about Employee details like employee list and employee list item and title of the employee and description of the employees using crud operation.

[@DipeshMalvia]

I have a CRUD operation video for this contact app you can use it as a reference and but your own Employee project - kzbin.info/www/bejne/a2rdYpJpYtuHhc0

[@basamalhassan7006]

Thanks a lot for this tutorials. Please can you make advance react tutorials. Thanks in advance

[@DipeshMalvia]

Sure, more videos on React are on the way. Publishing React Router on Tuesday. Stay Tuned.😊

[@aniketbond0072]

Sir i followed exact same steps as you but, the trash icon is appearing at bottom of email not at right bottom, please help me with it 🙏

[@DipeshMalvia]

@@aniketbond0072 : you can check the codebase and copy the css files.

[@empowercode]

Hey Dipesh, nice to meet you! I just found your channel and subscribed, love what you're doing! I like how clear and detailed your explanations are as well as the depth of knowledge you have surrounding the topic! Since I run a tech education channel as well, I love to see fellow Content Creators sharing, educating, and inspiring a large global audience. I wish you the best of luck on your KZbin Journey, can't wait to see you succeed! Your content really stands out and you've put so much thought into your videos! Cheers, happy holidays, and keep up the great work!

[@DipeshMalvia]

Glad you enjoyed. Thanks a lot for a such a nice comment. Highly appreciated ☺️

[@empowercode]

@@DipeshMalvia No problem, keep up the great work!

[@discovershorts6968]

Sir I'm facing a little problem.... when i getitems from local storage....all items are automatically delete when i refresh this page... i mean.. when want to get items form local storage.... its not working.. so what i should do??

[@DipeshMalvia]

Please check are your items stored in the local storage in the first place. If need your can check GitHub code for reference

[@discovershorts6968]

@@DipeshMalvia Yes Sir I already checked.. all items are storing on local storage... Okay Sir 😊 I'll check GitHub... Thanks

[@dragansliskovic3473]

Did you solve your problem mate? I am also having the same issue. Files are storing perfectly fine on Local Storage but when I refresh them they are gone. Could it be because I kept App.js file in src folder? Weird...Copied then entire code from GitHub and still the same issue. But when I use the same code and have my App.js inside components folder it works. Weird stuff :)

[@discovershorts6968]

@@dragansliskovic3473 Not yet... Bro

[@veeramuthur]

Thanks its very helpful

[@DipeshMalvia]

You're welcome

[@inevitableman4159]

Unable to store the data in the local storage

[@KaranKumar-bp4hu]

@DipeshMalvia Sir, Please before statring a project clear the flow of data , it would easy to understand the complete code at very efficient time

[@LinkEX]

Awesome commentary and great tutorial! The only thing that really did grind my nerves was the recurring Microsoft window alert sound. It's obnoxious enough by itself, but being so much louder than your voice recording didn't make things better 😅

[@LinkEX]

You might want to consider either turning it off in the future. You can even remove them in post-production by using Audacity - this works pretty nicely by using voice sampling IIRC.

[@drmr_mist]

Hello Dipesh, great video! I am wondering how would u increment id prop without using uuid?

[@sivanagarjuna569]

Sir icon is not fit properly

[@ravinorthland]

Good tutorial 😀

[@ShubhamSingh-eg6wq]

I'm not able to retrieve the data from the local storage

[@DipeshMalvia]

As you might be using React 18, so there are some changes I have added a video please check - kzbin.info/www/bejne/rHLThX2mh9asrpY

[@sai6157]

I tried but after deleting webvitals file and other files I am getting error .. I am not getting what to do.. please help..

[@DipeshMalvia]

Please check your errors might be you have deleted the file but their refrences still present in index.js or app.js files

[@dhanyakrishnan5795]

hey brother what is that ui classes? are we importing anything?

[@bharathbellamkonda]

yes when we import stylesheets from such semantic ui's we can use classes as such

[@ankitrikame336]

Great 💯

[@dabbarnaresh7791]

Hello sir, nice video I'm doing same as you But when I refresh Page , My get data also not showing

[@DipeshMalvia]

Yes, because you are using React 18 and the tutorial uses React 17 - please follow this updated video - kzbin.info/www/bejne/rHLThX2mh9asrpY

[@dabbarnaresh7791]

@@DipeshMalvia Sir how can I contact you

[@rajalekshmir8308]

I tryed many time .. error occurs in starting. Can't resolve module

[@DipeshMalvia]

This won't be sufficient to provide any solution. Make sure you have NodeJs installed properly and if you are using the reference code than use npm install to install the dependencies.

[@narensabari2891]

Hi dipesh first of all thanks for your videos. I tried this video in this i am struck in uuid. After including the uuid coding, compiler throws util error. I am using node version 16 . So can anyone face this type of issues ?

[@narensabari2891]

@@cjs4912 yes. Instead of uuid i am using the default id value. And pass that unique id as list key

[@smita8809]

@@narensabari2891 i faced this issue too , just resolved it . use import { v4 as uuid } from "uuid";

[@davisonyeoguzoro9232]

I’m having error in my code, PLEASE HELP

[@DipeshMalvia]

Please specify your error or check for github link and take reference from code

[@busrakara4929]

thank you!

[@DipeshMalvia]

You're welcome!

[@SalutEnterprise]

in the trash icon fuction you can say only e.target.parentelement.remove this its coffuse Eng

[@straightdrivetalks123]

How to do reports in react any tutorial bro

[@keerthanachennamsetty2322]

Bro, Can you make a video for showing how real time react project will be

[@jayprakashsingh6327]

Encountered two children with the same key, ``. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted - the behavior is unsupported and could change in a future version.

[@9a56mahabirjaiswal9]

It becomes difficult to do usestate in class component for those who are engineers .You should atleast also show the usestate with functional component then should move to usestate with class component

[@gkmishra2009]

Best sir

[@DipeshMalvia]

Thanks!

[@sindhupoojary3112]

Error: maximum call stack size exceeded RangeError: maximum call stack size exceeded. Can u plz give me a solution for this

[@calebakpomughe6566]

Having trouble with the local storage key

[@calebakpomughe6566]

The useEffect isn’t working

[@DipeshMalvia]

Please follow this updated video for React 18 - kzbin.info/www/bejne/rHLThX2mh9asrpY This will show how to solve the problem with react 18 or downgrade your react version to 17.

[@calebakpomughe6566]

@DipeshMalvia any help on this , im not seeing the contact key on my local storage

[@darjipavan5112]

Sir , javascript me interview questions answers ki new series banaiye please ( theory, practical examples )

[@ankitapandey8655]

Can't retrieve contact 😢

[@JustVinayadav]

so easy like a todo application

[@flyflor599]

Where is the classes ...avatar etc?

[@nitinworldwide]

the video was good but bit confusing bcoz of contacts name defining props child to parents it should have more time on this parts

[@aayush9752]

i don't know basics of react js is it good for me

[@pratosh]

use nanoid if the uuid is not working.....thanks😄

[@masnunahmedsporsho612]

good job

[@55BLOCKS]

i love it

[@DipeshMalvia]

Thanks!