Developer Data Modeling Mistakes: From Postgres to NoSQL
One page app with AngularJS
1. ONE PAGE APP WITH
adam.stipak@gmail.com | @new_POPE
2. WTF, WHICH TOOL I NEED ???
Backbone.js
Ember.js
Google Closure
Spine
jQuery (non FW)
Este.js (Is it not dead? ;-))
...
No thanks, AngularJS is cool ;-)
4. BOOTSTRAPPING
Step 1:
<citsc"i/saglrmnj"<srp>
srp r=lbj/nua.i.s>/cit
Step 2:
<tln-p>
hm gap
Result:
{12}i 3
{+} s
I'm using this way (RequireJS)
vrap=aglrmdl(ap,[*dp *];
a p nua.oue'p' / es /)
aglrbosrpdcmn,[ap];
nua.otta(ouet 'p')
5. MODULE BASED
HTML
<tln-p=mAp>
hm gap"yp"
JS
vrmAp=aglrmdl(mAp,[) / N dp.
a yp nua.oue'yp' ]; / o es
/ Cleto o U drcie.
/ olcin f I ietvs
aglrmdl(uDrcie' [*.*];
nua.oue'iietvs, /../)
vrmAp=aglrmdl(mAp,[uDrcie')
a yp nua.oue'yp' 'iietvs];
6. TEMPLATES
<l
u>
<in-eet"tmi [wb,'lmn' '1'"
l grpa=ie n 'e' eeet, #4]>
{ie}
{tm}
<l>
/i
<dv
/i>
web
element
#14
7. WITH CONTROLLERS
JS
mApcnrle(Tmltsotolr,fnto(soe {
yp.otolr'epaeCnrle' ucin$cp)
$cp.tm =[wb,'lmn' '1';
soeies 'e' eeet, #4]
};
)
Template
<i n-otolr"epaeCnrle"
dv gcnrle=Tmltsotolr>
<pnn-eet"tmi ies>
sa grpa=ie n tm"
{ie}<ml>{idx}/ml>
{tm}sal{$ne}<sal
<sa>
/pn
<dv
/i>
Result
web 0 element 1 #14 2
8. ASYNC TEMPLATES
<i n-iw <- Ol oeo tepg ->
dv gve> !- ny n n h ae -
But, you can use this
<i n-nld=tmltsfohm"
dv gicue"epae/o.tl>
with nested levels ;-)
AngularJS loads the templates asynchronously.