Hotwire を 本番環境で使ってみた感想2022年のRailsの開発現場事情について語ろう！ Qiita Night https://increments.connpass.com/event/241385/
Hotwireのススメ ~React製SPAをフルSSRでStimulusとTurboに書き換えた話~
はじめに 私はフリーランスのプログラマで、普段はwebサイト・webアプリを中心に開発を請け負っています。 私のチームでは、CMSを利用した静的webサイトを制作する場合はNext.jsとvercelなどのPaasを推奨しており、webアプリの制作ではNode.jsまたはPHPでサーバー構築することが多いです。 今回はその中の主にクライアントサイド（フロントエンド）とサーバーサイド（バックエンド）のSPAにまつわる争いを止める（？）内容です。 例によって長いので、時間がない方はブラウザバックを。。。 Hotwireとは サーバーサイドの設定を不要とする、HTML主体のSPAライクな環境を構築するためのJavascriptセットです。 Railsプログラマには馴染み深いturbolinksを起源に持ち、そこに新しいライブラリを追加してリニューアルしたプロジェクトがHotwireとなりました。
stimulus、「data-〇〇＝」の名称ルールについての個人メモ - Qiita
キャラメルケースとかスネークケースとか、命名規則には数種類あるが、stimulusで使うべきはどれなんだろう、と考えて調査してみた結果の纏めです（ 書いたきっかけ 前回を書いている途中、html側の記述として 【data-controller = "test_test"】 などと書いたところ、動かなかった。 一方でstimulusハンドブックの第五章では html側記述→【data-controller="content-loader"】 stimulusのファイル名→【src/controllers/content_loader_controller.js】 となっている。 そこんところ、どうなってるんだろう？ と思って調べてみた。 ……もしかしたらハンドブックのどこかには書いてあるのかもしれないが、英文を読む気力がなかった（のでこれは、あくまで自分が調べた動作結果。もしちゃんとしたルー
Stimulus 2.0 を試してみた
はじめに 2020/12/5 に Stimulus 2.0 がリリースされました 🎉 Stimulus 2.0 リリースノート 以前 Rails アプリで JavaScript を書くときに少しだけ使ったことがあり便利だったので、2.0 も試してみました。 前提 $ ruby -v ruby 3.0.0p0 (2020-12-25 revision 95aff21468) [x86_64-darwin19] $ bin/rails -v Rails 6.1.1 今回はテキストエリアの文字数をカウントする処理を Stimulus で実装してみようと思います。 Rails Girls アプリ・チュートリアル でつくるアイデア投稿アプリをベースにして、アイデアの Description 項目に処理を入れていきます。 参考: How to use Stimulus JS 2.0's new Va
Stimulus – 受託Web屋に「ちょうどいい」JavaScriptフレームワーク
ネコメシでは週に１回、持ち回り制で勉強会を開催しています。各々が気になっているトピックについてスライドを作って、30分～1時間くらいの発表を行います。 先日の勉強会にて、JavaScriptフレームワークのStimulusについて発表したので、その内容を公開します。 Stimulusは控えめなフレームワークで、非SPAのウェブサイト制作（コーポレートサイト、キャンペーンサイト等）において非常に強力なツールだと思います。jQueryをメインに使っている制作者や、オブジェクト指向的にコードを書こうとしているけどいまいちコレといった腹落ちができていない人には、特におすすめできるものです。 Stimulus 受託Web屋に「ちょうどいい」JavaScriptフレームワーク 今日はStimulusというJSフレームワークを紹介します。 多分に実装の話題なので、デザイナーさんたちにはちょっとわからない
Stimulus、悪くない
Stimulus: A modest JavaScript framework for the HTML you already have. 2020年末にリリースされた Stimulus 2.0 を試して気づいたことをメモしておく。Stimulus は Rails で有名な Basecamp のメンバーによって開発された生 DOM をベースに、できるだけ template に JS を書かずに動的な DOM の生成、変更を実現するためのライブラリである。 昨今流行りの React, Vue, Angular などの VirtualDOM 系のツールとは根本的に考え方が異なり、今からこれを採用するのはやや申し訳ないというか、正直に言うとよいイメージはなかったし、例えばフロントエンドエンジニアとしてスキルアップしたいぜーという人には合わないと思うが、ただ、どうせサーバサイドの開発が必要で、分
第三の答え、Stimulusjs - Qiita
昨今のフロントエンドトレンドを鑑みてフロントエンドの技術構成を考えると今はどんな選択肢が主流でしょう？ それぞれ並列なものではないですが、React? Vue? Next? Nuxt?そんなワードがきっと頭に浮かぶでしょう。 今の時代、jQueryでゴリゴリUIを記述するとなんだか白い目でみられる。 そう、令和とはそういう時代です。 界隈の最先端おじさんをみると、build processがあるのは当然で、HTML/CSSはjsが吐き出すもので、それが最大限正しいように語られています。 確かにExising Domのアプローチで界隈から評価されてるライブラリはなく、さほどいい選択肢には見えません。(個人の主観) ではそれらのアプローチの何がそんなにいいんでしょう？ 過去から現在まで我々は何に苦心して、それらはそれをどう解決してくれたのでしょう？ 雑に紐解いていきましょう。(今回はUI構築の
HTML Centricで行きたい私たち - LIFULL Creators Blog
LIFULLの中島です。 近頃、LIFULL HOME'Sのフロントエンド(ここではJavaScriptのみを焦点とします)もようやく進む道を見出し、そろそろ設計方針を一新しようと試みています。 今回はそれについて話したいと思います。 現在の私たちの課題感 私たちの管理する多くのレガシーコードはDOM操作ライブラリとしてjQueryを、UI設計の格子としてBackbone.Viewのような設計方式を導入しています。 (もちろんそうでないマイクロサービスも多くありますが) 具体的なコード例を示すことこんな感じになります let Slider = Backbone.View({ events: { '.next click': 'next', '.prev click': 'prev' }, next() { this.$(...).css({left: '111px'}); }, ... }
SPAじゃないプロジェクトのための控えめなJavaScriptフレームワーク「Stimulus」 - yuhei blog
ReactやAngularのように、アプリ内のすべてのHTMLをJavaScript側で管理して描画するアプローチは大げさすぎる。ほとんどの場合において。 もちろん一定以上の複雑さがあればその辺のJavaScriptフレームワークを使った方が良い。が、それがやり過ぎになるプロジェクトは多い。というかその方が多い。それでも、それらのアプローチではやり過ぎになってしまう場合でも、秩序のあるコードを書き続けられないと当然苦しい状態へ向かう。 この微妙な（そして多数派であるはずの）環境を適度に管理できる枠組みが必要だ。これまでちょうどいい解決策を見つけられずに苦労してきた。Web Componentsは課題を解決するかもしれないがまだ来ない。そこで出会ったのがStimulusだ。 いわく、Stimulusは既存のHTMLのための控えめなJavaScriptフレームワーク。サーバーサイドレンダリング
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
