2015/3/7 にMSakamaki氏に声を掛けられれて一緒に AngularJS ES6 リファクタソンを開催しました。 内容は参加者が 2〜3 人のチームに分かれて ES5 で書かれた Angular1.3 ベースの Web アプリを、ES6 でリファクタするという企画です。 ES5 のコードの中にクソコードを仕込んでおいて、ついでにリファクタしてくれるかなーなんて思いながら主催側ですが、一緒にリファクタして結構楽しかったです。 Angular1.3 を ES6 でリファクタするポイントや、書き換えてみての所感とかまとめようと思います。 (注 今回のコードは実験的な試みです。プロダクションコードに適用するかは自己責任でお願いします。) AngularJS ES6 リファクタソン - AngularJs Japan User Group | Doorkeeper Angular1.X

ブラウザでの Javascript の高速化と Backbone や Angular のような JavascriptMVC フレームワークの登場により、以前より SPA（Single page application）が構築しやすくなりました。 さらに、Yeoman に代表される SPA を作成するするための scaffold（土台）が整備されてきましたので、結構さくっと SPA が作れるようになったのも事実です。 さくっと作った SPA がさくさく動かない・・・作ったけど使えない・・・なんてことにならないように、SPA を構築する前に知っておいた方がいい課題について調べてたり考えてみました。 目次 1. パフォーマンス 2. メモリリーク 3. セキュリティ 4. フレームワークロックイン 5. 画面設計から UI コンポーネント設計への思想転換 6. フロントエンジニア不足 7. 番外

フロントエンドの世界では、日々新しいフレームワークやライブラリが生まれています。 初めてそういった新しいものを習得する場合に、なるべくなら近道したいと思うのが人の気持ちだと思います。 まず大変なのが、Hello World から実際のプロダクトやプロトタイプで利用する場合で、これは初めてで何もわからない土地を一人で散策するような感覚にも似ています。 今日、紹介するのは私が進化の早いフロントエンドの世界で、より早く未開の土地に慣れるためにスタイルガイドを有効活用しているという話です。 ちなみにこの記事はFrontrend Advent Calendar 2014 - Qiitaの 6 日目の記事です。 5 日目はじめての CSS 設計 - Qiita(@moschann) 7 日目CSS のプリプロセスとポストプロセス、そして Rework と PostCSS(@morishitter) 良

この記事はAngularJS Advent Calendar 2014 - Adventarの 3 日目の記事です。 2 日目AngularJS BootstrapUI を利用した FilterSelect(@takeyama) 4 日目初心者マークの Angular.js - Uemmra3 のフルスタックエンジニア？日記(@Uemmra3) AngularJS でそれなりの規模のアプリケーションを書く場合、プロジェクトの構成って結構悩みます。 いつも悩んでます。。。 悩みすぎてちょくちょく構成変えるため、たまにアプリケーションが壊れてます。 そんなとき心もポッキリ壊れそうになります。 そんな私が、最近いいなと思っている AngularJS のプロジェクト構成について紹介します。 参考資料(有名どころ) AngularJS のプロジェクトの構成については、結構以前から議論されています。有

だいぶ前のことですが、9/22 に行われたAngularJS リファレンス」出版記念会にて SIer での AngularJS の取り組みについて話させていただきました。 先日、その資料を見て興味を持ってくれた他の SIer にて AngularJS について講演させていただく機会をいただいたこともあり、なぜ AngularJS をいいと感じているのかや、AngularJS に期待することなど、個人的な思いを書いてみたいと思います。(あくまで SIer 目線です。) 詳細は資料を参照してくださいね。 こちらが 9/22 の AngularJS リファレンス出版記念会の資料です。 今後の Web 開発の未来を考えて angularJS にしました 他社にて 講演したときの資料です。 今後の Web 開発の未来を考えて angular js にしました(拡大版) マルチプラットフォームとしての

Androidやってる人でChromeDevtoolsのRemote DebuggingとScreencasting知らない人は使ってみた方がいいよ！ 2013/10/30 に「Frontrend x Chrome Tech Talk Night Extended」が開催され、Addy 氏、Jake 氏、Paul 氏が来日して、最新のモバイル開発のための様々な手法を紹介してくれました。 そこで聞いた内容をもとに、エンタープライズで適用できそうなものを、中立な目線で評価・検証していたのですが、ChromeDevtools のが凄すぎて、終わってみたら ChromeDevtools ばっかり評価・検証していた（おいおい！）という話をします。 ちなみに、Android 開発はほとんどやったことはありません。 あうあう。 これの記事はFrontrend Advent Calendar 2013の

最近、私の中で Backbone.js と共に注目の Jasmine のドキュメントを和訳しました。 本家のドキュメントはこちらです。 和訳したものはこちらです。 （もし、訳で怪しいところがあればご指摘ください。） http://mitsuruog.github.com/jasmine/ ちなみに Jasmine は Javascript のテスティングフレームワークの 1 つです。 他のフレームワークを満足に扱ったことがないので、あまり偉そうなことは言えませんが、特徴として次のようなことを挙げておきます。 standalone 版（JS ファイル）があり、ブラウザのみでテスト実行と結果の確認ができる。 テストケースのネストが可能、（Java で言うことの）setUp、tearDown 機能がある。 豊富な matcher。 Mock（Spy）が割と簡単に作れる。 jasmine-jque