とある角度から

お腹いっぱいたべられる幸せ

ここ数年を振り返って

およそ5年間、このブログは更新できてなかったんですが、今の会社で技術ブログは定期的に書いていたので、それをラップアップする感じでここ数年をまとめて振り返ってみようと思います(つまり穴埋め) ちなみに今の会社に入ったのは2020年の1月で、その前は…

宣伝 - Webフロントエンドハイパフォーマンスチューニング

縁あって、こちらの書籍のレビューを担当させて頂きました。 gihyo.jp webサイトのパフォーマンスと言っても、一概にこれといった指標はなく、リソースのローディングから、ツリー構築、描画、スクリプト実行速度など、様々な要素が影響してきます。 この本…

仮想マシン上でSelenium IDEで作ったテストケース(ruby)を動かす

やりたいこと Selenium IDEでテストケースをポンポン貯めてって、Jenkinsで勝手にテストして、テストが通らなかった場合はチャットに流す仕組み。 ひとまずVM上でテストケースを動かすだけで、割とやることがあったのでメモメモ 環境 ホストOS OS X 10.11.6…

Seleniumまとめ

久しぶりにSeleniumを使ったら、色々進化していたので、 自分の中の情報アップデートのためにアウトプット Seleniumとは ブラウザ上での操作をスクリプトで記述し、実行できる テストコードはHTML もしくは以下の開発言語で記述可能 「Java」「C#」「Ruby」…

rubyを実行するgruntプラグイン作るまで(3) - テストの記述

rubyを実行するgruntプラグイン作るまで(2) - 非同期でのコマンド実行 - 1010realのブログ ver2の続きです。 以前作ったgrunt-cclogdeleteをもう少し汎用的にして、外部コマンドを非同期実行するgrunt-run-asyncを作成しました。 外部コマンドなら何でも良い…

rubyを実行するgruntプラグイン作るまで(2) - 非同期でのコマンド実行

rubyを実行するgruntプラグイン作るまで(1) - gruntpluginのテンプレートを実行の続きです。 実行するrbファイルを作成 cocos2d-jsを使う機会があって、ビルド時にcc.log();を全て削除したかったので、そんなrbを作りました。 grunt-cclogdelete/cclogdelete…

rubyを実行するgruntプラグイン作るまで(1) - gruntpluginのテンプレートを実行

rubyのプログラムをgruntタスクの合間に挟みたかったので、gruntプラグインを自作することにしました。 物はこちら(※テストも書いてないし、npmに登録もしていないオレオレプラグイン汗) github.com gruntプラグイン用のテンプレートを持ってくる まずはgr…

backbone.jsでtodoアプリを少しずつ作る(2)

まえおき 前回作ったbackbone.jsのtodoサンプルをより洗練した形に作り変えていきます。「backbonejsを使ってアプリを作る」から「作りたいアプリのために、backbonejsを使いこなす」ようになるのが最終目標。。。 AppViewのシングルトン化 今回の設計では、…

backbone.jsでtodoアプリを少しずつ作る(1)

まえおき backbone.jsのtodoサンプルなんて、いまどきどこにでも転がっています。 でも、そのサンプルを参考に作ってみたけど、いまいち理解が深まらない。。。という「自分」のために一歩ずつ理解を深めながら、もう一度todoサンプルを作っていこうと思いま…

RequireJSでモジュール管理してみるサンプル(2)

前回の記事で 「RequireJSには、最適化ツール(r.js)を用いて、各モジュールをminifyし結合することができます」 といったので、それについてさくっと書きます。 セットアップ ~ 最適化の実行 前回のサンプルの構成をそのまま最適化していきます。1.まず、…

RequireJSでモジュール管理してみるサンプル

RequireJSとは Javascriptモジュールローダの1つです。 モジュールの依存管理だけではなく、パフォーマンス面も考慮されたライブラリで、 開発効率とパフォーマンスを両立したJavascript開発を実現できるかも。。。 具体的な特徴 特徴、というか全部メリッ…

公式サンプルから学ぶAngularJS (2)

ということで、前回の記事の続きで、AngularJS公式サイトのサンプル3つ目を作っていきます。の前に、今回のサンプルはFirebaseというサービスを利用しているので、事前に登録を済ませておく必要があります。 さくっとできるのでぜひ試してみてください→以前…

リアルタイムのバックエンドサービスFirebaseに感動

Firebaseが「何これやべぇ」ってお話。 対話的リアルタイムアプリケーションのためのバックエンドサービスなんですが、 とりあえず、アカウント登録して、サンプルを動かすだけで、そのリアルタイム感に感動できます。Firebase - Build Realtime Apps アカウ…

JSFiddleでAngularJSを使う

前回の記事でのAngularJSのサンプルはJSFiddle内で動作確認してみたのですが、AngularJSをJSFiddle内で使うのに、ちょっとだけテクニックが必要だったのでまとめてみました。1. まず、AngularJSを使いたいfiddleのFrameworks & Extensions設定を以下の設定に…

公式サンプルから学ぶAngularJS (1)

大層なタイトルをつけちゃいましたが、やってることは以下。AngularJSの公式サイト(以下)のトップに乗っているサンプルを作りながら、AngularJSのチュートリアル的なことをしてみる。 英語:AngularJS — Superheroic JavaScript MVW Framework 日本語訳:Ang…

jQuery.Deferredをちゃんと理解する

ちゃんと理解するために、ちゃんと説明してみた。 jQuery.Deferredは、タスクを管理する仕組み jQuery.Deferredでできることは、以下のような事です。 お仕事の約束をする お仕事が終わったら結果を受け取る 受け取った結果を元に次の作業をする これって、…

webフォントの使い方といくつかTips

webフォント関連について纏めてみました。 webフォントの設定方法 webフォントはcssで単に適用することができます。 @font-faceでフォント名と対象フォントファイルへのパスを指定し、font-familyに指定するだけです。 以下、ソースです。 body { font-famil…

javascriptでデバイスの向きと加速度を取得

javascriptでデバイスの向きとか加速度を取得してみた。DeviceOrientation Event Specification 上記ドラフトによると デバイスの向きは、deviceorientationイベントで取得 西向き、画面は上で水平な平面にデバイスを置いた場合の値は、{alpha: 90, beta: 0,…

クロージャとスコープチェーン

クロージャをなるべく簡潔にまとめてみます。 まず、クロージャを正しく理解するためには以下の理解が不可欠なので、その説明をします。 javascriptのスコープ スコープチェーン スコープは関数実行時ではなく、関数定義時に決定 javascriptのスコープ そも…