|
| 1 | +# Inertia.js Rails Adapter |
| 2 | + |
| 3 | +To use [Inertia.js](https://github.com/inertiajs/inertia) you need both a server-side adapter (like this one) as well as a client-side adapter, such as [inertia-react](https://github.com/inertiajs/inertia-react). Be sure to also follow the installation instructions for the client-side adapter you choose. This documentation will only cover the Rails adapter setup. |
| 4 | + |
| 5 | + |
| 6 | +## Installation |
| 7 | + |
| 8 | +Add this line to your application's Gemfile: |
| 9 | + |
| 10 | +```ruby |
| 11 | +gem 'inertia-rails' |
| 12 | +``` |
| 13 | + |
| 14 | +And then execute: |
| 15 | + |
| 16 | + $ bundle |
| 17 | + |
| 18 | +Or install it yourself as: |
| 19 | + |
| 20 | + $ gem install inertia-rails |
| 21 | + |
| 22 | +## Usage |
| 23 | + |
| 24 | +## Layouts |
| 25 | +Inertia Rails automatically uses your default application layout. If you'd like to change that, you can do so via the Inertia config |
| 26 | + |
| 27 | +~~~ruby |
| 28 | +Inertia.configure do |config| |
| 29 | + config.layout = 'inertia' # uses layouts/inertia.html.erb |
| 30 | +end |
| 31 | +~~~ |
| 32 | + |
| 33 | +## Making Inertia responses |
| 34 | + |
| 35 | +To make an Inertia response, use the inertia renderer. This renderer takes the component name, and allows you to pass props and view_data as an options hash. |
| 36 | + |
| 37 | +~~~ruby |
| 38 | +class EventsController < ApplicationController |
| 39 | + def index |
| 40 | + render inertia: 'Events', |
| 41 | + props: { |
| 42 | + events: Event.all |
| 43 | + } |
| 44 | + end |
| 45 | +end |
| 46 | +~~~ |
| 47 | + |
| 48 | +## Following redirects |
| 49 | + |
| 50 | +When making a non-GET Inertia request, via `<inertia-link>` or manually, be sure to still respond with a proper Inertia response. For example, if you're creating a new user, have your "store" endpoint return a redirect back to a standard GET endpoint, such as your user index page. Inertia will automatically follow this redirect and update the page accordingly. Here's a simplified example. |
| 51 | + |
| 52 | +~~~ruby |
| 53 | +class UsersController < ApplicationController |
| 54 | + def index |
| 55 | + render inertia: 'Users/Index', props: {users: User.all} |
| 56 | + end |
| 57 | + |
| 58 | + def store |
| 59 | + User.create params.require(:user).permit(:name, :email) |
| 60 | + |
| 61 | + redirect_to users_path |
| 62 | + end |
| 63 | +end |
| 64 | +~~~ |
| 65 | + |
| 66 | +Note, when redirecting after a `PUT`, `PATCH` or `DELETE` request you must use a `303` response code, otherwise the subsequent request will not be treated as a `GET` request. A `303` redirect is the same as a `302` except that the follow-up request is explicitly changed to a `GET` request. |
| 67 | + |
| 68 | +## Sharing data |
| 69 | + |
| 70 | +To share data with all your components, use the controller method `inertia_share`. This can be done both synchronously and lazily. |
| 71 | + |
| 72 | +~~~ruby |
| 73 | +# Synchronously |
| 74 | +inertia_share app_name: env['app.name'] |
| 75 | + |
| 76 | +# Lazily |
| 77 | +inertia_share do |
| 78 | + if logged_in? |
| 79 | + { |
| 80 | + 'auth.user' => {id: logged_in_user.id} |
| 81 | + } |
| 82 | + end |
| 83 | +end |
| 84 | + |
| 85 | +# OR |
| 86 | +inertia_share user_count: lambda { User.count } |
| 87 | +~~~ |
| 88 | + |
| 89 | +## Accessing data in root template |
| 90 | + |
| 91 | +There are situations where you may want to access your prop data in your root Blade template. For example, you may want to add a meta description tag, Twitter card meta tags, or Facebook Open Graph meta tags. These props are available via the `page` variable. |
| 92 | + |
| 93 | +~~~erb |
| 94 | +<meta name="twitter:title" content="<%= page['props']['event'].title %>"> |
| 95 | +~~~ |
| 96 | + |
| 97 | +Sometimes you may even want to provide data that will not be sent to your JavaScript component. You can do this using the `view_data` option. |
| 98 | + |
| 99 | +~~~ruby |
| 100 | +render inertia: 'Event', props: {event: event}, view_data: {meta: event.meta} |
| 101 | +~~~ |
| 102 | + |
| 103 | +You can then access this variable like a regular erb variable. |
| 104 | + |
| 105 | +~~~erb |
| 106 | +<meta name="description" content="<%= meta %>"> |
| 107 | +~~~ |
| 108 | + |
| 109 | +## Asset versioning |
| 110 | + |
| 111 | +One common challenge with single-page apps is refreshing site assets when they've been changed. Inertia makes this easy by optionally tracking the current version of your site assets. In the event that an asset changes, Inertia will automatically make a hard page visit instead of a normal ajax visit on the next request. |
| 112 | + |
| 113 | +To enable automatic asset refreshing, first set up the Inertia config with your current asset version. We recommend putting this in an initializer. |
| 114 | + |
| 115 | +~~~ruby |
| 116 | +Inertia.configure do |config| |
| 117 | + config.version = '1.0' |
| 118 | +end |
| 119 | +~~~ |
| 120 | + |
| 121 | +You can also use lazy evaluation. |
| 122 | + |
| 123 | +~~~ruby |
| 124 | +Inertia.configure do |config| |
| 125 | + config.version = lambda { Version.last } |
| 126 | +end |
| 127 | +~~~ |
| 128 | + |
| 129 | + |
| 130 | +## Development |
| 131 | + |
| 132 | +After checking out the repo, run `bin/setup` to install dependencies. Then, run `rake spec` to run the tests. You can also run `bin/console` for an interactive prompt that will allow you to experiment. |
| 133 | + |
| 134 | +To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org). |
| 135 | + |
| 136 | +## Contributing |
| 137 | + |
| 138 | +Bug reports and pull requests are welcome on GitHub at https://github.com/[USERNAME]/inertia-rails. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org) code of conduct. |
| 139 | + |
| 140 | +## License |
| 141 | + |
| 142 | +The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT). |
| 143 | + |
| 144 | +## Code of Conduct |
| 145 | + |
| 146 | +Everyone interacting in the Inertia::Rails project’s codebases, issue trackers, chat rooms and mailing lists is expected to follow the [code of conduct](https://github.com/[USERNAME]/inertia-rails/blob/master/CODE_OF_CONDUCT.md). |
| 147 | + |
| 148 | + |
0 commit comments