Your country

Tools that support it use your country for local currency, number formats, units and paper size. Your choice is saved only in this browser.

Type a name or a two-letter code. Use the up and down arrow keys to move through the countries, Enter to choose one and Escape to close.

Ruby on Rails Module 5

Hotwire: Turbo, Stimulus and real-time interview questions

Interview questions on “Hotwire: Turbo, Stimulus and real-time”: warm-ups, then what each harder question tests and how a good answer starts.

16 questions: 5 warm-ups and 11 with model answers · Levels: Fresher to senior

Warm-up questions

Short questions with short answers, each answered in full.

  1. Fresher

    In a new Rails 8.1 app, which edits turn the generated PWA scaffold on, and how do you confirm it works?

    Make two changes. In config/routes.rb, remove the leading comment from the two PWA routes, so the router serves rails/pwa#manifest and rails/pwa#service_worker. In app/views/layouts/application.html.erb, change the manifest link from the ERB comment <%#= tag.link rel: "manifest" ... %> to real output with <%= ... %>, so every page points at the manifest. To confirm it, request the two URLs: /manifest.json should answer 200 application/json and parse as JSON with the app's name and display standalone, and /service-worker.js should answer 200 text/javascript. An integration test that asserts both statuses guards the switches against a later edit.

    From the lesson PWA files and Hotwire Native

  2. Fresher

    A form in a Rails app submits with Turbo. What status should the controller return on a successful save, and what on a validation error, and why those two?

    Answered in the lesson Turbo Drive and Turbo Frames

  3. Fresher

    What does respond_to with both format.turbo_stream and format.html give you that a stream-only action does not?

    It serves two kinds of client from one action. Turbo adds text/vnd.turbo-stream.html to the Accept header of a non-GET form submission, so format.turbo_stream answers Turbo clients with a surgical stream response, status 200. Every other client, a plain GET or link, a browser without JavaScript, or a fully native screen, never sends that header, so format.html answers them with the ordinary redirect, status 303 after a create. The feature therefore works before Turbo is loaded and gets faster once it is, the progressive-enhancement approach the handbook recommends. A stream-only action would leave those clients with a blank or broken response.

    From the lesson Turbo Streams and model broadcasts

  4. Fresher

    What does a Stimulus controller need to update a total when a quantity field changes?

    Answered in the lesson Stimulus controllers

  5. Fresher

    When would you write a custom Action Cable channel instead of relying on Turbo Streams broadcasts?

    Answered in the lesson Action Cable and Solid Cable

Questions with model answers

What each question tests, the first step of a good answer and the follow-ups to expect.

  1. Mid to senior

    A coaching centre wants its Rails app on the iOS and Android app stores soon, but the team writes Ruby and JavaScript and has no Swift or Kotlin developer. How would you use Hotwire Native, and what, if anything, would you build natively?

    What it tests
    Choosing a mobile approach from the team's skills: what Hotwire Native reuses, where native code is unavoidable, and the cost of each native screen.
    First step
    List what the app already has as web screens and mark which, if any, need a native control or a platform API; map the rest to Hotwire Native's web-content layer, which reuses the existing server HTML with no per-platform code.
    Follow-ups

    From the lesson PWA files and Hotwire Native

    Model answer, Pro. Model answers open with any pass; prices are in the notice on this page.

    Opening the model answers with your pass…

    Model answers open with any MySmartCoPilot pass.

    • Pro pass · 1 week₹79$2.99
    • 30 days₹179$5.99
    • 1 year₹1,699$45

    One payment; a pass never renews. The price shown is the total you pay: no fees or charges are added at checkout.

    It also opens every other in-depth part in Learn and every Pro tool. Sales are final, except where the law gives you a right to withdraw, for example in the EU and the UK (refund policy).

    In the answer:

    • Model answer
    • Follow-up answers
    • Common mistakes
    • Rubric
    • Variants
    • about 3 minutes
  2. Mid to senior

    You want new-student and edit forms to open as modals in your Hotwire Native app, and you want to change that later without an app-store release. Your Rails controllers run allow_browser versions: :modern. How do you set this up, and what could break?

    What it tests
    Setting up a path configuration you can change remotely, and spotting how a modern-only browser rule interacts with an app shell's web view.
    First step
    Write a path configuration with a rule whose patterns match the form URLs (for example /new$ and /edit$) and properties context modal, and serve it from Rails so it can change between releases.
    Follow-ups

    From the lesson PWA files and Hotwire Native

    Model answer, Pro.

    In the answer:

    • Model answer
    • Follow-up answers
    • Common mistakes
    • Rubric
    • Variants
    • about 4 minutes
  3. Fresher to mid

    An inline edit inside a Turbo Frame posts fine in the browser, but after a successful save the page does not update and after an invalid save the errors never show. The controller renders with status 200 both times. Explain what Turbo does with those responses and how you would fix the controller.

    What it tests
    Whether the candidate knows the statuses Turbo requires from non-GET requests and can connect each symptom to the wrong status code.
    First step
    Name what Turbo does with a 200 from a non-GET: it refuses to navigate to it and stays on the current URL. Then map each symptom to the status that would fix it, a 303 for the successful save and a 422 for the invalid one.
    Follow-ups

    From the lesson Turbo Drive and Turbo Frames

    Model answer, Pro.

    In the answer:

    • Model answer
    • Common mistakes
    • Rubric
    • Variants
    • about 2 minutes
  4. Mid to senior

    You ship inline editing with Turbo Frames: a row becomes a form and returns on save. A screen-reader user reports they cannot tell when a row changed, and a keyboard user loses their place. What is happening, and how do you make the feature accessible?

    What it tests
    Whether the candidate knows a frame swap announces nothing and moves focus only to an autofocus element, and can name focus management plus a polite live region as the fix.
    First step
    State what a frame swap does for assistive technology: Turbo toggles aria-busy and honours autofocus, but announces nothing. From there, the fix is to manage focus and announce the change yourself.
    Follow-ups

    From the lesson Turbo Drive and Turbo Frames

    Model answer, Pro.

    In the answer:

    • Model answer
    • Common mistakes
    • Rubric
    • Variants
    • about 3 minutes
  5. Fresher to mid

    A teacher marks a doubt answered from a list. One click should move the row to an "answered" list, drop the unanswered count and show a flash, and it must still work with JavaScript off. How do you build and verify this with Turbo Streams?

    What it tests
    Designing a multi-action Turbo Stream response, including a validation failure and an HTML fallback, and testing it without a browser.
    First step
    List the parts of the page that change (remove the row from one list, append it to another, update the count, show a flash) and write one turbo_stream action per part in the update template; keep a format.html redirect for clients without Turbo, and decide the status to return when the update fails.
    Follow-ups

    From the lesson Turbo Streams and model broadcasts

    Model answer, Pro.

    In the answer:

    • Model answer
    • Follow-up answers
    • Common mistakes
    • Rubric
    • Variants
    • about 4 minutes
  6. Mid to senior

    Doubts in a batch must reach that batch's members in real time, never students from other batches. Using broadcasts_to and turbo_stream_from, how do you deliver the updates, stop an outsider from subscribing, and prove the boundary holds?

    What it tests
    Broadcasting to a stream and authorising who may subscribe beyond the signed name, and testing that another batch receives nothing.
    First step
    Note that turbo_stream_from signs the stream name but turbo-rails' default channel streams to any verified name, so decide where permission is enforced: render the subscription only for members, or write a custom channel whose subscription_allowed? checks membership on the server before it streams.
    Follow-ups

    From the lesson Turbo Streams and model broadcasts

    Model answer, Pro.

    In the answer:

    • Model answer
    • Follow-up answers
    • Common mistakes
    • Rubric
    • Variants
    • about 4 minutes
  7. Fresher to mid

    A Stimulus controller adds a resize listener to the window in connect() to adjust a chart when the viewport changes. After Turbo replaces the page section, the chart is gone but resize events still log messages to the console. What went wrong, and how do you fix it?

    What it tests
    Understanding of the Stimulus lifecycle under Turbo: connect() and disconnect() are called on each insertion and removal, and global listeners survive the element unless explicitly removed.
    First step
    When Turbo replaces the section, Stimulus calls disconnect() on the old controller. If disconnect() does not remove the resize listener, that listener keeps firing. Store a reference to the bound handler in connect() and call window.removeEventListener in disconnect().
    Follow-ups

    From the lesson Stimulus controllers

    Model answer, Pro.

    In the answer:

    • Model answer
    • Common mistakes
    • Rubric
    • Variants
    • about 2 minutes
  8. Mid to senior

    A help page has 20 collapsible sections. The product manager wants them to open and close instantly, with ARIA state so screen readers announce the change. Would you use Turbo, Stimulus or CSS alone, and what accessibility requirements does each approach meet or miss?

    What it tests
    Choosing between Turbo, Stimulus and CSS for a disclosure pattern: latency, ARIA state management, and what each approach can or cannot do.
    First step
    CSS can toggle visibility with :target or a checkbox hack, but it cannot update aria-expanded. A Turbo Frame could load each panel from the server, but that puts a request behind every toggle. A Stimulus controller toggles the panel's hidden attribute and sets aria-expanded on the button, with no server round trip; check first whether the native details element is enough.
    Follow-ups

    From the lesson Stimulus controllers

    Model answer, Pro.

    In the answer:

    • Model answer
    • Common mistakes
    • Rubric
    • Variants
    • about 3 minutes
  9. Mid

    A student enrolment form lets the user add up to three guardian contacts. Each row has name, phone and relation fields. How would you implement adding and removing rows with Stimulus, and what Rails pattern on the server accepts the nested data?

    What it tests
    Building a nested form with Stimulus: cloning a template, wiring remove buttons, and coordinating with accepts_nested_attributes_for and fields_for on the server.
    First step
    Put the row markup inside a template element. The Stimulus controller clones the template, updates the index in the field names, and appends it to the container. Each row has a remove button that calls a remove action, which sets a _destroy hidden field to "1" or removes the row entirely if it is new. On the server, accepts_nested_attributes_for :guardians, allow_destroy: true handles the nested params.
    Follow-ups

    From the lesson Stimulus controllers

    Model answer, Pro.

    In the answer:

    • Model answer
    • Common mistakes
    • Rubric
    • Variants
    • about 3 minutes
  10. Fresher to mid

    A WebSocket connection opens to /cable but the signed session cookie is missing. What should ApplicationCable::Connection#connect do, and what happens to any channel subscriptions?

    What it tests
    Whether the candidate guards the socket in the connection with reject_unauthorized_connection and knows the socket is closed with a disconnect message before any channel subscribes.
    First step
    Name what the connection does with a missing or invalid cookie: call reject_unauthorized_connection, which sends a disconnect message (reason unauthorized, no reconnect) and closes the socket. From there, explain why no channel callback runs and what the browser does next.
    Follow-ups

    From the lesson Action Cable and Solid Cable

    Model answer, Pro.

    In the answer:

    • Model answer
    • Common mistakes
    • Rubric
    • Variants
    • about 2 minutes
  11. Mid to senior

    A Rails 8.1 app uses Solid Cable for Action Cable, expecting 5,000 concurrent subscribers at 100 messages per second. What signs show you need the Redis adapter, and what trade-offs does switching introduce?

    What it tests
    Whether the candidate names measurable signs (poll latency, database load, delivery delay) and the latency, persistence and operational trade-offs of Redis against Solid Cable.
    First step
    State how Solid Cable works: it polls the database about every 0.1 seconds. Then give measurable signs it is straining (poll latency nearing the interval, database CPU or I/O spikes, delivery delays) before weighing Redis.
    Follow-ups

    From the lesson Action Cable and Solid Cable

    Model answer, Pro.

    In the answer:

    • Model answer
    • Common mistakes
    • Rubric
    • Variants
    • about 3 minutes

All Ruby on Rails interview questions · The Ruby on Rails track

Quick answers and tool search

Type to search tools or to get a quick answer, for example 18% of 2500. Use the up and down arrow keys to move through the results, Enter to choose, and Escape to close.