A presentation made for the AngularJS-ILl that took place in july 2014 at Google TLV Campus (http://www.meetup.com/AngularJS-IL/events/189970902/)
its an overview angularjs features from an architact perspective.
this slideshow contain a link for reference code.
it`s like marriage...
Choosing a Framework
You used to be in charge.
it`s going to change.
Inversion of control
First, let`s make it clear.
Framework vs Library
A set of function that you call.
Each function does some work, and returns
the control back to you.
You Are in Charge.
Has a behaviour built in.
we plug-in into it, register our classes and the
framework code is calling our
code in a point in time.
You are not in charge.
“ The framework often plays the role of the main
program in coordinating and sequencing
application activity. This inversion of control
gives frameworks the power to serve as
extensible skeletons. The methods supplied by
the user tailor the generic algorithms defined in
the framework for a particular application. “
-- Ralph Johnson and Brian Foote
Let`s see what angularJS
Has to offer
Wear the architect Hat!
I want my application to be able to grow.
I want to add features painlessly.
In angular, we can organized our code into
module objects which can depend on each other.
it`s make our code cleaner and modular.
we can add, replace, update
or even parallel develop
I want to write code that i can reuse.
I want to share components across projects.
We can pack our code in modules and share
them across apps.
Angular components are just POJO`s, we can
which makes our
I want to understand what's going on in my
app just by reading the code.
Angular directives enable us to develop in a
declarative style that is very readable.
Because angular development is done in plain
Declarative code style
Directives enable designers
to develop without
I want to plug-in functionality into existing
Thanks to the concept of root Scope, angular app
can run only in a limited section on the page.
3rd party libraries are welcome.
Play nice with others
We can wrap any 3rd party
library in a directive to keep
our loose coupling to the
I want me and my team to get started quickly
AngularJS embrace web standards, which we
● HTML - used for templates.
● CSS - used for Animations & other internal
inherit from proprietary types. code can be
I want to perform tests with minimum effort
Angular designed to be testable.
Thanks to a good separation of logic from view,
and the dependency injection system,
code can be easily isolated for testing.
Testing is easy
Angular provides us ready
to use mocks to make it
I want to add funcullity to the framework.
I want to replace parts of the components
with my own.
AngularJS built on the concept of directives.
The angular team expose us the same API they
use to develop directives.
Give me your API!
Which means that we can
extend & replace core
Angular packed with a collection of core services.
we can use decorators to wrap them and add
What about services?
We can completely override
core services, or delegate to
I want to choose my own folder structure.
I want to model my data my way.
Angular do not force us to a certain folder
Data models are not predefined.
there are no conventions restricts.
I'm the architect!
Which means that we have
the freedom to choose
what's fits us.
I want to meet and learn from people who
using the same framework.
Not at all! angular is HOT.
Meetups, Forums, LinkedIn groups and much
Are we alone?
And the community take advantage of this to
extend angular and create custom tools.
After all, it`s open-source
The ionic framework is a
I want a variety of learning resources for me
and my team.
Angular documentation has become really
easy to read and understand so it`s a good
place to start.
Choose your media
But thats not all...
Dozens of books have already been written on
My top 3 AngularJS books:
● ng-book by Ari Lerner
● AngularJS Directives by Alex Vanston
● build your own angularJS by Tero Parviainen
Countless videos are out there..
My top 2 angularJS videos sites:
● codeschool - a complete free course
● egghead.io - 127 (and counting) angular lessons
Endless online resources are
there just a click-away..
My top 2 angularJS online sources:
● ng-newsletter - delivered weekly
● ng-learn.org - angular news and more..
● angular blog - useful and contain great links
Grab the code: