20160305 フロントエンドカンファレンスのメモ - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? すごく良かった！！ まとめると TypeScript, Angular2, BEM, Sass, gulp 使って開発しろっていうカンファレンスでした。 Are you a Designer or an Engineer? twitter.com/yamasy1549 http://yamasy.info NIT, Akashi College 2nd grade 17歳 スライド http://www.slideshare.net/yamasy1549s/are-you-a-designer-or-an-engineer ハッカソンに
Falcor入門 1日目 Falcorとは何者か - Qiita
はじめに 最近、ある程度の時間を割いてFalcorを触っています。 まだ日本語での情報は豊富とは言えない状況ですし、自分の理解を整理する意味も含め、何回かに分けてFalcorについて書いていきます。 1日目の今日は「Falcorとはどのような目的のために生まれ、どのような仕組みに依存しているのか」を説明します。 概念的な話ばかりでコードは殆ど出てきません。実装寄りの話は次回以降に書きますが、行ったり来たりしながら読むのも有りじゃないかなと思います。 ちなみに次回以降の目次はこちら： Falcor入門 2日目 FalcorのJSON Graphに触れてみる Falcor入門 3日目 Falcor Routerでサーバサイドを実装してみる Falcor入門 4日目 FalcorとReactを組み合わせる Falcorとは何者か 昨今、Webアプリケーションの大半は、ReactやAngularな
Angular 2でCSSアニメーションを書く - Qiita
どうも、らこです。 Angular 2の勉強会で出た質問でアニメーションのことがあったので、試してみたら問題なく動いたので使い方を紹介します。 はじめに Angular 2のメインパッケージに含まれているのはangular2/animateモジュールです。これはもう実用段階のAPIです。 それとは別に、ngAnimateというプロジェクトも動いており、これはアノテーションベースでアニメーションを宣言的に記述できるようにしようというものです。まだ全然出来てないのでいまは使えませんがデザインドキュメントはみることができます。 Animations for Angular 2 Beta - Google ドキュメント 今回紹介するのは前者の今使える方です。 完成形 マウスオーバーで背景を指定された色に変更するアニメーションが動くディレクティブを書きました。 いろいろごちゃ混ぜですが動くサンプルは
React/Redux苦労話 2015 - Qiita
この記事は、React.js Advent Calendar 2015の24日目の記事であり、 8月よりReactとReduxで既存システムの置き換えを行った、私の苦労話です。 簡単に対象のシステムを紹介するとこんな感じです。 約50機能のシステム PCブラウザで見ることが前提 サーバサイドも置き換えをする(実装言語はGo) フロントもサーバサイドも自分がやる この記事には以下の内容は含まれません。 Reactの使い方 Reduxの使い方 すごくかっこいいこと それでは全ての始まった8月より始めます。 8月 その前にReact/Reduxを選んだわけ みなさんご存知の通り、React以外にも、UI向けのライブラリはいくつかあります。今回もReact以外にAngularJS、Angular2、Mithril、Riotが候補に上がっていました。 しかしAngularJSはAngular2が発表
日本語訳：Angular 2 Change Detection Explained - Qiita
こんにちは、らこです。 この記事はPascal Precht氏によるAngular 2 Change Detection Explainedを日本語訳したものです。 Angular 2を使う上で必修ともいうべき Change Detection に関する貴重な資料なので、許可をもらって日本語に訳しました。Thank you, Pascal! けっこう長いので、先に要点だけ書いておきます。できれば全部読んで、原文も読んで、スライドも見てください。 レンダリングとはモデルをDOMに可視化することである Change Detectionとはモデルの変更を検知し、UIに反映することである モデルの変更を引き起こすのは常に非同期的な処理の結果である Angularはあらゆる非同期処理の後にChange Detectionを行う(Zoneを使って) 変更を検知する際にはオブジェクトの参照が変わったかど
その使い方はもう古いかも？AngularJS老化チェック（ディレクティブ篇） - Qiita
const app = angular.module("app", []); class MyAppCtrl { } app.component("myApp", { template: `<greeting name="'World'"></greeting>`, controller: MyAppCtrl }); class GreetingCtrl { get upperName() { return this.name.toUpperCase(); } } app.component("greeting", { bindings: { name: "=" }, template: `<h1>Hello {{$ctrl.upperName}}!</h1>`, controller: GreetingCtrl }); angular.bootstrap(document.body, [
AngularJSのngRepeatを"ちゃんと"理解する. - Qiita
はじめに 皆さん、AngularJS使ってますか？ Angularといったら、/^\s*([\s\S]+?)\s+in\s+([\s\S]+?)(?:\s+as\s+([\s\S]+?))?(?:\s+track\s+by\s+([\s\S]+?))?\s*$/ですよね. /^\s*([\s\S]+?)\s+in\s+([\s\S]+?)(?:\s+as\s+([\s\S]+?))?(?:\s+track\s+by\s+([\s\S]+?))?\s*$/がない開発なんて有り得ない！ ......... ...... ... 無駄な前フリはこの辺にしておこう. 冒頭の正規表現は、AngularJSのngRepeatDirectiveのコードから引っ張ってきている. そう、AngularといえばngRepeat, ngRepatといえばAngularといっても過言でないほど、Angular開発
AngularJSでGoogle Analyticsなどをいい感じで扱えるようにするAngulartics - Qiita
AngularJSは仕組だけじゃなくて、モジュールも素敵なんだけど、でもあまり紹介されないから悲しい大橋です。 今回はAngularJSでGoogle Analyticsなどをいい感じで扱うAngularticsの紹介です。 どうなる？ わざわざJS側で_gaq.push(['_trackEvent', 'btn','click'])とか書かなくても <button id="btn" analytics-on="click" analytics-event="click">と書けばイベントトラッキングしてくれます。 また$routeを使っていても自動で擬似ページ遷移をトラッキングしてくれるようになります。 ちなみにデモサイトがあって、そこをDeveloper Consoleを開いて、見て触っていただくとどんなもんかわかると思います。 またAngularticsはGoogle Analyti
Angular2のDIを知る - Qiita
どうも、@laco0416です。本アドベントカレンダーでは3回目の投稿です。 Angular2のDIを知る 今回の目標は「Angular2のDIを知る」ということで、まずは基本的なところからおさらいしていきます。 Angular2のDIの使い方 まずは一番単純なDIの使い方を解説します。そもそもDIとは…という話になると複雑になるので省きますが、Angular2においては「 Providerから提供されているインスタンスを特定の変数にInject（注入）する仕組み 」のことを指します。 Provider と Inject の2つの関係は重要なので頭に入れておきましょう。 Injectされる側 今回はFooServiceというクラスのインスタンスがDIで注入されるようにします。以下のコードではsay()メソッドを持つFooServiceクラスをexportしています。
Redux入門【ダイジェスト版】10分で理解するReduxの基礎 - Qiita
ReduxのGithubドキュメントを基に入門用記事として書いたものを、簡潔にまとめました。 もと記事はこちらです。 Redux入門 1日目 Reduxとは Redux入門 2日目 Reduxの基本・Actions Redux入門 3日目 Reduxの基本・Reducers Redux入門 4日目 Reduxの基本・Stores Redux入門 5日目 Reduxの基本・Data Flow Redux入門 6日目 ReduxとReactの連携 Reduxとは Reduxは、ReactJSが扱うUIのstate(状態)を管理をするためのフレームワークです。Reactではstateの管理するデータフローにFluxを提案していますが、ReduxはFluxの概念を拡張してより扱いやすく設計されています。 Reduxはstateを管理するためのライブラリーなので、React以外にもAngularJS
Angular 2 @Inputのアレコレ - Qiita
おはようございます、@armorik83です。今回はAngular 2の特徴的なAPIのうち@Inputを取り上げます。 本稿執筆時点での最新バージョンはAngular 2 alpha.48なのですが、ビルドが通らない致命的な問題があったため、仕方なくalpha.47で動かしています。@Inputについてはa47, 48で破壊的変更はありません。 【追記151226】Angular 2 beta.0に対応しました。 @Inputとは @Input (Docs) は、Angular 2のComponentに属性を定義するAPIです。つまり、HTMLでの独自の要素に対して独自の属性を持たせることができます。
Electronアプリ開発で設計に失敗した話 - Qiita
この投稿は Electron Advent Calendar 2015 の14日目の記事です。 最近、実験的にElectronを使ってOSX用のアプリケーションを開発していました。 あくまでも次に作るためのアプリケーションのための実験なので 地雷は喜んで踏みつける 技術的におもしろいことをやる 失敗しても泣かない の精神です。 ちなみに結果は見事に失敗してます。 設計 大枠として上記のような設計にしようとしていました。 主に3つのレイヤーを作り、それぞれはEventEmitterでやりとりを行います。 1. Applicationレイヤー アプリケーション全体を管理するレイヤーです。 もろもろの初期化や、Electronの独自部分（メニューとか）の操作を行います。 2. Domainレイヤー DDD的な意味のドメインレイヤーです。 ここで言うユースケースはクリーンアーキテクチャで言うユース
HaxeとReact - Qiita
HaxeからJavaScriptを出力するというのは、静的型付き言語が好きだとか、JavaScriptはそれほど好きではないがWebコンテンツは作りたいという人にはとても良い選択肢だと思います。 とはいえ、HaxeはTypeScriptほどJavaScriptに近くないので、HaxeとJavaScriptライブラリの相性というのはとても悩ましい問題です。jQueryを使うとHaxeを使ううまみが減るとか、変数名に"$"が使えないのでAngularJSが使えないだとか、そういったことです。 悩んだ結果、Dynamic型やuntypedキーワードを使って動的言語的な書き方をしてライブラリを使うか、もうJS製のライブラリを使うのをあきらめてgetElementByIdべた書きで頑張るとか、そういった選択を迫られてきました。 では今、流行りのReactの場合はどうでしょう？ 実際につかってみた感想
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
$state.goでのパラメータの引き渡し方 - Qiita
angularjsで戻る時に警告を出す。 - Qiita
Angular1とAngular2の非同期処理の違いについて考えた - Qiita
Angular2はいかにしてオブジェクトの変更を監視しているのか - Qiita
AngularJSでフリック検知 - Qiita
AngularJS の Directive のコールバック(isolate scope の &)でパラメータを受け取る方法 - Qiita
AngularUI使い方メモ（UI.Utils） - Qiita
