Turbocharged realtime search with Ruby on Rails 7

Adding basic search functionality to a Ruby on Rails app is not the toughest task in the book but when you think about it before hotwire.dev was around the process of making "live" search work was rather cumbersome.
This guide is a very primitive example of creating a real-time search form for a resource in a Ruby on Rails 7 application. We'll use various components of the hotwire.dev ecosystem to achieve our goals.
Read the full tutorial here:
web-crunch.com/posts/turbo-ch...
Timestamps:
0:00 - Intro
2:25 - Project kickoff
3:59 - Create Band scaffold
4:45 - Configure routing
5:33 - Add search form to bands#index
10:13 - Controller search logic
11:17 - Creating dummy data to search
12:29 - Add new bands partial
15:24 - Account for turbo_frame response in the controller
18:47 - Add new stimulus controller
24:00 - Ways to extend this and improve
------
Hi, My name is Andy Leverenz and I work as a product designer and developer. For fun, I design, code, and write. Check out my blog called Web-Crunch web-crunch.com where I publish design and development tutorials with the occasional vlog.
♥️ Sponsor me on GitHub
github.com/sponsors/justalever
☕️ Keep me awake. Buy me a coffee
www.buymeacoffee.com/webcrunch
📰 One-Click Subscribe:
kzread.info...
💻 Previously published at:
web-crunch.com/posts/turbo-ch...
💎Ruby on Rails Course: HELLO RAILS
hellorails.io
💻 Check out the blog:
web-crunch.com
🦄 Check out my personal site:
justalever.com
🚀 Links:
Weekly Newsletter: digest.web-crunch.com/
Twitter: / webcrunchblog
Github: github.com/justalever
📘Check out my book on UX Design:
"LUXD: Learn User Experience Design"
web-crunch.com/products/luxd
📙 Check out my FREE book on Tumblr Theming:
"Pro Tumblr Theming"
web-crunch.com/products/ptt

Пікірлер: 21

  • @nonefvnfvnjnjnjevjenjvonej3384
    @nonefvnfvnjnjnjevjenjvonej33842 жыл бұрын

    Great to see new modern rails tutorials

  • @carltanner3632
    @carltanner3632 Жыл бұрын

    Thanks for the help Andy. I like the real-time search feature for results.

  • @Webcrunch

    @Webcrunch

    Жыл бұрын

    Glad to help!

  • @josbexerra8115
    @josbexerra8115 Жыл бұрын

    Muchas gracias Mister Crunch...... saludos de los andes peruanos

  • @vaultek_
    @vaultek_2 жыл бұрын

    Thanks dude I appreciate your efforts ❤❤

  • @JonMakesApps
    @JonMakesApps Жыл бұрын

    Great example and tutorial! Noticing your code comment, if you really don't like the `turbo_frame_request?` conditional in the controller it is optional as turbo will pull the frame tag from the response and only update that portion in the page. However, your example is really helpful for applications where there is an expensive operation just to build the layout on the server (for example loading a bunch of data for the header/nav/whatever)

  • @pantesmor
    @pantesmor2 жыл бұрын

    Hey, love your videos. Starting soon in a new company who switch to rails 7.0, no experience with rails before but i'm starting to fall in love with it ! Thx for your content, it's really great ! Small question: What's your terminal theme/configuration, it's pretty cool, love it !

  • @cjjb
    @cjjb Жыл бұрын

    Great content, thanks!

  • @326harshvarlekar8
    @326harshvarlekar8 Жыл бұрын

    Hi there are on issue or you forget that after search get all the data i need to click again on search button why? it's i think not user friendly because user are not able to understand . otherwise this video is vey helpful for me

  • @HistMad
    @HistMad2 жыл бұрын

    Also, What has helped you become good in Rails? How did you get past the beginner phase?

  • @Webcrunch

    @Webcrunch

    2 жыл бұрын

    Building a bunch of apps got me the furthest. Build clones of popular apps or think of an idea for an app and see how far you can take it. You'll hit hurdles and be googling solutions for hours but eventually, it just clicks. I first learned rails through the desire to create a SaaS app for design tutorials online.

  • @HistMad

    @HistMad

    2 жыл бұрын

    @@Webcrunch How did that SaaS app do? Did it perform well in the market, or did you just abandon it?

  • @Webcrunch

    @Webcrunch

    2 жыл бұрын

    Not great. I think it had potential but I needed to market it way better than I was. Ultimately it wasn't very passive which is something I've wanted from that type of app so I sun set it. I did manage to do a full launch and some customers though. It was a great learning experience.

  • @HistMad

    @HistMad

    2 жыл бұрын

    @@Webcrunch Thank you so much for your response!

  • @belledonne
    @belledonne Жыл бұрын

    "this is kind of junkie looking" **look at my own code** this is fine really.

  • @Alimenteocerebro
    @Alimenteocerebro Жыл бұрын

    My page is reloading every time I type something. What's can be the problem?

  • @mejid

    @mejid

    Жыл бұрын

    I am having the same issue, were you able to fix it?

  • @loqueaprendi4861

    @loqueaprendi4861

    Жыл бұрын

    @@mejid I ended up removing the turbo_action: "advance" from the form and it worked.

  • @HistMad
    @HistMad2 жыл бұрын

    By the way, you may have noticed that I am constantly bugging you with questions. My question of the day is, how do you go about getting clients as a freelance rails developer? What techniques have worked for you so far?

  • @Webcrunch

    @Webcrunch

    2 жыл бұрын

    Haha, no worries! Ask away... As far as getting clients, I got most through blogging and YouTubing. It was a cool effect that demonstrated trust in building things for potential clients. They could see first hand I had enough knowledge to help them create their app ideas. I don't have a ton of outreach these days simply because I don't advertise to be looking for work. If I did I'd imagine I would be turning more folks away. If I was just getting started I'd probably apply to roles even if it wasn't a perfect fit. Alongside that, I'd be trying to market myself(blogging, twitter, youtube, tiktok). You could even go apply to businesses that you know use rails as their stack that aren't hiring and sometimes they might offer you something.

  • @HistMad

    @HistMad

    2 жыл бұрын

    @@Webcrunch Thanks