gulp.jsを使ってフロントエンドのビルドをする【webpack, stylus】 - yutaponのブログ
この記事はIwate Developers Advent Calendar 2014の6日目の記事です。 Iwate Developers Advent Calendar 2014 - Qiita 記事の内容はというと、岩手にまったく関係ありません。 学生の頃はフロントエンドを軽視してクソコードを量産していたので、今の学生の方にこんな風に作り始めるといいよって紹介する感じで書きたいと思います。 はじめに 昨今のフロントエンド開発はとにかく複雑になってきていて、学習コストが半端なくなってきてます。 angularとかbackbone.jsとか、最近ではreact+fluxなど、トレンドの移り変わりが激しいです。 またGruntやgulp.jsなどのタスクランナーの活用がフロントエンドでは欠かせなくなっていて、使ってないなら今すぐ導入すべき、とも言えます。 最近gulp.jsを使っていて、gu
webpack+babel-loader+power-assert+jsdomでフロントエンド開発環境を作る - yutaponのブログ
この記事は JavaScript Advent Calendar 2015 10日目の記事です。 去年は主に gulp にフォーカスした内容でしたが、今回はJSのビルドとテストにフォーカスした入門記事です。 やること ES2015で書いたコードをWebpackでビルドする babel@6系を使う Mocha + power-assert + jsdom でテストを書く やらないこと gulpまわり React.js CSSビルドまわり 最終的なコードはこちらに上げておきました(すごく簡素な出来です)。 GitHub - sskyu/webpack-power-assert-jsdom-skeleton はじめに 今年はReact.jsがJSerの中で定着した感がありました。 Fluxの考え方を昇華させたReduxがFlux系フレームワークでデファクトになりそうな雰囲気を出しつつ、React
Backbone.jsに入門してみる【View編】 - yutaponのブログ
今回はBackbone.Viewを取り扱います。 この記事を書く前にいろいろ試してみたのですが、 なかなか難しく理解が甘いので2回やります。 Backbone.Viewとは MVCモデルでいうVCがBackbone.Viewになります。 サーバーサイドのMVCフレームワークを使ってきた人には ビューなのにコントローラ？だと思いますが、Backbone.Viewでは コントローラメソッドとビューメソッドの二つを意識して使い分けます。 意識して、なので決まりがあるわけではありません。 慣れないうちはModelに書くべきロジックもViewに書いてしまいがちですが、 できればそれぞれの責務に応じて分離を心掛けましょう。 Backbone.Viewの使い方 Backbone.Viewを拡張して使います。 el（element）という属性にセレクタを渡すと、$elという属性にelの jQueryオブジ
TypeScript触ってみた感想 - yutaponのブログ
TypeScriptリファレンスを買って、4章まで読んだのでその感想を。 大雑把な感想としては、勉強しておいて損はない言語、といったところです。 ちなみに章構成はこんな感じです。 概要 開発環境の構築 TypeScript & JavaScript基本文法 基礎知識 必要とされるJavaScript知識 応用知識 開発支援ツール 開発サンプル TypeScriptリファレンス Ver.1.0対応 作者: わかめまさひろ,井上章,丸山弘詩出版社/メーカー: インプレスジャパン発売日: 2014/05/16メディア: 単行本（ソフトカバー）この商品を含むブログ (1件) を見る TypeScriptの特徴 TypeScriptはAltJSのうちの一つってくらいの予備知識で読み始めたので、1章は多くの学びがありました。 TypeScriptはJavaScriptのスーパーセット TypeScri
React入門用に簡単なアプリケーション作ってみる - yutaponのブログ
React入門系の記事はもう結構出尽くしてる感ありますがせっかくなので私も。 今回はReact v0.13RC2を使って↓のアプリケーションを写経してみます。（Authorは私ではありません） 見ての通り、抵抗の値を計算するアプリケーションです。 Reactで書かれていたり、SVG使ってたり面白いソースですね。 ちなみに抵抗の色の仕様はこのようになってます。 抵抗のカラーコード はじめに React v0.13RC2を使う理由は現時点で最新版ということと、v0.13.0beta1でES6のclass構文が使えるようになったからです。 jsfiddleのソースは1ファイルにまとめて書かれていますが、これを1コンポーネント1ファイルに分割して書いてみます。 React(JSX)のビルドにはBabelが使えるので、前回作ったスケルトンの上に作っていきます。 設計 jsfiddleのJSソースの一
javascriptでテスト駆動開発 Mocha+expect.js+testem【前編】 - yutaponのブログ
JavaScriptのテストをするツール達 テスト駆動するときに必要なツールが2つあります。 テストフレームワーク テストランナー テストフレームワーク いわゆるxUnit系のツールがこれにあたります。 JavaScriptでの有名ドコロは下記のスライドが参考になります。 JS開発におけるTDDと自動テストツール利用の勘所 私はまだ2つしか使ったことがありません。 Jasmine http://pivotal.github.io/jasmine/ Mocha Mocha - the fun, simple, flexible JavaScript test framework どちらもBDDライクな書き方で好きです。 特にMocha（モカと読みます）の方ですが、単体では使わず should.jsやexpect.jsなどのアサーションライブラリと組み合わせて使います。 これはmocha単体の
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
