Rails初心者がSPAアプリを作ってみた話

Rails初心者がSPAアプリを作ってみた話長野Rubyの会 #2 2019.7.20 於 GEEKLAB.NAGANO

自己紹介 • にしざわこういち • プログラマー • @koty • 元ギークラ某長野管理人見習い
• 最近転職しました

プログラミング言語歴 VisualBasic.NET ・・・10年 C# ・・・10年 Java ・・・3年 Python ・・・4年 TypeScript
・・・1年 Ruby ・・・1ヶ月

前回発表内容

今日の発表内容勉強がてら作ってみているアプリの話 https://glide-well.b-sw.co/#/workouts/ 発表することで教えてもらうスタイル

アプリでできること • 水泳の練習メニューの記録 • 練習内容のslackへの投稿 ◦ 現状は、整形したメッセージをクリップボードに入れるだけ • 俺得アプリ

SPAで作った • このご時世、サーバーサイドのWebフレームワークのみでシステムを作れることはまずない • 特にFormはSPAで作るほうが楽。配列の扱いとか • 認証を通せるようにしたら自分で使う予定

システム構成 CloudFrontでルーティングブラウザ CloudFront heroku S3 index.html /api/* Rails vue.js
https://github.com/koty/glide-well-front https://github.com/koty/glide-well-api Railsだと何も考えずに herokuにpushするだけで動く。すごい。。。

webpacker • webpackをrailsで包んだものらしい • 最初使いかけたが挫折 • frontとapiを分けることにした

front - api でアプリを分ける長所 • webpackerを覚える必要がない • vue.jsのノウハウをそのまま使える • アプリケーションサーバーが静的ファイルを扱わなくて良い
◦ アプリケーションサーバーの負荷がちょっと減る

front - api でアプリを分ける短所 • ソース管理が煩雑 • コミットがまとまらない • ローカルでのデバッグが面倒

ActiveModelSerializers モデルのオブジェクトをJSONにしてくれるgem ネストしたJSONをpostして更新するきれいな方法がよく分からなかった w = params.permit(:id, :date, :kind, :impression) if
@workout.update(w) update_details(@workout.id) def update_details(workout_id) WorkoutDetail.where(workout_id: workout_id).delete_all p = params.permit(:id, :date, :kind, :impression, workout_details: [:id, :menu_kind, :times, :distance, details = p[:workout_details] details.each do |detail| rec = WorkoutDetail.new(detail) rec.workout_id = workout_id rec.save end

おしまい Railsを教えられるようにがんばります

Rails初心者がSPAアプリを作ってみた話

Rails初心者がSPAアプリを作ってみた話

Kouichi(19)

More Decks by Kouichi(19)

Other Decks in Technology

Featured

Transcript