In this tutorial I'll show you how to install the view_component gem in a Rails 7 app using Hotwire and tailwind. I then generate a view component for a popover and make it load in using Turbo Frames, we also use slots to allow several content blocks to be passed into the component. If you want to follow along you can find the code at the start of the tutorial here: https://github.com/phawk/view_component_tutorial/tree/main And the finished code is can be found here: https://github.com/phawk/view_component_tutorial/tree/view_component_tutorial Let me know in the comments if you use view component with Rails already, and if you have any tips or questions of your own. Apologies for the detour in the middle where I was trying to use `content` as a name for a slot, although I thought I'd leave this mistake in, as troubleshooting is half the battle when programming. Chapters: 0:00 Installing view_component 1:20 Generate a new component 2:15 Setup Turbo frame 3:50 Configure Popover UI 5:15 Setup component props 7:05 View component Slots 12:15 Conclusion --- Has this video helped you out? Consider buying me a coffee to say thanks and support future content like this, thanks! https://app.payhere.co/rapid-ruby/buy-me-a-coffee-aa4618e4-45d1-4727-81b9-2d081449d61d You can also find more content like this, including premium courses and exclusive community and mentorship to help you level-up! Head over to https://rapidruby.com and use the code RRYOUTUBE for a discount!
Published: May 16, 2022