background preloader

Developer Guide: Developer Guide

Developer Guide: Developer Guide
Loading... On this page, you will find a list of official AngularJS resources on various topics. Just starting out with AngularJS? Try working through our step by step tutorial or try building on our seed project. Ready to find out more about AngularJS? Core Concepts Templates In AngularJS applications, you move the job of filling page templates with data from the server to the client. Application Structure Other Features Testing Community Resources We have set up a guide to many resources provided by the community, where you can find lots of additional information and material on these topics, a list of complimentary libraries, and much more. External AngularJS resources Getting Help The recipe for getting help on your unique issue is to create an example that could work (even if it doesn't) in a shareable example on Plunker, JSFiddle, or similar site and then post to one of the following: Official Communications Official announcements, news and releases are posted to our blog, G+ and Twitter: Related:  Angular JSAngularJS

Building a RESTful web service with AngularJS (and PHP) – More power with $resource This is a two parts post about how to make RESTful requests through an AngularJS web application. The index of this brief series of posts is quite simple. Backend setup is the first post in the series. $http or $resource? In all the posts about AngularJS that I wrote until now, every time that it was necessary to make an asynchronous request to the server I used the $http service. $resource is a separate, optional module of AngularJS, built over $http. Start using $resource As I said previously $resource is a separate module of AngularJS; it is defined in the angular-resource.js file, often downloaded with angular.js. To use $resource there are three easy things to do: Include the source file, immediately after the source of angular.js, and ideally just before the end of the body. Include ngResource in the declaration of your web application module. var myApp = angular.module('myApp', ['ngResource']); Inject $resource everywhere it will be used. More on:

Web-Drawing Throwdown: Paper.js Vs. Processing.js Vs. Raphael Advertisement Before drawing anything in a browser, ask yourself three questions: Do you need to support older browsers?If the answer is yes, then your only choice is Raphaël. It handles browsers all the way back to IE 7 and Firefox 3. Raphaël even has some support for IE 6, although some of its underlying technology cannot be implemented there.Do you need to support Android? Paper.js, Processing.js and Raphaël are the leading libraries for drawing on the Web right now. Choosing the right framework will determine the success of your project. All of the code in this article is open source and can be run on the demo page that accompanies this article. Overview It’s all JavaScript once the page runs, but the frameworks take different paths to get there. PaperScript is a JavaScript extension that makes it possible to write scripts that don’t pollute the global namespace. Processing.js is based on a framework named Processing, which runs in the Java Virtual Machine. Getting Started Paper.js: (al)

Understanding Dependency Injection · angular/angular.js Wiki Dependency injection in AngularJS is supremely useful, and the key to making easily testable components. This article explains how Angular's dependency injection system works. The Provider ($provide) The $provide service is responsible for telling Angular how to create new injectable things; these things are called services. myMod.config(function($provide) { $provide.provider('greeting', function() { this. Here we've defined a new provider for a service called greeting; we can inject a variable named greeting into any injectable function (like controllers, more on that later) and Angular will call the provider's $get function in order to return a new instance of the service. myMod.controller('MainController', function($scope, greeting) { $scope.onClick = function() { greeting('Ford Prefect'); }; }); myMod.config(function($provide) { $provide.factory('greeting', function() { return function(name) { alert("Hello, " + name); }; }); }); The one injectable I've skipped so far is constant.

Lessons Learned: A Year with a Large AngularJS Project photo credit: Solo After a year of working with a large AngularJS project, I thought I’d share a few of the lessons that I learned in the process. Firstly, I love AngularJS. It suits my needs exceedingly well, and I expect it will be my goto for the forseeable future when I need a solid framework for “thick client” single page applications. Code Organisation This one is huge. - project -- controllers --- someController.js --- someOtherController.js --- ... --- someController99.js Which lead to a controllers folder that would twist the eyes. Today I’d want to start building my project in a more modular fashion. Cliff Meyers has written a great article on organizing your code in a large Angular app. Directives are awesome and powerful I’m of the opinion now that Directives are the killer feature of AngularJS. One of my favorite aspects of Angular Directives is that they are composable. Know thy framework While I’ve spent some time with it, this is an area I’d like to get more intimate with.

L'API Promise d'AngularJS Les services standards d'AngularJS $timeout et surtout $http renvoient tous deux des promises, qui sont très pratiques pour gérer des opérations asynchrones. Cette notion de promise existe dans d'autres frameworks, comme jQuery, et AngularJS intègre une implémentation de cette API. Elle peut être utilisée par les développeurs dans l'écriture des leurs propres services pour simplifier la gestion des actions asynchrones. Décrire en français le fonctionnement de l'API de promises ne va pas être simple, car il est difficile de traduire de façon élégante les notions qu'elle recouvre sans s'éloigner des termes anglais utilisés comme noms de méthodes. Qu'est-ce qu'une promise ? Une promise (une “promesse” en anglais) est un objet JavaScript correspondant au résultat différé d'une opération asynchrone. Imaginons une fonction qui doit déclencher une opération prenant un certain temps, et qui pourra soit réussir et fournir un résultat, soit échouer et balancer une exception. $q.reject(reason);

Tutorial: Controlling Processing.js with jQuery UI « Joseph Harrington Years ago when I was first learning to code, I stumbled upon Processing and we quickly became great friends. As it often goes though, the years went by and I started hanging out with bigger and more dangerous languages, and Processing and I drifted apart. Every so often I would think back on the good times we had and wonder what he was up to. But recently we bumped into each other on the street! Gladly those days are over with the Javascript- and HTML5-based port of the original language. “But wait!” And the answer is yes. Check out this demo in which I may or may not have gone a bit overboard with sliders… I hope you wasted as much time playing with that as I have. Anyway, enough gushing. Let’s try something a bit simpler and more focused than that kaleidoscopic nonsense up there. Let’s say you want to create some kind of dynamic text visualization. The UI components that will interact with the sketch will be a textbox and a slider. We can break this down into three parts: Alright!

E2E Testing Loading... Note: In the past, end-to-end testing could be done with a deprecated tool called AngularJS Scenario Runner. That tool is now in maintenance mode. As applications grow in size and complexity, it becomes unrealistic to rely on manual testing to verify the correctness of new features, catch bugs and notice regressions. Unit tests are the first line of defense for catching bugs, but sometimes issues come up with integration between components which can't be captured in a unit test. End-to-end tests are made to find these problems. We have built Protractor, an end to end test runner which simulates user interactions that will help you verify the health of your AngularJS application. Using Protractor Protractor is a Node.js program, and runs end-to-end tests that are also written in JavaScript and run with node. For more information on Protractor, view getting started or the api docs. Protractor uses Jasmine for its test syntax. Here is an example of a simple test: Example Caveats

AngularJS - Complex nesting of partials and templates API: API Reference Loading... Welcome to the AngularJS API docs page. These pages contain the AngularJS reference materials for version 1.5.5 material-conspiration. The documentation is organized into modules which contain various components of an AngularJS application. These components are directives, services, filters, providers, templates, global APIs, and testing mocks. Angular Prefixes $ and $$: To prevent accidental name collisions with your code, Angular prefixes names of public objects with $ and names of private objects with $$. Angular Modules This module is provided by default and contains the core components of AngularJS. Use ngRoute to enable URL routing to your application. Include the angular-route.js file and set ngRoute as a dependency for this to work in your application. Use ngAnimate to enable animation features within your application. Include the angular-animate.js file and set ngAnimate as a dependency for this to work in your application.

D3.js - Data-Driven Documents angular-styleguide/ at master · johnpapa/angular-styleguide