ハイブリッドアプリ開発でファイルのアップロード、ダウンロードを便利にするプラグインを使うCodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。
AngularJSアプリ開発に役立つ小粒なライブラリ ～ ストレージ／イベント処理／入力値検証
なお、本連載ではAngularJSそのものに関しては解説しませんので、専門書として『AngularJSアプリケーションプログラミング』、姉妹連載「AngularJSではじめるJavaScriptフレームワーク開発スタイル」などを併せて参照してください。 はじめに 本稿では、これまでの回では扱えなかった小粒な――しかし、アプリ開発には欠かせない以下のライブラリを紹介します。 ngStorage：Web Storageを操作するためのサービス UI Event：AngularJS標準で対応していないイベントを監視 UI Validate：独自の検証ルールを定義 対象読者 AngularJSについて基本的な概念を理解している方 AngularJSで利用できる拡張モジュールに興味がある方 AngularJSアプリでデータを視覚的に見せる方法を知りたい方 検証環境 この記事では、以下の環境でサンプル
Web開発者が覚えておきたい、よく使うAngularJSのビルトインディレクティブ12選まとめ
連載目次 前回の記事、「AngularJSの理解で欠かせないコントローラーとas記法、データバインディングの基本的な使い方」では、AngularJSのコントローラーとデータバインディングについて紹介しました。今回はAngularJSが最初から持っているディレクティブ（ビルトインディレクティブ）について解説します。 なお、本記事を見て実際にサンプルを動かしたい場合は、以前の連載記事（第1回、第2回）を見て環境を作成しておきましょう。 AngularJSのビルトインディレクティブとは 以前の記事で解説しましたが、AngularJSではHTMLを拡張する仕組みが提供されており、これを使用して作成された機能を「ディレクティブ」と呼びます。 AngularJSには、デフォルトで多数の便利なディレクティブ（ビルトインディレクティブ）が用意されています（※以前使用した「ng-app」「ng-model」
AngularJSの良質なサンプルサイトAngularJS Hubが登場
AngularJSは個人的にかなり注目しているフレームワーク(FW)です。世に出ているFWとしては新しい方の部類ですし、今現在話題になっているFWです。AngularJSを利用すると動き(チェックボックスだとかフォームだとか)を必要としたWebサイトが簡単に作れます。ある程度動きを持たせるだけならjQueryだけでもOKですが、上手く機能をモジュールかできつつ、HTMLをテンプレート化できるので、開発がかなり楽になるFWだと思います。 AngularJSがどういうものかを知るには以下のサイトが良いかと思います。 日本語の良質な解説資料 Angular.jsのここがアツい！！ - Nayuta Works AngularJSのスゴさが伝わるデモ - 64p.org 自分は1つ目リンクのスライドと公式サイトでどういうものかを知り、まずはちょっと使ってみることにしました。使ってみてその威力（特に
Phoenix + AngularJS で Markdown 同時編集ツールを作ってみる - Qiita
Phoenix + AngularJS で Markdown 同時編集ツールを作ってみます。 イメージとしては HackMD のようなものを目指します。 ことの始まり ElixirConf 2015 のタイムラインを眺めていたら、 I'm collaboratively editing a doc with 60 of my closest @ElixirConf friends. #phoenixframework pic.twitter.com/PlVexa3Anx — David Raffauf (@draffauf) 2015, 10月 1 Phoenix で同時編集ツールを作っている人がいて、「こういうのって自分でも作れるのかな」と漠然に思ったのがことの始まり。 完成イメージ 結論、こういうツールができました。 GitHub で公開しています。 collabo_marker :
AngularJSでマテリアルデザイン風のページ遷移アニメーションを作ろう | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。 6月から役職が変わりフロントエンドリーダーからCTOになりました、先生です。 もうAngular1.4にアップデートしましたか？ Angular1.4になりマテリアルデザインを意識したアニメーション関連の変更や実装がおこなわれました。その分Breaking Changesもあるのでアップデートには注意する必要があります。 今日はそんなAngularJS 1.4を使って、マテリアルデザイン風にページ遷移するアニメーションを作ってみたいと思います。 今回のデモ デモは下記リンクになります。 各メンバーをクリックするとスムーズにアニメーションして詳細ページに遷移します。まずは触ってみてください。 http://frontainer.com/ligblog-sample/angular-morphing-animation/#/ 必要なもの AngularJS1.4 – https:
AngularJS1.4とbindToController - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? こんにちは。imaiです。待望のAngularJS1.4がリリースされましたね。Directive関係では、bindToControllerの機能が向上しました。 このbindToControllerとは一体何なのか。使って嬉しいことは何か。どう機能が向上したのか。について書いていきます。また、最後に自作Directiveを作っていく際に筆者がよくつまずく点を記しておきます。 この記事の対象者:AngularJSに触れたことがある、自作のDirectiveを作ったことがある #bindToControllerとは AngularJS公式
CodeIQについてのお知らせ
2018年4月25日をもちまして、 『CodeIQ』のプログラミング腕試しサービス、年収確約スカウトサービスは、 ITエンジニアのための年収確約スカウトサービス『moffers by CodeIQ』https://moffers.jp/ へ一本化いたしました。 これまで多くのITエンジニアの方に『CodeIQ』をご利用いただきまして、 改めて心より深く御礼申し上げます。 また、エンジニアのためのWebマガジン「CodeIQ MAGAZINE」は、 リクナビNEXTジャーナル( https://next.rikunabi.com/journal/ )に一部の記事の移行を予定しております。 今後は『moffers by CodeIQ』にて、 ITエンジニアの皆様のより良い転職をサポートするために、より一層努めてまいりますので、 引き続きご愛顧のほど何卒よろしくお願い申し上げます。 また、Cod
もうすぐリリースされるAngularJS 1.4の機能を先取りチェックしよう
対象読者 AngularJSを使っている開発者 JavaScriptのフレームワークの動向などに興味を持っている方 必要な環境 この記事では、AngularJSを使用し、Chrome（42.0）、IE11、Firefox（37.0）、Safari（8.0.4）の環境にて確認を行っています。 バージョン1.4では何がかわるのか バージョン1.4での大きな特徴として、以下の変更がある予定です。 新しいRouter機能（ngNewRouter） より柔軟なクッキー機能（$cookies） $parseや$compileのパフォーマンス改善 $httpサービスにおけるパラメータシリアライズ方式の柔軟性強化 ICU MessageFormatに対応したAngularJS式の利用 基本的には過去のソースコードが動かなくなるような変更はあまりなく、内部ハックをしているような開発者を除けば、既存のソースコ
AngularJSモダンプラクティス - Qiita
Help us understand the problem. What is going on with this article? こんにちは、@armorik83です。私のAngularJS歴は2年弱で、これまでAngularJSに関する記事はQiitaにたくさん書いてきました。例えば次のような記事です。 AngularJSアンチパターン集 2014.9 ここらでDirective Scopeの@=&をまとめておきたいと思う 2014.9 TypeScriptで書くAngularJSのMVC 2014.2 AngularJS Directiveの処理順を網羅してみた 2014.12 他にもニッチなものやイマイチだったものも含めてけっこうな数となってきました。また、こういった記事の縁で勉強会でも登壇させて頂きました。 モダンAngularJS 2014.12 GDG中国 TypeScr
pairsでのAngularJS x TypeScript x e2e ＠めぐすた#1
3. Copyright © 2009-2015 eureka, inc. All rights reserved. なまえ Takuma Morikawa しょぞく たんとう （Go, JS, たまにインフラ） じこしょうかい 5. 株式会社エウレカ 専門分野以外の領域 でも活躍できる エンジニア! 50人 非エンジニア! 25人 事業内容 自社サービスの企画・開発・運営 ・ オンライン・デーティング・サービス「pairs」 ・ カップル専用アプリ「Couples」 海外拠点 ・ 唯麗家股份有限公司（台湾） ・ EUREKA SG Pte. Ltd.（シンガポール） 社員数: 75名 インターン・業務委託含む 7. オンライン・デーティング・サービス「pairs」 12年9月 13年3月 13年9月 14年3月 14年9月 15年3月 225万 ｡ﾟ+＼200万会員突破/／+.ﾟ リリー
なんだかんだで SPA から jQuery に戻った話 - ボクココ
最近は SPA とか React といった話題が尽きないが、自分は結局 フロントエンド JavaScript は jQuery が最もいいと感じている。それはそれら SPA の JavaScript をいじった経験を踏まえての感想。 理由としては、「 やりたいことができにくい 」これに尽きる。 最新を追うということ 自分が最初にSPAを触ったのは AngularJS だった。なるほど、この ng-repeat や $route, $scope などを使えば、今までサーバサイドでやってたようなレンダリングが表側で制御できるようになる！と感動したものだった。この気持ち良さはきっとサーバーサイドでごにょごにょやっていた経験のある人ならなおさら感動するものだ。 さて、じゃあといって「次作るのは SPA のサービスにしよう！」と意気込んで初めて見たとする。それで作っただけで話題になるし、エンジニアと
Codecademyに、AngularJS入門コースが公開されたのでやってみた！
HTML/CSS/JavaScriptなど、基本的なWebプログラミングの基礎を学習できることで知られる「Codecademy」に、新しく「AngularJS入門コース」が公開されていたのでご紹介！ 一通り学習すれば、AngularJSを使って簡単なWebアプリを1人で作れるようになりますよ。 どんなコース内容なのか？Codecademyは、以前からJavaScriptやPHPの基礎、WebAPIを使った練習からRailsなどを使った「インタラクティブなWebアプリ」を作れるコースが増えていました。 そして、人気のAngularJSが追加されたことで、さらに幅広い学習へ挑戦できるようになったと言えるでしょう。 「START」ボタンをクリックすれば、すぐにでもブラウザ上から学習を進めていくことができます。 学習は、お馴染みの専用エディタを使い、1つずつ小さな課題をクリアしていくことで学べるよ
Web Audio API+AngularJS
var request = new XMLHttpRequest(); request.open('GET', myURL, true); request.responseType = 'arraybuffer'; request.onload = requestLoad; request.send(); function requestLoad() { // yay, finally done loading _audioContext.decodeAudioData(request.response, doneDecoding); } function doneDecoding(buffer) { // yay, finally done decoding playBuffer(buffer); } function playBuffer(buffer) { var bufferSou
噂のAngular 2をのぞき見る！ーng-japan 2015
この記事は、Angularをテーマとした日本初のカンファレンス 「ng-japan」のイベントレポート（第5回目）です。 はじめに Angular 2の発表があり、大きく様変わりするのではないかと懸念され、話題にもなりました。そして、AtScriptからTypeScriptへの変更など、話題にことかかないAngular 2ですが、彼らがなぜ、そのような変更を行っているのかが理解できるセッションとなりました。 Angular 2 – Igor Minar Angularは、私たち開発者のWebアプリ開発の手法を変え、生産性を向上してくれました。今度は我々のニーズに合わせて、Angularが変化をする番です。このセッションでは、何が変わり、なぜそのような変更が必要なのかをお話します。 まずは、Angular 2の3つのポイントについて。 なぜAngular 2を作ることにしたのか Angula
AngularJSで外部APIコールをキャッシュする - Qiita
'use strict'; angular.module('apiTestApp') .factory('JsonData', ['$http', function ($http) { return { getSampleData: function () { return $http.get('data/sample.json', {cache: true}) .success(function(data, status, headers, config) { return data; }); } } }]) ; きちんとキャッシュされているか否かは、Chrome の Developer Tools で確認できます。 2回目以降はAPIコールがされなければOK（後述しますがキャッシュ先はヒープメモリなので、ブラウザをリロードするとキャッシュは消えてしまうので注意）。 もしキャッシュの挙動
【古い内容です！！！】Angular 2 を試してみた感想とハマりどころ - Qiita
Angular 2 alpha.11, alpha.13 時点の情報です。現時点の最新版とは全く異なる内容です。現在では公式サイトのドキュメントが充実しているので、そちらを参照することをおすすめします。 昨日参加してきた ng-japan の間、Angular 2 の 5 Min Quickstart という Hello World 的なサンプルから始めて、貧弱な TODO アプリを作ってみました。感想と、その過程でいろいろハマったところを書いてみます。 感想 まずは感想から。 別のフレームワーク？ やっぱり Angular 1.x とは別のフレームワークだなあという印象です。概念も書き方もツールも違う。ライブラリもそのまま使えない。Angular とは別の名前にした方がいいのでは、というくらいです。 現時点では、他のコンポーネント志向のフレームワークに乗り換えてもコストは同じな気がします
AngularJSのディレクティブ機能でHTMLテンプレートを使いこなそう
はじめに AngularJSでは最初から多くのディレクティブ機能が備わっています。このディレクティブ機能を使ってHTMLテンプレートを記述していきますが、慣れないとどのようなディレクティブがどのような動作をするのかがわからなく、リファレンスとコードを行き来することになります。 また、リファレンスでは用途ごとの整理されているわけではないので、分かりにくい一面もあります。そのため、今回は基本的なディレクティブ機能と制御に関わるディレクティブ機能に限定し紹介します。 対象読者 jQueryなどを使っている開発者 JavaScriptを使った複数人でのプロジェクトに参加している方 JavaScriptを使ってサーバ等と連携したフロントエンドの開発をしている方 必要な環境 この記事では、AngularJSを使用し、Chrome（39.0）、IE11、Firefox（35.0）、Safari（8.0.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
AngularJSのDOMイベント処理と注意すべきディレクティブを知り、HTMLテンプレートを使いこなそう
イベント駆動AngularJS / 今から書くAngular 2.0
