In this 4-part series, we build a photo sharing app with geo-searching capability. Users can upload photos and search for nearby photos by moving a map (Google Maps) around. The following tools and libraries are used in this project:
Setting up Node, React & Redux
In this session, we set up the API and connect it to a React front end with Redux store. We query the API from the React components to ensure the connection is successful.
In this session, we set up the Google Map for the navigational UI of the site. We track the map's current position and use that to determine where the user wants to view photos.
Uploading Images, User Registration & Login
With the map integration complete, we move on to uploading images to Cloudinary. Then we set up the user registration and login flow so that every post is tied to a specific user.
Finally, we prepare geo spatial requests so that users can view posts that are nearby a specified location. Afterward, we integrate an HTML theme (from html5up.net) to create nice-looking UI and then deploy the project to Heroku.
Click the button below to subscribe to this tutorial.
Premium members can subscribe for free.
Can't make it to our live courses? Join our online membership for video tutorials, code samples and access to our Slack Channel.