
jdsutherland
Modern Front-End Development for Rails: B7 end ch 9 text doesn't mention required changes to pass props to Venue
I suspect you might be aware of this but here goes. If one follows the book, the end of ch 9 will result in errors from the useEffect
call in Venue: Started GET "/tickets.json?concert_id=undefined"
. The reader should be able to figure this out, but the required changes aren’t explicitly listed in the text:
wherever Venue is initiated: packs/venue_display.js didn’t work for me so I’m using packs/application.js (props no longer hard-coded and add concertId):
<Venue
rows={parseInt(element.dataset.rows, 10)}
seatsInRow={parseInt(element.dataset.seatsInRow, 10)}
concertId={parseInt(element.dataset.concertId, 10)}
/>
concerts/show.html.erb (add data attributes):
<div id="react-element"
data-rows="<%= @concert.venue.rows %>"
data-seats-in-row="<%= @concert.venue.seats_per_row %>"
data-concert-id="<%= @concert.id %>">
</div>
Edit: I just noticed there’s bit of a naming mismatch between seats_per_row (Rails) and seatsInRow (React). I figured I’d point that out to you if you weren’t aware.
First Post!

noelrappin
The venue_display.js issue I know about and will be clearer about the solution in the text on final pass.
I probably should clear the naming as well, it sounds like the other problem is just that I missed describing a change in the text?
Popular Pragmatic Bookshelf topics







Modern Front-End Development for Rails - application does not start after run bin/setup (page xviii)

Modern front-end development for Rails, second edition - Struggling to get the first chapter to work


Other popular topics








Latest in Modern Front-End Development for Rails
Categories:
Sub Categories:
Popular Portals
- /elixir
- /rust
- /wasm
- /ruby
- /erlang
- /phoenix
- /keyboards
- /rails
- /js
- /python
- /security
- /go
- /swift
- /vim
- /clojure
- /java
- /haskell
- /emacs
- /svelte
- /onivim
- /typescript
- /crystal
- /c-plus-plus
- /tailwind
- /kotlin
- /gleam
- /react
- /flutter
- /elm
- /ocaml
- /vscode
- /opensuse
- /ash
- /centos
- /php
- /deepseek
- /html
- /scala
- /zig
- /debian
- /nixos
- /lisp
- /agda
- /textmate
- /sublime-text
- /react-native
- /kubuntu
- /arch-linux
- /ubuntu
- /revery
- /manjaro
- /spring
- /django
- /diversity
- /nodejs
- /lua
- /c
- /julia
- /slackware
- /neovim