Add Geolocation to Search with Rails and Stimulus.js

Sdílet
Vložit
  • čas přidán 18. 02. 2024
  • 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: web-crunch.com/posts/geolocat...
    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 (webcrunch.com), where I publish tutorials, articles, and the occasional vlog about design and development.
    📰 Never miss an update! Click here to subscribe: czcams.com/users/webcrunc...
    💻 Read the written version:
    web-crunch.com/posts/geolocat...
    💎 New to Ruby on Rails? Enroll in my course HELLO RAILS:
    hellorails.io
    💻 The Blog (my source of truth): webcrunch.com
    Additional Links:
    🎨 Bring life to Rails projects with Rails UI: railsui.com.
    👨‍💻 Hire me: Visit: railsui.com/custom
    🐤 / webcrunchblog .
    ⚙️ 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!
    ✨ github.com/sponsors/justalever
    ☕️ www.buymeacoffee.com/webcrunch

Komentáře • 5

  • @ledockol
    @ledockol Před 3 měsíci +1

    Thanks!

  • @leonelvega7239
    @leonelvega7239 Před 3 měsíci

    Awesome, thanks for sharing! I try to never miss any of your videos! 😁

  • @lamvu1238
    @lamvu1238 Před 2 měsíci +1

    Thanks for sharing. I’m really into your videos!