経緯 フリーランスになってから早2年。前のプロジェクトが解散となり、新しくReact JSのプロジェクトに参画しました。Reactに関してはほぼ初めてでしたが、最近慣れてきたので、ぼちぼちReactに関する記事も書いていこうかと思います。 React.memo を使ったときにうまく働いていなさそうだったので、調べたことをまとめました。 React.memo とは？ 通常、R
Webシステムで多言語対応をするとき、サーバー側でTimeZoneを変換して、レンダーしてもいいのですが、ユーザーのTimeZoneをあらかじめ保存するなど、何かしらの方法でサーバーにTimeZoneを伝える必要があり、大変です。 そんなとき、ユーザーのクライアントのLocaleを利用すると便利です。 Moment.jsを利用して、それを表現する方法をご紹介します。 Moment
管理画面などを実装しているとき、一覧画面では<table>タグでデータを表示することが多いと思います。また、顧客側から、行のどこをクリックしても詳細画面や編集画面にジャンプするような行を実装したいという要望が出ることもあります。 今日はそのシンプルな方法をご紹介します。 HTML 以下のように、<tr>にdata-href属性を付与して、リンク先を記載しま
iCheck.jsを使うとチェックボックスやラジオボタンをスタイリングできます。 http://icheck.fronteed.com/ かなり定番のJSライブラリにはなりますが、使ってみると、onchangeイベントが取れなくなってしまいました。 対処法 公式ドキュメントみるとちゃんとifChangedを使うように指示がありました。 c.f.) こちらのCallba
ユーザの手によって<div>タグの大きさや位置を、ドラッグして移動や拡大させたいとき、簡単に実装できるInteract.jsのご紹介します。ちゃんとスマホでも動作確認できたのでこのようなUIが必要なとき、必要な使い勝手がいいと思います。 http://interactjs.io/ Document: http://interactjs.io/docs/ 実装方法
Railsではlink_toヘルパーにdata: {confirm: 'よろしいですか？'}のように書いたり、HTMLで<a data-confirm="よろしいですか？">確認</a>のようにdata-confirmと、リンクをクリックしたときに確認のアラートが出るようにできます。 通常のhrefで指定されたリンクの場合は、confirmでOKを押すと、リンク先に遷移します。た
AngularJSアプリケーション開発ガイドという本を買って勉強中です。今、全体の20%くらいしか呼んでませんが、だいぶ全体像がつかめてきました。 バージョンが古いのか、Changing Views with Routes and $locationという章のサンプルコードがうまく動かなかったので、動くようにしました。 この章では、ページ遷移なしで、画面を遷移させましょうというのが主題
最近AngularJSにはまってるので、AngularJSを勉強して覚えたことを書いていきます。 参考書籍: AngularJSアプリケーション開発ガイド フロントのコーディングしていると、条件によって要素のスタイルを変えてやりたくなることがよくあります。 e.g.) 例えば、お気に入りボタンを押す前は文字色は黒で、押したあとは赤になる これをAngularJSで実装できる
