Kaigi on Rails 2024 のトーク資料です。Hotwireを活用するための指針をStimulusの側から整理しています。
タグ検索の該当結果が少ないため、タイトル検索結果を表示しています。
Hotwire光の道とStimulus
Kaigi on Rails 2024 のトーク資料です。Hotwireを活用するための指針をStimulusの側から整理しています。
はじめに 私はフリーランスのプログラマで、普段はwebサイト・webアプリを中心に開発を請け負っています。 私のチームでは、CMSを利用した静的webサイトを制作する場合はNext.jsとvercelなどのPaasを推奨しており、webアプリの制作ではNode.jsまたはPHPでサーバー構築することが多いです。 今回はその中の主にクライアントサイド（フロントエンド）とサーバーサイド（バックエンド）のSPAにまつわる争いを止める（？）内容です。 例によって長いので、時間がない方はブラウザバックを。。。 Hotwireとは サーバーサイドの設定を不要とする、HTML主体のSPAライクな環境を構築するためのJavascriptセットです。 Railsプログラマには馴染み深いturbolinksを起源に持ち、そこに新しいライブラリを追加してリニューアルしたプロジェクトがHotwireとなりました。
September 24, 2021 Stimulus 3 + Turbo 7 = Hotwire 1.0 For so long, it felt like I could only tell half the story of how we make software for the web at Basecamp. Too many of the chapters about our front-end approach were missing key pages. Sure, we had some of it out there. Turbolinks, for example, hark back to 2012, when I was inspired by Chris Wanstrath's ideas in pjax, and took them further. An
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 系のツールとは根本的に考え方が異なり、今からこれを採用するのはやや申し訳ないというか、正直に言うとよいイメージはなかったし、例えばフロントエンドエンジニアとしてスキルアップしたいぜーという人には合わないと思うが、ただ、どうせサーバサイドの開発が必要で、分
Willy OES 🌒 on Twitter: "米国はもうベーシックインカム導入寸前の所まで追い込まれてる。Child Tax Creditは1年間の時限措置だが事実上子育て世帯向けのBIだし、もしStimulus checkで経済が上手く回れば何らかの形で恒久化しろという話が民主党左派から出るだろう。"
米国はもうベーシックインカム導入寸前の所まで追い込まれてる。Child Tax Creditは1年間の時限措置だが事実上子育て世帯向けのBIだし、もしStimulus checkで経済が上手く回れば何らかの形で恒久化しろという話が民主党左派から出るだろう。
DHH on Twitter: "The HEY stack: - Vanilla Ruby on Rails on the backend, running on edge - Stimulus, Turbolinks, Trix + NEW MAGIC on… https://t.co/Kr8eGanpd0"
The HEY stack: - Vanilla Ruby on Rails on the backend, running on edge - Stimulus, Turbolinks, Trix + NEW MAGIC on… https://t.co/Kr8eGanpd0
Turbolinksアレルギー患者に捧げるTurbo & Stimulusでの時短実装術 / Kaigi on Rails 2023
"Turbolinksアレルギー患者に捧げるTurbo & Stimulusでの時短実装術" Kaigi on Rails 2023での登壇資料です。 https://kaigionrails.org/2023/talks/lni_T/ Turbolinksはどうしてもトラブルが多発するライブラリでしたが、 現代のHotwireはむしろ高速に開発することができるという例を紹介しています。 はてなブックマークする↓ https://b.hatena.ne.jp/entry?url=https://speakerdeck.com/lnit/kowakunai-hotwire-kaigi-on-rails-2023
週刊Railsウォッチ（20201005前編）Ruby 2.7.2がリリース、Shopifyのモジュラー化gem「packwerk」、stimulus_reflexほか｜TechRacho by BPS株式会社
2020.10.05 週刊Railsウォッチ（20201005前編）Ruby 2.7.2がリリース、Shopifyのモジュラー化gem「packwerk」、stimulus_reflexほか こんにちは、hachi8833です。皆さまもKaigi on Rails STAY HOME Editionをエンジョイされましたでしょうか。スポンサーおよび関係者の皆さまありがとうございました&お疲れさまでした！🙇 アーカイブ動画も今後順次配信されるようです！ありがとうございます🙇。 先行して @toshimaru_e さんの動画をアップしました！他のセッションも順次公開していきますのでお楽しみに！ #kaigionrailshttps://t.co/duhoF1Xu1S https://t.co/y3PRYVRlO8 — Kaigi on Rails (@kaigionrails) Octob
Stimulus 3
The third major release of Stimulus represents a big milestone for the Hotwire community. This is the first release where every substantial new feature came as a contribution from outside of Basecamp and HEY. We've got a new package, action parameters, default values, target lifecycle callbacks, debug mode, utility-CSS support, and Controller.shouldLoad. Let's dig into what's new! New Package Firs
「JavaScript sprinkles in Basecamp turned Stimulus」より。Stimulusの設計意図を理解できる貴重な資料なのでまとめた。 DHHにとってプログレッシブエンハンスメントとは、コンテンツのプログレッシブ性を実現するためというよりは、アプリケーション開発のための道標のようなもの。ベースとしてのHTMLはまずサーバーに生成させて、動的部分としての少しの差分をJavaScriptに扱わせる。BasecampやGitHubのように動的部分の少ないアプリケーションにとってはそれが適切なやり方。React/ReduxやAngular、そのほかクライアントサイドのMVCフレームワーク等を試してきたが、それによってプロダクトのコードが良くなることはなかった。 BasecampにあるJavaScriptを調査して、どのような慣習があるか、それを踏まえてどのような
Stimulusをはじめよう - Qiita
Stimulusとは何か Stimulusとは、JavaScriptで書かれたクライアントサイドのライブラリです。 Basecampによって開発され、2021/12にversion2がリリースされました。 皆さんの知るところでいうとstack overflowが採用していたりします。 StimulusはHTMLを中心に考え、JavaScirptで書かれた振る舞いをHTMLから呼び出すことができるように設計されています。 それはonClickでJavaScriptコードを呼び出していた太古のコードに少し似ています。 さぁ、私と共にWeb開発を再発見しましょう！ 基本原理 StimulusはHTMLに書かれた振る舞いを与えます。 それは最初にレンダリングされたHTMLだけでのことではなく、後から挿入されたHTMLに対しても同じです。 StimulusはMutationObserverを利用して
Stimulus Components Stimulus Components is an open-source set of StimulusJS controllers to solve common patterns. Stimulus JS is a modest yet powerful JavaScript framework that augments your HTML with just enough behavior to make it shine. We all share common behaviors between our applications and no one want to reinvent the wheel. That is why the Stimulus Components library exists. To bring you g
Rails 7: importmap-railsとjsbundling-railsでのStimulusの扱いの違い｜TechRacho by BPS株式会社
2022.03.04 Rails 7: importmap-railsとjsbundling-railsでのStimulusの扱いの違い Rails 7でStimulusを書き始めています。Rails 7でimportmap-railsを使うかjsbundling-railsを使うかでStimulusのセットアップが少し違うことに今頃気づいたので、小ネタですがメモします。 ローカルのStimulusコントローラファイル ここでは、ローカルのapp/javascripts/controllers/以下のStimulusコントローラファイルの扱いについて書きます。 1. importmap-railsの場合 importmap-railsを使う場合は、app/javascripts/controllers/index.jsが以下のようにeagerLoadControllersFrom()を呼び
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 系のツールとは根本的に考え方が異なり、今からこれを採用するのはやや申し訳ないというか、正直に言うとよいイメージはなかったし、例えばフロントエンドエンジニアとしてスキルアップしたいぜーという人には合わないと思うが、ただ、どうせサーバサイドの開発が必要で、分
CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。
最近読んだ論文"Guiding Large Language Models via Directional Stimulus Prompting"についてまとめてみます。 - CCCMKホールディングス TECH Labの Tech Blog
こんにちは、CCCMKホールディングス TECH LABの三浦です。最近は暖かくなってきました。寒い冬に比べると雨が降る日が多くなりましたが、晴れた日は外を歩くととても気持ちがいいです。あっという間に雨の季節が来て外を歩くと汗びっしょりになる夏になってしまうので、それまでに今のちょうどいい気候を楽しんでおこうと思います。 最近はLarge Language Model(LLM)に関する情報を色々と調べています。LLMの情報を調べていると、これからこのLLMとどう付き合っていくのがいいんだろう、考えてしまいます。そんな中、最近読んだ論文で提案されているLLMへのアプローチがこれまでのPrompt Engineeringのものとは少し違い、とても興味深く感じました。今回はこの論文を読んだ内容についてまとめ、感じたことを書きたいと思います。 LLMを使ってみて感じていること LLM、主にGPT-
Help us understand the problem. What is going on with this article?
Announcing Stimulus 2.0
Today we’re very excited to announce the release of Stimulus 2.0. This version introduces two new APIs, values and CSS classes, which replace the data map API from Stimulus 1.0. You can read more about these APIs in the reference documentation: https://stimulusjs.org/reference/values https://stimulusjs.org/reference/css-classes We’ve also updated the Handbook to cover the changes in 2.0. Here’s th
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 v3.2.2がリリースされました。 パッチバージョンではありますが、内容がパッチバージョンとは言えないものが多いので一応拾っておこうと思います。 機能の追加・変更 keyboard event filterにPageUp/PageDownが追加された Stimulusにはもともとキーボードイベントのフィルタリング機構があります。 下記のようにアクション記述のイベント名を書くところのキーボードイベント(keydown,keyup,keypress)にドットで続けてキー名を書けば、対象のキーが押された時だけ実行されるアクションとして定義することができる機能です。 そこにPageUp、PageDownのキーをデフォルトで指定できるようになりました 構文中ではpage_up, page_downという名前で指定するようです。 キーボード操作を実現する際、PageUp
Better Stimulusガイド:アーキテクチャ1: アプリケーションコントローラ（翻訳）｜TechRacho by BPS株式会社
Good // application_controller.js import { Controller } from "stimulus"; export default class extends Controller { sayHi () { console.log("Hello from the Application controller."); } } // custom_controller.js import ApplicationController from "./application_controller"; export default class extends ApplicationController { sayHi () { super.sayHi(); console.log("Hello from a Custom controller"); } }
Rails: TurboだけでStimulusやJSを書かずに無限オートスクロールする（翻訳）｜TechRacho by BPS株式会社
概要 元サイトの許諾を得て翻訳・公開いたします。 英語記事: Infinite Auto Scroll using Turbo only ( No Stimulus / No Javascript ) | Saeloun Blog 原文公開日: 2022/08/10 原著者: Manmeet Singh サイト: Saeloun Blog 本記事では、Rails 7アプリケーションを作成して無限オートスクロールを実装します。この機能はHotwireのTurboだけで実現されており、JavaScriptコードは1行も書く必要がありません。 このアプリはデフォルトで10件の投稿を表示します。ページ末尾に到達すると、投稿がなくなるまで10件ずつ投稿を追加表示します。 Rails 7アプリケーションを作成する 最初にRails 7アプリケーションを作成します。 rails _7.0.3_ new
Railsの技: カスタムヘルパーとStimulusで軽量コンポーネントを構築（翻訳）｜TechRacho by BPS株式会社
概要 原著者の許諾を得て翻訳・公開いたします。 英語記事: Building lightweight components with Rails Helpers and Stimulus | Boring Rails: Skip the bullshit and ship fast 原文公開日: 2021/04/21 著者: Matt Swanson サイト: Boring Rails 日本語タイトルは内容に即したものにしました。 Railsのカスタムヘルパーのよさは見落とされがちですが、軽量コンポーネントのビルドや、Stimulusコントローラの定形コードを削減するときの最適なオプションにもなります。 Stiumulusの良い点は、マークアップの属性を見るだけで即座に機能を推測できることです。しかし、値やアクションを複数持つコンポーネントの場合は実装の詳細の一部を隠蔽することにメリットが
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
Better Stimulusガイド 08: Rails-ujs（翻訳）｜TechRacho by BPS株式会社
概要 原著者の許諾を得て翻訳・公開いたします。 英語記事: Submit a Form Programmatically - Better StimulusJS 原文更新日: 2022/01/29 原著者: Julian Rubisch -- Stimulus Reflexのコアメンバーです サイト: Home - Better StimulusJS フォームをプログラムで送信する <div data-controller="remote-form"> <%= form_with(model: @article, html: { data: { action: "ajax:success->remote-form#onPostSuccess" } }) do |f| %> <%= select_tag "author", options_from_collection_for_select
Stimulusの習作: Rails.fireのかわりにRails.ajaxまたはfetchで送信｜usutani
内容Stimulusの習作: ドラッグ・アンド・ドロップ（クライアント側） Stimulusの習作: ドラッグ・アンド・ドロップ（サーバ側） 上記では隠しフォームとRails.fireを用いてBook ID群をクライアントからサーバへ送信しました。今回はつくりを変更してRails.ajaxまたはFetch APIを用いて送信したいと思います。 参照CSRF保護 2020/04/19 Rails セキュリティガイド - Railsガイド 2017/10/23 RailsのCSRF保護を詳しく調べてみた（翻訳）｜TechRacho（テックラッチョ）〜エンジニアの「？」を「！」に〜｜BPS株式会社 Rails.ajax 2019/10/18 ajax · rails-jquery-ujs Wiki 2020/04/19 rails-ajax.coffee at v6.0.2.2 · rails-
(この記事はあくまで私の主観です。) Stimulusの公式ドキュメントはそれなりに充実しています。 しかし今のところStimulusの起源(origin)や挙動(reference)に関する記述がありますが設計についての実践的なところはあまり記述されていません。 あなたが次に読む最適なものは何でしょう？ 信頼できるのは作者だけ いろんなリソースにたどり着くかもしれません。 Better StimulusJS? Hotwire Discussion? Qiita? しかし私が本当におすすめしたいのは、作者である37signals(旧Basecamp社)がどのようにこのStimulusを使ってるかを観察することです。 37signalsはBasecampというプロジェクトマネジメントツールやheyと呼ばれるメールサービスをリリースしています。 そしてそれらのプロダクトはStimulusで動い
GitHub - cmer/ultimate_turbo_modal-rails: The ultimate Turbo / Stimulus / Hotwire modal window for Rails
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
Spring BootによるAPIバックエンド構築実践ガイド 第2版 何千人もの開発者が、InfoQのミニブック「Practical Guide to Building an API Back End with Spring Boot」から、Spring Bootを使ったREST API構築の基礎を学んだ。この本では、出版時に新しくリリースされたバージョンである Spring Boot 2 を使用している。しかし、Spring Boot3が最近リリースされ、重要な変...
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Hotwireのススメ ~React製SPAをフルSSRでStimulusとTurboに書き換えた話~
Stimulus 3 + Turbo 7 = Hotwire 1.0
「JavaScript sprinkles in Basecamp turned Stimulus」の雑要約
Stimulus Components
「既存のHTMLのための」JavaScriptフレームワーク「Stimulus 3」がリリース
Stimulus.js ささやかな野心を持つJavaScriptフレームワーク - Qiita
Stimulus v3.2.2で追加された機能・変更された振る舞い - Qiita
Stimulus components
Stimulus 公式ハンドブックの次に読むものは? - Qiita
Stimulus 「すでにあるHTMLのためのJavaScriptフレームワーク」 リリース2.0
kigyouhoumu.hatenadiary.com
magmix.jp
kobe-journal.com
www.itmedia.co.jp
maidonanews.jp
trivia-and-know-how-notes.com