You can watch series 1. React CRUD Application with Redux, JSON Server, router, axios - CRUD Demo ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-9QQ3ntJzpa4.html
@@rizkyadhahardiman4585 Thanks for asking. You can add styles in container div for these button. It will make these buttons in center, you can try changing justifyContent value.
Thanks for reply Muhammad, Glad you like it. Be connected by subscribing, I will upload videos which can make you begineer to expert. Videos on topic which I explored in live major projects.
@@mostlyrob3469 Hey bro, Typescript is easy, we dont need to learn anything new, just need to follow similar things. And its always better to do with typescript even from starting days. Dont limit with pure react, go with typescript even if you dont know.
Hi Sagar, This is a really good project to learn React with Typescript. I had a question for you. Can you explain how we can use an enum to navigate between pages? As I don't see any connection between the enum and addEmployee page and still it navigates to it.
Hi Niket, Glad you like the video. Answer to your question: 1. If you keep enum aside for now, just understand, we have one state property in Home.tsx i,e shownPage. Whatever value you save to it, like Add, Edit or List, it shows that page, because in return block in same file, we have used the condition. According to shownPage state, we are showing the component. 2. Now, shownPage state value is changed on each button click, like if user click on add employee button, its click handler method is changing the showPage state to "add", thats how its working for other buttons as well. 3. SO instead of hardcoded value like "add", "edit" and "list", I have used enum, so no spelling mistake should happen, and to it make it strongly type. I hope I explained you properly, if you still didnt understand, please reply again.
@@codingpartner-english Thank you for replying back to me. I understand that we have a state ie. shownPage which is changing onClick and so different pages are loading. The concept I am trying to understand is how come just a change of work is routing and showing a different page. As we haven't even used React Router to specify the path to the page it's just a change of word and that state isn't connected with any of the other two pages like the list page and add employee page. That's really confusing for me.
@@NIKETSHUKLA Ok I got you. I think you are not much familiar with basic concepts of React. Here we are saying, shownPage is State, it means, whenever is the state value changed, then that component rerender again (Home component). After rerender, it has new value, so in return statement we have conditions, according to that value, component renders. You can check useState for more details.
@@codingpartner-english Oh yes, I just literally forgot that the page will rerender and according to the condition, the page will be displayed. I was just concentrating on enums and hows this happening. Thank you for clarifying you are too good...
Hi Ashwini, Thank you for suggestion. In this video, my purpose was to keep it simple, that's why I didn't focus much on code reusability, application performance, as I don't want to confus the newbie. If you are looking for reusable onChange function, I will recommend you to go with custom hook i.e useInput, which will save lot of efforts of rewriting same code with good performance. You can watch here ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE--EzgrkpBIm8.html
Hi Harman, Thanks for comment. This video is for person who have some idea about react and javascript. It means we already consider they have gone through variables and components, the basic things required. variable name and components name are self declarative in this video. Just read it twice you will understand what variable and component should do. If you still didn’t get any idea about specific, please drop a message, will try to help.