【eLV勉強会】AngularJSでのモバイルフロントエンド開発本資料は「ITエンジニア勉強会~ Engineer’s Learning Vesper」での発表資料です。 http://learningvesper.doorkeeper.jp/eventsRead less
AngularJSアンチパターン集 - Qiita
（150522追記）本稿の続編としてAngularJSモダンプラクティスを掲載しました。本稿は2014年9月に執筆し、情報がかなり古くなっています。続編では、AngularJS 1.4やAngular 2に関する情報をまとめ、入門者への新鮮なチュートリアル、熟練者の移行手引として作成しました。どうぞご覧ください。 この記事は記録のため残します。 AngularJS歴1年の筆者による個人的なAngularJSアンチパターン集です。自分のための戒めとメモを兼ねています。個人差があると思いますので、参考程度に。 また、筆者はTypeScriptで書いています。 Components ComponentsのDI数が6以上になる 危険度★★★ angular.module('myApp') .service('FooService', [ '$q', '$resource', '$rootScope
Speeding up AngularJS apps with simple optimizations - pirosikick's diary
Speeding up AngularJS apps with simple optimizations ng-newsletterで流れてきて結構いい記事だったのでメモ。 基本的には、$$watchersを減らして、$digestの負荷を下げましょうとのこと。 One Time Binding Syntax {{ ::value }} 1.3.0からの機能。 {{ ::value }}と書くと最初の1度だけバインディングされ、後は$scope.valueが更新されても{{ ::value }}は更新されない。バインディングされた後は監視から外れるので、$digest時の負荷が下がる。 <!DOCTYPE html> <html ng-app="app"> <body> <div ng-controller="MainCtrl"> <h1>{{ title }}</h1><!-- ボタンを
Angular Classy
Angular's controllers are super-simple which is fantastic for getting started (they're just functions). Because they are just functions, there's lots of different ways to write Angular controllers. This is powerful but can also lead to a lack of structure, especially when many people (with many different coding styles) are working on the same codebase. It can be helpful to have something a little
"note"がAngularJSでどうやってSEO, Open Graphの対応をしているか｜和田 晃一良｜note
noteはAngularJSを使って、ブラウザで描写しているこの"note"というサービスはAngularJSを使って、JavaScript側（つまりブラウザ側）でノートの中身を公開しているみたいなのです。 それはブラウザでソースを見てみるとわかります。 例えばhttps://note.mu/sadaaki/n/nd921f3f7c635のノートのソースをChromeで見てみると・・・ まずhtmlタグにng-appのプロパティがついています。これはAngularJSを使うならば必要なプロパティで、ここからnoteはAngularJSを使っているんだなあと分かります。 AngularJSは簡単に言うと、サーバー側ではなくブラウザ側でHTMLを描写する仕組みです。これを利用するとどんな利点があるのか。僕の理解している範囲内だと、サーバー側はベースとなるHTML（上のソース）と各ノートのJSO
Angular + Rails with no fuss - Sébastien Saunier
I haven't been satisfied with the way my front-end code (mainly based on JQuery) has grown with my previous rails app, so I took the time to sit and explore the great front-end framework we now have. I still like handling the routing in Rails with several pages, it feels wrong to move that logic to the javascript layer. I don't want to build a single-page application. But having some canonical way
angular translate - i18n for your Angular apps, made easy.
What? angular-translate is an AngularJS module that makes your life much easier when it comes to i18n and l10n including lazy loading and pluralization. Features It provides components like filters and directives, asynchronous loading of i18n data, full pluralization support through MessageFormat and much more! Flexibility angular-translate is very flexible. You can build your own loaders, storage
AngularJS のデータバインドを支える $apply - AngularJS Ninja Blog
データバインドが効かない？！ AngualrJS を使っていて楽しいのは超ラクチンなデータバインド。なのに、そのデータバインドで以下のような困ったことに遭遇しているとしたら、それは $apply を学ぶときが来ているということ。 データバインドが効かないぞ？！ データの反映が次のイベントまで遅れてる気がする？？ こういうときは $apply の出番だ。$apply を使う必要があるケースというのは、ざくっと言うと AngularJS が知りえないところでイベントが起こっているとき。$apply で AngularJS に変化が起きていることを伝え、後のことは任せることができる。 $apply が必要ないケース 整合性を維持するための dirty checking（$watch）処理は、$digest ループ（サイクル）でまとめて実行される。この $digest ループが始まるきっかけは、『
AngularJSとRails4を組み合わせる - ワザノバ | wazanova
https://shellycloud.com/blog/2013/10/how-to-integrate-angularjs-with-rails-4 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約4時間前 Railsアプリのホスティングサービスを提供しているShelly Cloudがブログで、フロントでAngularJS、バックエンドでRails 4を採用するときの留意点について、まとめています。使用しているコードサンプルはこちらになります。 1) Building a JSON API in Rails RailsでAPIをいちから作ってみる。angularjs-rails-resourceのようなライブラリを使うときは詳細が違ってくるが、考え方は概ね同じ。 Routing namespace :api
AngularJSのMVWパターンを理解する - Qiita
12/4の記事（AngularJSを使ったWebアプリのアーキテクチャ設計）で書くと言ったまま放置していたので、AngularJSのMVCパターンについて書いてみたいと思います。 AngularJSのMVCについては、12/19のお前のAngular.jsはもうMVCではない。と言われないためのTutorialというすばらしい記事がありますが、本記事ではもう少し抽象的な内容を扱ってみようかと思います。 MVW（Model-View-Whatever）パターンとは MVCパターンには、MVC2、MVP、MVVMなど数多くの派生パターンがあります。 目的は同じなのに派生パターンがたくさんあるのは、それぞれのプラットフォーム固有の問題（フレームワークの違いや、サーバサイドかクライアントサイドかの違いなど）によってMV*の*の役割が異なるからです。 AngularJSは公式ページで"Superhe
AngularJSをはじめる前に#AngularJS入門その1 | DevelopersIO
AngularJSをはじめよう ここにあるように、最近はWebアプリを作成する際にJavaScriptのフレームワークを使用するのが当たり前といっていいくらい、 さまざまなフレームワークが存在します。 弊社ブログでもember.jsの記事等、JavaScriptのいろいろなライブラリ・フレームワークを紹介していますが、 私が近頃AngularJSを使用する機会があり、とても使いやすかったので、改めてここで紹介しようと思います。 AngularJSとは もう一度「AngularJSとはなにか」という部分を簡単におさらいを。 AngularJSはGoogleとコミュニティより開発しているオープンソース(MIT)のJavaScript用MVWフレームワークです。 テンプレート言語としてHTMLを使用できたり、双方向データバインディングやDI(依存注入)が使用できたりと、 近年複雑化するWebアプ
AjaxアプリケーションのSEOについて調べてみた | keisuke tsukayoshi
Backbone.jsやEmber.js、AngularJSなどの流行りのMVCフレームワークを用いたAjaxアプリケーションのSEOについて少ししらべてみました。SEOというかクローラー対策っぽいですが。ブログ的には始めての開発系の記事。 AjaxアプリケーションのSEO的な問題 そもそもどうしてAjaxアプリケーションがSEO的にやばいかというと、一旦空のHTMLを読み込んだあとJavaScriptを使ってクライアントサイドでコンテンツをレンダリングする仕組み上、Googleのクローラーのような特殊な環境だと内容を正常に読めないというのが現状らしい。というわけでこれを如何にして読み込ませるかが本件のゴールになります。 STEP1:Ajaxアプリであることをクローラーに伝える #!(ハッシュフラグメント)をURLにつける URLに#!(ハッシュフラグメント)が含まれているとクローラーはそ
ygoto3.com
現在開発担当している AbemaTV で、昨年末にパナソニックさんのスマートテレビ VIERA 向けにアプリケーションをリリースしました。AbemaTV リモコンボタンで AbemaTV にアクセスできます。今回このアプリケーションの UI を開発するにあたって、新しいデザインワークフローを導入しました。 本記事では、 Story-Assured Design というデザインワークフローを、現在プロダクト開発で直面しているデザインの課題とともに紹介します。 Story-Assured Design とは？ Story-Assured Design はその名前が示しているように、ユーザーストーリーを保証することを目的とした UI デザインのワークフローです。UI デザインを３つのステップに分けて行います。 ストーリーデザイン デザインの構造化 視覚情報デザイン 一番重要なユーザーストーリーの
angularjshub.com
Virgin Coconut Oil in Ayurveda: Ancient Wisdom Meets Modern Wellness Ayurveda, the ancient Indian system of medicine, has been harnessing the power of natural remedies for centuries. One such gem from this ancient tradition is Virgin Coconut Oil. In recent years, this traditional elixir has gained immense popularity in the modern wellness world. Let’s explore how Virgin Coconut Oil aligns with Ayu
AngularJS コードの構造化 | DevelopersIO
複数人で AngularJS を利用した Web アプリケーションを構築するときに必要なルールをまとめてみました。 ( あくまで策定中のルールであり、今後も改変する可能性があります。また、ベストプラクティスを謳うものではありません ) 使用 AngularJS のバージョン angular.js 1.2.5 angular-route.js 1.2.5 参考サイト Dan Wahlin's Blog | Structuring AngularJS Code http://weblogs.asp.net/dwahlin/archive/2013/12/01/structuring-angularjs-code.aspx GitHub | mgechev / angularjs-style-guide / README-ja-jp.md https://github.com/mgechev/a
AngularJS 勉強会のまとめ (動画・スライド) #ng_jp | Engine Yard Blog JP
AngularJSの勉強会に参加して来ました。300人の定員があっという間に満席になるという事で注目の高さが伺える勉強会でした。参加者も発表の内容もバラエティに富んでいてこれから大きな飛躍があるであろう事を期待させる盛りだくさんの内容でした。 今回はEngine Yardから懇親会のスポンサードをさせて頂くと同時にPHPとAngularJSの連携のLTや動画の撮影を行ってきましたので紹介させて頂きます。 ng-mtg#4 AngularJS 勉強会 | 集客ならイベントアテンド http://atnd.org/event/E0021975/ ng-mtg#4 AngularJS 勉強会 #ng_jp - Togetterまとめ http://togetter.com/li/598391 AngularJS 20min @naoya_itoさんによるAngularJSの入門講座。おなじみの
AngularJSリソース一覧 - Kazzzの日記
AngularJSはその規模としてはかなり大きい部類に入ると思うが、そのわりにはリソース(特に日本語)が少ないので学習するのには苦労する。 そんな中私が参考にしているリソースを紹介しておく。 (重複ご容赦) リファレンス 本家。何はなくともまずはここから。 AngularJS ― Superheroic JavaScript MVW Framework angular/angular.js · GitHubリポジトリ AngularJS: API Reference 非公式だがリファレンスの邦訳をされている方がいらっしゃる。とても有難い AngularJS 1.2 日本語リファレンス | js STUDIO @tomof アドオン、拡張用ライブラリィ 一緒に使うと色々捗るもの。ものによっては殆ど必須のものもある。 Bootstrap (CSSのフレームワーク、私は一緒に使っている) Ang
AngularJS を本気でつかうための tips - tokuhirom's blog
最近、管理画面で AngularJS をつかってみている。 そんな中で、いくつか工夫した点があるのでそれをシェアさせていただきます。 XHR のエラーを表示する XHR のエラーがおきた際のハンドリングをいちいち手でかくのは非効率。管理画面とか中の人しかつかわないので、エラーがおこった旨を随時報告するだけでよい。 そんなケースでは以下のようにする。 angular.module('myapp.exceptionHandler', []) .config(['$httpProvider', function ($httpProvider) { $httpProvider.interceptors.push(function($q, $log, $rootScope) { return { 'responseError': function(response) { $log.error(res
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - tama3bb/angularjs-styleguide: AngularJS styleguide for teams
http://blog.asial.co.jp/1249