Review search results in a dropdown

Introduction

Learn how to set-up a search autocomplete with Stimulus. A user can see query results after typing in the input field. The Stimulus Autocomplete library is a Stimulus controller that provides an easy solution to auto-completion.

Bring your listing page or online store to life.

In this article, you will learn how to set up a light gallery with Stimulus, a modest JavaScript framework for the HTML you already have. Stimulus is a powerful alternative to SPA’s and enables developers to bring web applications to life.

Stimulus. A modest JavaScript framework for the HTML you already have.

Stimulus Components is an open-source project that hosts a collection of customizable components for typical JavaScript behavior. One component helps you to create a feature-rich light gallery into your project without writing any custom JavaScript at all. See lightgallery.js…

Tailwind CSS is a revolutionary design framework that has attracted both diehard fans and critics. Fans love its speed, simplicity, and powerful building capabilities. Critics hate its bloated HTML design. Regardless of which side you are on, Tailwind has caused a significant shift in the developer community.

If you enjoy building web applications with Tailwind, it gets even better when leveraging pre-built components and pages. Tailwind UI is the (partially paid) masterpiece by the founders of Tailwind. If, however, you are looking for more free alternatives, the Tailwind community has your back. …

In this article, you will learn how to set up a modern carousel with Ruby on Rails and Stimulus Components. This is a powerful and easy solution to build a fancy carousel into your project without writing any custom JavaScript.

Check the demo page to get an idea of what you can build after reading this article.

Rails credentials are the new gold standard. ENV files are an insecure ancestor. In this article, you’ll learn why and how to migrate, how to use API keys in Ruby, YML and js.erb, and how to share a single key once with your team.

DHH tweeted about its arrival nearly three years ago, but new technology often takes time to catch up. A wake-up call is when you find yourself too frequently juggling API keys between developers in your team. It might be time to take a second look at how to implement credentials in a rails app.

Why Should You Move From .Env to Credentials?

The…

With the right tools, any developer can enjoy deeply satisfying coding sessions. Mastering flow is empowering. The opposite leads to frustration and annoyance. Luckily, linters and formatters can help do the heavy lifting when it comes to coding best practices.

In the guide below, VS Code users and Ruby on Rails developers can find a detailed setup to build well-formatted and styled projects in no time!

1. JavaScript — StandardJS (w Prettier)
2. CSS and SCSS — Stylelint
3. Ruby — Rubocop and Rubocop Rails
4. Markdown — Markdownlint

First, what is the difference between a linter and a formatter?

A linter checks code…

TL;DR

Are you looking to become a better developer by creating an empowering digital workflow? iTerm2 will help you to make the most of your day behind the keyboard. It’s the terminal that has all the functionality a developer ever wished for.

The guide below will help you to:

1. Download and install iTerm2
2. Set up a hotkey shortcut — Double tab option ( ⌥)
3. View timestamps
4. Highlight and comment on logs
5. Autocomplete — Command (⌘) plus semicolon (;)
6. Click links from the terminal — Command (⌘) plus click
7. Focus your troubleshooting

At first, it seems like the native terminal on a…

Ruby is built with developer happiness in mind. However, if your editor is not correctly set up, you’re in for a painful ride. Finding the right extensions on VS Code can take you down a long trial-and-error path.

Here’s a list of powerful extensions for Ruby on Rails developers.

TL;DR

Ruby

1. Ruby
2. Ruby Solargraph
3. Endwise
4. ERB Helper tags
5. Rails DB Schema
6. Rubocop
7. ERB Formatter
8. Emmet in ERB

General

1. Atom Dark Theme
2. VSCode-icons
3. DotENV
4. Output Colorizer
5. Auto Rename Tag
6. Highlight Matching Tag
7. Bracket Pair Colorizer 2

Ruby

1. Ruby

This speaks for itself. Ruby syntax highlighting.