タグ

ブックマーク / havelog.aho.mu (18)

  • Isomorphic Architecture を実装してるときの細かいアレコレ

    Isomorphic あらため Universal ? 一時期火がついていた Isomorphic について。各自がプロダクションの事例を作り上げる潜伏期に入ったのか、はたまた当に一過性で火が消えたのか、コモディティ化を遂げたのか分かりませんが、あまり耳にすることがなくなった印象です。 そんな中ですが先日、Universal JavaScript — Medium が公開され、なるほど Universal ってキモチになったので、タイトルに反して以下は Universal と呼称します。 今回の話題にするのは module レベルではなく Universal な JavaScript architecture のほうです。アーキテクチャのレベルで Universal なコードが役立つ代表的ケースは SPA (Single Page Application) と SSR (Server S

    Isomorphic Architecture を実装してるときの細かいアレコレ
    tuki0918
    tuki0918 2017/04/19
  • テストを考慮した singleton の ES6 export

    テスト時の singleton を避けたい export facebook/flux のサンプル準拠だと、Store や Dispatcher が singleton でテストを書きづらいことがあるので、普段使う singleton インスタンスと、テストで使う class オブジェクトを両方 export した。 import AppDispatcher, {Action, Payload} from '../dispatcher/AppDispatcher'; import * as Events from 'events'; const CHANGE_EVENT = 'change'; // 生クラスの export export class AcmeStore extends Events.EventEmitter { dispatchToken: string; construc

    テストを考慮した singleton の ES6 export
    tuki0918
    tuki0918 2016/02/28
  • 最近あまり使ってない、流行っていた時期もあるフロントエンドもの

    最近あまり使ってない、ちょっと前の流行りもの なんとなく書いてみます。Web アプリケーション開発屋さんなので、Web サイト制作屋さんとはかなり文脈ズレると思います。 jQuery ファミリー 個人的には jQuery って、協業用のツールという位置づけでした。jQuery でさえ書かれていれば、jQuery 書ける人材のほうが外からも調達しやすいため、人員の流動にも有効と考えられる頃が確かにありました。 DOM に触れてくれるな勢の台頭 ところが昨今では AngularJS や React、その他ライブラリでも DOM 操作が大いに抽象化されていることが多く、jQuery で直接 DOM を操作すること自体が相性良くないケースが散見されます。今思えば Backbone.js くらいのころが jQuery 需要の最終ピークだったように思います。 jQuery プラグイン の需要減 jQu

    最近あまり使ってない、流行っていた時期もあるフロントエンドもの
    tuki0918
    tuki0918 2015/02/19
    “isomorphic ”
  • Docker を Mac で使ってみた(Nodeアプリ例)

    色々あってDockerした。さっくりとアプリ作るならHerokuも便利なのだけど、Dockerをサポートする他のPaaSも使えた方が便利そうな風潮を感じたので。 1. インストール&導入 Mac OS X - Docker Documentation Releases · boot2docker/osx-installer からpkgインストーラをダウンロードして実行。適当にはいる。 boot2docker Mac OS X上で、Dockerを走らせるためのLinuxなVMを boot2docker で立ち上げられる。(boot2docker/boot2docker はpkgインストーラに含まれている) boot2docker init boot2docker up boot2docker init で初期化 boot2docker up で起動。dockerコマンドにホストを教えるための

    Docker を Mac で使ってみた(Nodeアプリ例)
    tuki0918
    tuki0918 2014/07/09
  • PHPのinterfaceとabstractを正しく理解して使い分けたいぞー ::ハブろぐ

    interfaceとabstractの特徴と違いを捉える 今回もPHP話。(正しくないことは @ahomu に教えてもらえると助かりマス) PHP5では、interface(インターフェイスの宣言)やabstract(抽象化)が使用できます。これらの説明を読むと、一見して同じような役割を持っているように見えます。 それは両者とも、メソッドの実装を「インターフェイスを実装したクラス」や、「抽象クラスを継承したクラス」に強制的に任せる機能を持っているからです。これらの挙動は、外見上とても似ています。少なくとも自分はそこで引っかかりました。 interfaceもabstractも便利なオブジェクト指向機能ですが、使い分けができないと、もったいないです。ありがちな話だと、いつまでもabstract一辺倒で、interfaceの出番が見つからない、とか。 今回はそのへんを自分の理解を整理しつつ書き留

    PHPのinterfaceとabstractを正しく理解して使い分けたいぞー ::ハブろぐ
    tuki0918
    tuki0918 2014/01/06
  • VagrantとChef-soloについて初歩の備忘

    開発環境を管理する 遅まきながら触ってみたら、予想以上に簡単だったのでちゃっちゃと備忘する次第。 Vagrant Chef | Opscode ということで、開発環境をどうにかしたかったので、VagrantとChefによる管理を試してみました。ついでに、Amazon S3のようなインスタンスを対象にもセットアップできるようにすることも想定してます。 記事は、ほんとに備忘録ノリなので、「Chefとは」「Chef soloとは」「Vagrantとは」などについては各自ググってください。 前提 現状は、開発環境のVMが秘伝のタレと化している 新しくVMをセットアップする際の作業にも秘伝のスクリプトが点在する phpnginxのconfigが、複数のリポジトリに偏在していて集めるの大変 それぞれが個別に設定しなくても、開発環境を一斉に更新できるようにしたい 新しい人がジョインしたときも同じ水準

    VagrantとChef-soloについて初歩の備忘
    tuki0918
    tuki0918 2013/08/15
  • Titanium CLIのセットアップ・ビルドなど導入編

    appcelerator/titanium · GitHub appcelerator/alloy · GitHub Titanium Mobileといえば、Titanium Studioが主流だと思うのだが、最近はコマンドラインツールも提供されるようになったらしいので使ってみる。そいで、Titanium Mobileで開発する際のMVCフレームワークに相当するAlloyというのも、npmで入るらしいのでまとめて導入。 % npm install -g titanium % npm install -g alloy % titanium -v 3.0.22 % alloy -v 0.3.6 さらっとnpm install -gでtitaniumとalloyをインストールする。これを試した時点における、それぞれのバージョンは上記。 % titanium sdk update --instal

    Titanium CLIのセットアップ・ビルドなど導入編
  • Rails + Heroku で俺専用RSSリーダー作った

    Webアプリのリハビリ ということで、Official Blog: A second spring of cleaningで告知された、Google Reader閉鎖に備え、俺専用RSSリーダーをRuby on Railsで軽めに作ってみた。 read.aho.mu 目的としてはRuby + Railsの学習と、サーバーサイドのリハビリのつもりだったのだけど、簡単すぎて実作業1日分くらいで終わってしまった..(´・ω・`) 自分で登録したフィードを、自分でなんとなく流し読みして、良いと思った記事に♡を付けられるだけなのですが、それがついでにオープンになっているだけ。 色々もにょもにょ 触ってみた箇所について所感など。 前からScalaなりNodeなりでHello Worldまでは試してましたが、素直にRailsをデプロイして動くところまで手を入れたのは初。 無料で使えるアドオンを幾つか入れ

    Rails + Heroku で俺専用RSSリーダー作った
  • ハブろぐ - havelog.ayumusato.com

    事業会社のWeb/IT開発系マネージャーとしてのプレイスタイルまたは取扱説明書 Posted: 2024-03-05 Updated: 2024-03-05 #マネジメント 開発生産性の可視化サービスから何を見いだして何ができるのか、あるいはすべきで無いこと Posted: 2024-02-05 Updated: 2024-02-07

    ハブろぐ - havelog.ayumusato.com
  • Backbone.jsを使うときに参考になるリソース 2012年末版 (Backbone Advent Calendar 2012 25th day)

    Backboneを使うときの参考情報たち Advent Calendarがネタ切れの折、最終日が冴えない小ネタで終わるよりはマシかということでリストアップしてみた。 日語リソース では早速、日語のリソースから。古い情報はリストから外しているので、いくらか偏りがあるかも。悪しからず。 ビギナー向けにまとまったの CodeGrid - フロントエンドに関わる人々のガイド Backbone.js Advent Calendar 2011 - Qiita CodeGridで連載中のBackbone入門が、ちょうどリアルタイムに更新されているビギナー向け情報でおすすめ。ただし有料。去年のAdvent Calendarも丁寧でおすすめ。 enja-oss/Backbone · GitHub JavaScript MVCフレームワーク Backbone.jsのコメント付きソースコード日語訳が公開

    Backbone.jsを使うときに参考になるリソース 2012年末版 (Backbone Advent Calendar 2012 25th day)
  • Backbone.js コメント付きソースコード日本語訳

    Annotated Sourceのコメントを訳しました 地味に道のりが長い作業でしたが、何とか先々週末にやっつけて、例によって@cssradar氏に確認していただいたりとかして今に至りご紹介する次第。 日語訳コメントがついたソースコード· enja-oss/Backbone · GitHub なんだかんだで全域を網羅する必要があったたので、非常に勉強になりました。ソースコード自体は短く簡潔なので、Backboneをこれから使い始める/もう使ってるを問わず、まだ読んでない方は一度読んでみると良いです。 監訳謝辞 Revert original text for supervise by ahomu · Pull Request #12 · enja-oss/Backbone 上記Pull Request&監訳依頼につきまして、多大なるレビューをしてくださった@cssradar 氏に感謝を。

    Backbone.js コメント付きソースコード日本語訳
    tuki0918
    tuki0918 2012/12/14
    ありがとうございます
  • $.eachのループを途中で止める (軽めのjQuery Advent Calendar 2012 7th day)

    $.eachを回して途中で止める $.eachはたとえば複数の要素を示すjQueryオブジェクトをループして、ひとつひとつに対して処理を適用することができます。jQueryプラグインなぞを開くと、かなりの高確率で使用されている人気のAPIです。 そんな$.eachは、return falseでいわゆるbreak(中断)をすることができます。知ってると便利かも、ぐらいの軽いおはなし。 orange pineapple apple たとえばこのようなコードでは、orange・pineappleappleの順に並んだ要素をループして検査し、pineappleであれば、ループを止めてそうでなければ背景に色をつけています。この例で期待される動作は、最初のorangeだけに色がつくのが正しいです。 実行結果は以下 Iterate by $.each こんな感じになります。期待通りの動作ですね。 do

    $.eachのループを途中で止める (軽めのjQuery Advent Calendar 2012 7th day)
  • 勉強会資料シェア Getting Started with RequireJS

    げりんぐすたーてっど うぃず りくわぃあーじぇーぇす ということで、社内勉強会でRequireJSの入門資料をこさえたのでシェア。 利用したデモファイルセット http://d.aho.mu/S4mh なんとなくRequireJSが動くセットです。スライド中のr.jsによるビルドコマンドや、gruntを利用したビルドも試せるようになっています。 おさえるべき要点 いくつかの要点だけ記事内に文字列でおこしておきまする。 モジュラーと依存関係 Webサイト → Webアプリ への流れが明確になってきてフロントエンドが複雑化してきている今、1つのJSファイルにつらつらとCSSのようなノリで書き連ねる時代は終わりつつあります。 ParisJS #10 : RequireJS このあたりについては、上記の素晴らしいスライドから、Figureを拝借しました。個々のJavaScriptの粒度が揃えてモジ

    勉強会資料シェア Getting Started with RequireJS
  • 続Grunt + phantomjs + jasmineで自動テスト環境

    目標はgrunt + phantomjs + jasmineの自動テスト環境 先日の大なごやJS Vol.3で、@_tk84さんが発表なさっていた、PhantomJSで自動テストにインスパイアされて、Gruntでそのあたりをコントロールできるようにしました。 今回のポイントは下記。 .coffeeを保存したら、.jsに自動でコンパイル .jsの更新を検知して、SpecRunner.htmlを自動生成 このとき更新された.jsと、対になるテストコードを含んだSpecRunner.htmlが生成される phantomjsで、SpecRunner.htmlを実行した結果を標準出力 出力をgrowlnotifyに渡してデスクトップ通知 @_tk84さんの元ネタのほうでは、EmacsとRubyな環境でしたが、自分はエディタには依存せず、nodeの実行環境だけで何とかできるように構成しました。 aho

    続Grunt + phantomjs + jasmineで自動テスト環境
  • kanazawa.js v1.7 にいってきました

    kanazawa.js v1.7 - Back to Basics - 個人的な興味と視点で偏ったレポートですが、先週末の。 先週の土曜日に、kanazawa.js v1.7 Back to Basicsに遠征してきました。地元の名古屋にJS関係でこの規模の勉強会とコミュニティは無い(よね?)ので、とても憧れる次第。こと勉強会に限って述べれば、むしろ東京のユートピア感がハンパないですが・・・、それはさておき。 さらっとメインセッションとミニセッションの感想についてと、多方に思いを馳せながら地元の勉強会コミュニティについて所感を。 詳しくは、kanazawa.js v1.7 – Back to Basics – 開催しました | MOLで、まとめられています! メインセッション 2月のデブサミでJavaScript.Nextをすでに聴講していたので、ちょっとかぶり気味な節はあったのですが、小

    kanazawa.js v1.7 にいってきました
  • 最強のJavaScript IDE「WebStorm」の姉妹品「PhpStorm」はPHP IDEとして最高だった ::ハブろぐ

    先に「WebStorm」について軽く言及 【コラム】イマドキのIDE事情 (94) 最強のJavaScript IDE「WebStorm」を試してみる | エンタープライズ | マイコミジャーナル 最強のJavaScript IDE 「WebStorm」を使ってみた | Web scratch 最強と称したのは自分じゃないのですが、「WebStorm」は最強らしいです。最強な割に、AptanaとかKomodo等と比べるとマイナー感が溢れているのですが、気のせいでしょうか。 WebStorm自身、いつの間にかJavaScript向けのIDEということになっていますが、実際はWebフロントエンド全般に適したIDEです。そのため、HTMLCSSについても、優秀な機能を備えています。とはいえ、HTMLCSSだけを取り扱う場合はIDEが縁遠い気もするので、実質JavaScriptでゴリゴリ開発す

    最強のJavaScript IDE「WebStorm」の姉妹品「PhpStorm」はPHP IDEとして最高だった ::ハブろぐ
    tuki0918
    tuki0918 2012/02/22
  • jQuery Mobileをマジメに使うならやっておくべきローカライズとかの設定

    jQuery Mobileつかってますか? jQueryでキャラを立てたいわけじゃないんですが...,たびたびのjQueryネタです.なんだかんだで需要が高く,最近は実案件で触る機会があったので情報を残します. いくらお手軽でも,まじめに使うならこれぐらいはやっておかないとダメじゃないかと思う設定のポイントを軽く紹介.Loading...とかデフォルト英語なラベルの変更とかです. 設定の初期化 デフォルトの文字表示やクラス名等の設定を変更するときは,Configuring Defaultsによると,jQuery体とjQuery Mobileの間に初期化スクリプトを挿入します. <script src="http://code.jquery.com/jquery-1.5.2.min.js"></script> <script type="text/javascript"> $(docume

    jQuery Mobileをマジメに使うならやっておくべきローカライズとかの設定
  • 社内講習わくわくjQuery編1 - jQueryを使ってみよう

    今回の目標 読める+書ける=学べる 2時間ちょっとでいきなり書けるようになる訳はありませんが,書いてみないと覚えられないので,2時間かけて触ってみて独学できるようにします. 最初に,1+1=2の原理を覚える必要はないので,2=1+1でも 2=2*1 でも 2=1/2*4 でもいいので,やりたいことをやってみるのが一番です. やること jQueryセレクタをつかってみよう 要素をブン回してみよう スライドショーの動きを追ってみよう 開閉メニューの動きを追ってみよう やらないこと プログラムの基(習うより慣れる) JavaScriptの構文(書きながら覚える) jQueryPluginの使い方(オプションをいじる以上のことをやろうと思うと難しい) thisなんてしりません $.eachなんてしりません 変数とかIFなんてわかりません jQueryを使えるようにする Downloading j

    社内講習わくわくjQuery編1 - jQueryを使ってみよう
  • 1