読者です 読者をやめる 読者になる 読者になる

Rails Webook

自社のECを開発している会社で働いています。Rails情報やサービスを成長させる方法を書いていきます

Javascript

RailsでReact.jsをサーバーレンダリングする

react-railsを使いReact.jsをサーバーレンダリングする方法を説明します。サーバーレンダリングすることで、初期値をHTMLの初期レンダー時に渡せるようになるので、ロード中による画面のばたつきや、ロード中といった表示をなくせます。

RailsでReactを使ってメッセージボックスアプリを作成

Railsに簡単にReact.jsを統合できるreact-raisというgemを使い、RailsでReact.jsを使う方法を説明します。

フォーム画面でページから離れるときにJavascript(JS)の警告を出す

上記のように、フォーム画面でページから離れるときにJavascript(JS)の警告を出す方法を説明します。実際の動作は次のリンクから確認できます。 ページを離れる時に警告を出す - jsfiddle

jQueryによるDOM操作をまとめてみた

jQueryを使うことでブラウザ間の違いを吸収しながらも、簡易にDOM操作のJavaScriptコードを記載することができます。よく使われるjQueryのDOM操作のメソッドをまとめました。

jQueryの疎結合なイベント処理

jQueryを使ってイベント処理の登録と削除方法、登録できるイベントの一覧を説明します。 また、JavaScriptはイベントを通してHTMLと結びついているので、イベントハンドラのコーディングと修正に多くの時間を使います。 そのため、イベントハンドラとアプリ…

jQueryによるAjax処理

jQueryの$.getメソッドと$.postメソッドの使い方を説明します。

JavaScriptで設定データをコードと分離する

良い設計のアプリケーションは、「生きた設定データ」をソースコードのメイン部分と分離し、設定データの変更を容易にし、意図しないバグを含まないようにします。「URL」、「UIに表示される文字列」、「繰り返される一意の値」、「設定(ページごとの項目な…

Javascriptのthisの参照先をまとめてみた

JavaScriptのthisは属しているオブジェクトによって参照先が変わります。 コンストラクタ内、オブジェクト内、イベントハンドラ内などのthisの参照先をまとめました。

HTML/CSS/JavaScriptを疎結合にする方法

HTML/CSS/JavaScriptは相互に関係しているが、できる限り依存して複雑にならないようにする方法を説明します。そうすることで、デバッグのしやすさ、コードの理解のしやすさ、保守性があがります。

JavaScriptの少し独特なオブジェクト指向についてまとめてみた

既にJavaやPHPなどオブジェクト指向言語を生業としてやっているが、その感覚でJavaScriptを少し扱っているて、いまいちJavaScript分からないという方を対象に、それらのプログラム言語とは違う、「少し独特なJavaScriptのオブジェクト指向」について説明しま…

RailsでJasmineを使ってJavascriptの単体テストをする

RailsでJasmineを使ってJavascriptの単体テストを実行する方法を説明します。 JasmineはJavascriptの単体テストを行うためのテスティングフレームワークです。