• angular.jsとknockout.jsを使ってみた

    とても便利なangular.jsとknockout.js

    これまでbackbone.jsを触ってきたのですが、正月休みでangular.jsとknockout.jsも試しに触ってみました。

    backbone.jsほど学習に時間がかからず、特にknockoutはdata-bind属性内に予め定義されたバインディングや自作のバインディングを書いて、それにパラメータを渡すことで様々なイベントや処理が行えるようなかんじで、覚えるのがとても楽でした。

    angular.jsは ng-hogehoge 属性でhogehogeをいろんな形式に書き換えることで様々なイベントや処理を行うことができるかんじになっており、ng-model属性で定義した識別子をng-valueに書くとその部分にリレーションができて<input data-model=”hoge”>とすると<span ng-value=”hoge”>の値がリアルタイムで書き換わるので便利。

    knockout.jsでも同じことはできるけども、knockout.jsの場合は、observableでデータの監視、computedでデータの監視で変化があると実行する関数で明示的に定義してやらないといけないので注意。

    backbone.js使わなくてもいいような・・・?

    そんなことはないです。backbone.jsは様々なプラグインが用意されており、もしくは自分で自由に振舞いを書き換えることができるのでかなりカスタマイズがきくし自由度が高い。angular.jsやknockout.jsはビューの書き換えには特化してるけどモデルの扱いは弱いので、そういった面でもbackbone.jsは補えたりする。なので、一長一短なのだ。

    使い分け

    • backbone.js → 大規模開発に向いている。フルカスタマイズしたい人向けで、骨さえ用意してくれればいいよ!っていう場合これ
    • knockout.js → イベントの処理かくのめんどくさいので楽に書きたい、それだけでいいという方むけ。
    • angular.js → 楽に書きたい! 楽にリッチなWebアプリ作りたい! 細かいカスタマイズは必要ない! という方はこれ!

    最後に

    どのフレームワークも「癖」みたいなものがあります。食わず嫌いはしないで一度様々なフレームワークに触れてみて自分、もしくはプロジェクトにあったフレームワークに手を出してみるのがいいと思います。

  • DjangoがPython3で使えるようになったらしいので試してみた その1

    Django

    Python2時代からお世話になってるWebフレームワークですが、Python3が登場してからしばらくPython2にしか対応してませんでした。なんとかソースコード改変してPython3に無理やり対応・・・なんてこともしましたが、ようやく公式で対応したようです。

    データベースのプラグインもpython2じゃないと動かないものも多くて、ほんとに苦労しました・・・。

    というわけで、久々にPython3でDjangoをやってみたわけですが、これが実におもしろいw
    RubyOnRailsはDevサーバーの起動がちょっと重くて開発時にちょっともたつく・・(本番は早い)けどもPythonだとさっくさく!
    高速開発するならやっぱりpythonなんじゃないでしょうか、githubで公開されているようなOSSパッケージに頼らなくてもコーディングできる自身があるなら、Pythonという選択もいいかもしれません。特にデザイナーがデザインして卸すようなものだったらDjangoお勧めです。

    ってことで、この記事では特にDjangoについて新しい機能を紹介するというわけではなく単純にほそぼそとDjangoのチュートリアルをやってみることにします。デバッグ系コマンドとかは、やっぱり触ってみないとわからないですしおすし。

    Python3とDjangoのインストール

    Pythonは pyenvかwindowsのパッケージ経由からインストールしてください、 Djangoは普通に公開されているものをpython install setup.py します。

    最後に、
    https://docs.djangoproject.com/en/1.6/intro/install/ の「Verifying」の項目を見てDjangoがインストールされたか調べます。

    プロジェクトの作成

    このあたりの話は全部
    https://docs.djangoproject.com/en/1.6/intro/tutorial01/
    ここに書かれています。 pyenvを使っている人は pyenv rehash すると、”django-admin.py” というコマンドが使えるようになっていると思います。

    django-admin.py startproject mysiteCode language: CSS (css)

    これでプロジェクトを作成します。なんだか、一つのプロジェクトに複数のサイトがある構図・・らしいです。
    このあたり混乱しました。

    devサーバーの起動

    devサーバーを起動するには、こうします。

    python manage.py runserverCode language: CSS (css)

    ポートを変えたい場合はこんなかんじ

    python manage.py runserver 8080Code language: CSS (css)

    自分のパソコンだけではなく、他のパソコンからもアクセスできるようにしたい場合は

    python manage.py runserver 0.0.0.0:8000Code language: CSS (css)

    このようにします。

    データベースの設定

    データベースはデフォルトでsqlite3が使用されるようになっています。
    あとで変更することもできるのでここは一旦保留にして次に進みます。。。

    データベースシンク

    python manage.py syncdbCode language: CSS (css)

    アプリの作成

    プロジェクトの中にアプリを作成します。 appがアプリの名前です。

    python manage.py startapp appCode language: CSS (css)

    アプリを作成したら、設定ファイルにアプリを登録します。

    vim mysite/settings.py
    INSTALLED_APPS = (
        'django.contrib.admin',
        'django.contrib.auth',
        'django.contrib.contenttypes',
        'django.contrib.sessions',
        'django.contrib.messages',
        'django.contrib.staticfiles',
        'app'
    )Code language: JavaScript (javascript)

    モデルファイル編集と構築

    vim app/models.py
    from django.db import models
    
    class Poll(models.Model):
        question = models.CharField(max_length=200)
        pub_date = models.DateTimeField('date published')
    
    class Choice(models.Model):
        poll = models.ForeignKey(Poll)
        choice_text = models.CharField(max_length=200)
        votes = models.IntegerField(default=0)

    公式からのそのまんまコピペです。細かいことは気にせずとりあえずコピペでいいと思います。多分。

    そして、dbを構築します。

    python manage.py sql appCode language: CSS (css)

    appがアプリ名です。これでdbを構築できます。設定ファイルのINSTALLED_APPSにアプリ名を追記してないと実行できないらしいので注意。それでもエラーを吐く場合は、何度か実行すればうまくいきます。(謎ですが・・。)

    そして最後にもう一度syncdb

    python manage.py syncdbCode language: CSS (css)

    モデルをいじってみる

    もうモデルはできてるので、実はもう弄ることができるようになってます。
    弄るには、

    python manage.py shellCode language: CSS (css)

    で対話シェルに入ります。対話シェル大好きです。

    対話シェルに入ったら、何もパッケージをロードしている状態ではないので、パッケージをロードしつつ、モデルメソッドを実行していく・・・という流れになります。

    # PollモデルとChoiceモデルをロード
    from app.models import Poll, Choice
    
    # Pollが持っているモデルを全て取得
    Poll.objects.all()
    # => []
    
    # timezone取得するパッケージ
    from django.utils import timezone
    
    # PollモデルクラスからPollモデルを作る
    p = Poll(question="What's new?", pub_date=timezone.now())
    
    # モデルの保存(↑で作成しているように見えるけども実は保存されていないらしい)
    p.save()
    
    # モデルのIDを見てみる
    p.id
    # => 1
    
    # モデルのカラムを見てみる
    p.question
    # => "What's new?"
    
    # モデルのカラムを見てみる
    p.pub_date
    # => datetime.datetime(2012, 2, 26, 13, 0, 0, 775217, tzinfo=<UTC>)
    
    # モデル書き換えてみる (p.save で保存される)
    p.question = "What's up?"
    p.save()
    
    # モデル一覧見てみる
    Poll.objects.all()
    => Poll.objects.all()
    
    
    
    Code language: PHP (php)

    おー、便利、ある程度遊ぶだけでモデルの扱いに慣れそうですね。他にもいろんなメソッドありそうなのでいじってみるといいとおもいます。

    とりあえずこの記事ではここまでにしておきます。
    いちいちApacheを用意しなくても開発でお試しでやるならdevサーバーが便利ですね。
    次回は、ルーティング周りをやれたらやります。