Next will add App.js file. In here, instead of rendering App component to the DOM, we pass Router compoenent with predefined routes. To configure index route, we can use IndexRoute.
Monday, August 8, 2016
Basic React Routes
In this post I will demonstrate how to implement basic routes with ReactJS. First install following node dependencies accordingly.
Then add webpack.config.js file and index.html file accordingly. I have already explained above these configurations in my previous ReactJS posts.
Then add Help.js, Home.js, Student.js and StudentDetails.js files.
In Student.js file we can see an import statement of react-router, which will handle routing functionality. This will sync UI with URL by having components associated with routes. Child components make available in parent components by using this.props.children. Link will generate navigation links accordingly using react-router.
Next will add App.js file. In here, instead of rendering App component to the DOM, we pass Router compoenent with predefined routes. To configure index route, we can use IndexRoute.
Final output will be like below.
Next will add App.js file. In here, instead of rendering App component to the DOM, we pass Router compoenent with predefined routes. To configure index route, we can use IndexRoute.
Subscribe to:
Post Comments (Atom)
ReplyDeleteWonderful article really helpful for everyone.
Full Stack Training in Hyderabad
Full Stack Training in Ameerpet
Great Article. Thank you for sharing! Really an awesome post for every one.
ReplyDeleteIEEE Final Year projects Project Centers in Chennai are consistently sought after. Final Year Students Projects take a shot at them to improve their aptitudes, while specialists like the enjoyment in interfering with innovation. For experts, it's an alternate ball game through and through. Smaller than expected IEEE Final Year project centers ground for all fragments of CSE & IT engineers hoping to assemble. Final Year Project Domains for IT It gives you tips and rules that is progressively critical to consider while choosing any final year project point.
JavaScript Training in Chennai
JavaScript Training in Chennai