Tutorial Article Here By Nick Anastasov
Here you can follow the steps, and I have added the steps to have the app running with the current React version.
Packages you need:
browserify
moment
react
react-dom
reactify
uglify-js
watchify
Use this format:
npm install packageNameHere --save
The app tutorial is about a year old and you need to use React-Dom
- Here's an article about Using React-DOM
Here are the following places that need React-DOM
In files Search.js | Map.js | Main.js
at the top
var ReactDom = require('react-dom');
The original tutorial uses getDOMNode()
in the Search.js
file.
React changed a few things. I found this article helpful to understand the changes.
- Old Version
handleSubmit(event){ event.preventDefault(); this.props.onSearch(this.state.value); this.getDOMNode().querySelector('input').blur(); },
- New Verison
handleSubmit(event){ event.preventDefault(); this.props.onSearch(this.state.value); ReactDom.findDOMNode(this).querySelector('input').blur(); },
I added this for the icons:
https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css
And this for the GMAPS which makes using google maps API a breeze:
https://cdnjs.cloudflare.com/ajax/libs/gmaps.js/0.4.24/gmaps.js
- Reps, Reps Reps. I highly suggest coding it out, and not copy and paste. Certainly sse a working version for reference. You will learn more, promise.
- If there are any problems, submit an issue!