RailsのSPA構成のサンプルを作りました。OSSで公開しNuxtjsの環境構築でハマっている人のためになればと思いこの記事を記載しました。この内容は、勉強会でもLTした内容です。ご興味がある方は御覧ください。今後も時間が有るときにコミットしていきます。このOSSの方針としては、どのサービスで必ず使用するであろう機能を今後も追加していく予定です。その一つとして認証機能はどんなサービスでも必要になってくると考えたので、既に実装してあります。今後はGoogle認証などのOauth認証系も追加予定です。環境Dockerがインストールされていればどんな環境でもサンプルを動作させることができると思います。NuxtjsとRailsのリポジトリは分けています。コマンドを打つだけです。アクセスしてください。以下のようにログイン画面が出てくるので、[ID/Password](https://github.com/walkersumida/rails-api-for-nuxtjs#demo-user)を入力してログインしてみてください。アクセスしてください。以下のようにログイン画面が出てくるので、[ID/Password](https://github.com/walkersumida/rails-api-for-nuxtjs#demo-user)を入力してログインしてみてください。ログイン後-ログイン後は、Postというオブジェクトの一覧ページに遷移します。このページは、ログインしていないと参照できないページとなっています。現在は、Postオブジェクトの追加と削除する機能があるので、試しに追加/削除を行ってみてください。このページは、ログインしていないと参照できないページとなっています。現在は、Postオブジェクトの追加と削除する機能があるので、試しに追加/削除を行ってみてください。gem](https://github.com/lynndylanhurley/devise_token_auth)を使って認証を実装しています。Token-base認証という仕組みを使っています。apiサーバーからのレスポンスに使い捨てのトークンが送られてきます。そのトークンを次のapiサーバーリクエスト時にセットしapiサーバー側でトークンを検証し検証が成功すると、認証が成功したとみなしレスポンスを返してきます。詳しくは、devise_token_authのDocsに詳しく書いてあるので参照してみてください。Vuetifyjsこれは、マテリアルデザインの便利なコンポーネントライブラリです。通りに書くとリッチなコンポーネントを簡単に配置できるのでとても便利です。実行するとJestが起動し、テストが実行されます。成功することを確認してみてください。実行するとRspecが起動し、テストが実行されます。成功することを確認してみてください。CINuxtjsとRailsのサンプルはCircleCIと連携しているので、Pushする毎にTestが実行されるようになっています。まとめ動作しましたでしょうか。冒頭にも記載しましたが今後もどんどんコミットしていく予定でいるので、starをいただけるとやる気が出ます。あとはデバックしたり、実際に機能を追加したりして遊んでいただき、NuxtjsとRailsを楽しんでいただければ嬉しいです。apiサーバーを利用して、[Flutterのリポジトリ](https://github.com/walkersumida/flutter_sample)も立てコミットし始めました。こりらも認証周りは大体出来上がっているので、こちらも興味がある方は是非、starをお願いします笑Flutterの件も、今後Qiitaにまとめていく予定ですのでお待ちいただければと思います。