Add Geolocation to Search with Rails and Stimulus.js

In this tutorial, I'll show you how to add Geolocation support to a search form using Ruby on Rails and Stimulus.js

By integrating geolocation capabilities, users can search for locations based on their current position which saves time and effort.

Keep reading here: https://web-crunch.com/posts/geolocation-rails-stimulus

Timestamps: 00:09 - Demo of what we are building 02:08 - Create a new Rails application 02:40 - Quick overview of Geocoder gem 03:52 - Generate controllers 05:04 - Update the routing 06:08 - Add a basic search form with Tailwind CSS for styles 06:30 - Add data attributes for stimulus.js support 11:22 - Generate a Stimulus.js controller 12:08 - Ensuring the controller works 12:28 - Coding the Geolocation JavaScript in the Stimulus.js controller 13:28 - Understanding the navigator.getCurrentPosition method 18:30 - Adding a fetch POST request to the Rails app via JavaScript 21:58 - Overview of the JavaScript logic 23:00 - SearchLocationController logic with Geocoder gem 24:00 - Trying things out and debugging 26:00 - Closing thoughts and ways to enhance this code

======

👋 I'm Andy Leverenz, a passionate product designer and developer. I love creating and sharing my knowledge through design, coding, and writing. Join me on my journey by checking out my blog, webcrunch (https://webcrunch.com), where I publish tutorials, articles, and the occasional vlog about design and development.

📰 Never miss an update! Click here to subscribe: https://www.youtube.com/user/webcrunch?sub_confirmation=1

💻 Read the written version: https://web-crunch.com/posts/geolocation-rails-stimulus

💎 New to Ruby on Rails? Enroll in my course HELLO RAILS: https://hellorails.io

💻 The Blog (my source of truth): https://webcrunch.com

Additional Links: 🎨 Bring life to Rails projects with Rails UI: https://railsui.com. 👨‍💻 Hire me: Visit: https://railsui.com/custom 🐤 https://twitter.com/webcrunchblog. ⚙️ https://github.com/justalever.

P.S. This stuff takes a long time to make but I love to do it. To help me keep at it consider supporting me. If not monetarily, then subscribe to the channel or share it with someone!

✨ https://github.com/sponsors/justalever ☕️ https://www.buymeacoffee.com/webcrunch ... https://www.youtube.com/watch?v=GkqZoIK1HhY