JazzとWebと無印と

ゆっくり豊かに暮らす

JavaScriptで時間差で要素を表示する

時間差表示がしたい JavaScriptで画像などを一つずつ順番に表示したいとき、 今更ながら少しはまったのでメモ。 jQuert delay関数を使う sleepとか単純に処理を止める関数はない模様なので、 jQueryの関数delayをループで組み合わせる 0.1秒ごとに画像を一つ…

ネイティブのようなWebアプリを作る! キャッシュ更新されない問題

ファイルを更新しても反映されない 前回、オフラインWEBアプリを作成したが、 ファイルを更新しても反映されない問題発生。 マニフェストファイルが更新されていないと更新されない とのことなので、マニフェストファイルを修正したら反映された。 慣例でver…

ネイティブのようなWebアプリを作る! オフラインWEBアプリケーション作成

Webでもリッチなコンテンツが作れるようになってきている ✔︎ オフラインWebアプリ ✔︎ JSフレームワークの進化 ✔︎ CSS3の進化 ✔︎ WebSocketの進化 ✔︎ http2 ✔︎ Web Push とかとか。 このあたりの要素とてもワクワクするので そろそろ一つ作り上げてみたいので…

vue.js カスタムフィルタ登録 お金の表示を3桁区切りで表示する

お金の表示を3桁区切りにしたい JSの標準関数で存在した。 NumberオブジェクトのtoLocaleString関数 こんな感じ console.log( (123456).toLocaleString() ); // 123,456 ロケール設定に依存するようですが、 正規表現でコネコネするよりシンプルで良い vue.j…

Vue.js × vue-router × browserifyで SPAのHTMLの画面ごとに切り出し

HTMLファイルを画面ごとに切り出したい 前回、vue-routerでVue.jsでSPAっぽくURLごとに DOMを切り替えた。 ただ、一つのHTML全て画面の要素を書いていくのは ・肥大化してみづらい ・管理しづらい などなどのため、画面ごとにHTMLファイルに切り出したい bro…

Vue.js vue-routerでSPA実装

Vue.jsに公式のrouterが vue.jsは ・学習コストが低い ・シンプルにかける などと言われおり、実際に使ってデータバインディングは 確かにラクにかけるので好んで使っていた。 そのVue.jsに最近vue-routerなる公式のroutingモジュールが でていたので、使っ…

ViewModelの役割

ViewModelを初めて使うことになりそうなので、改めて整理。役割分担としては✔︎データ永続化に関する処理はModelに記載してControllerで呼び出し✔︎画面に表示するデータの取得及び加工はViewModelに記載になるのか。参照系の画面はコントローラがかなりシンプ…

【PHPUnit × SeleniumでE2E自動テスト】 ボタンクリック、フォーム入力

前回の環境構築した状態からの続き フォーム入力 ボタンクリック 以下のソースでやっていることは 1. weblio翻訳サイトにアクセス 2. 翻訳内容に ”私はJAZZが好きです” と入力 3. 翻訳ボタンクリック 4. 翻訳結果を取得 5. 結果が "I like JAZZ" であること…

macのターミナルでのタブ切り替えショートカット

mac

タブ切り替え macターミナルタブ切り替え ctrl + tabで切り替わらないので、メモ command + shift + → or ← 新規タブ ついでに新規タブは command + t こちらはブラウザと同じですね。

macでウィンドウの最大化を簡単に行う

ウィンドウの最大化がしたい Yosemiteでは緑のボタンを押すとフルスクリーンモードとしての最大化になってしまう。 メインデスクトップでかDockはでてこないし、command + tabで切り替えたときのスライドアニメーションが鬱陶しいので、個人的には利用しにく…

PHPUnitでテストケースを書いてSelenumで自動テスト

自動テストってめんどくさそうと思っていた 自動テストで品質向上、テストを便利にしたい。 ずっと考えていたが、踏み出せていなかった。 それは自動テスト = Unitテストをガチガチに組む必要があるという思い込み。 テストコードのメンテが手間、テストコー…

Monaca × Onsen-UIでタブバー実装

Onsen-UIのコンポーネントを利用して iPhoneアプリっぽいタブバーを用意してみる。 Onsen-UIのリファレンスから使いたいパーツのソースを もってくれば使える。 ja.onsen.io タブバーに関しては、MonacaのOnsen-UIのテンプレに用意されているものを利用。 デ…

ハイブリッドアプリをMonacaで作成

アプリ開発にはずっと手をだしてこなかったが、 Monacaで手軽に作れるとのことでやってみる。 なにも知らない状態から5分ほどでサンプルアプリが 手元の実機で動かせたので本当に驚き Monaca - HTML5ハイブリッドアプリ開発プラットフォーム こちらから、「M…