Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.
Lightning 3 y/ T{’—«1<y I~$!2’aA7>

~/ ‘/ X‘7l"/ ~

2015/07/30 I5l53=I‘f%‘I‘i7 I2 7 I‘
7_‘7Z7JJlzX/ °~‘/1" ‘J 1 I‘
Ill| l ...
IatL)‘<V)I: 

’l9IEiC%¥i7 I/7 l~¥iP5Jl: 'C
/ :"'E, HHEI’JlZfi1lOit’L‘CI; <’. ’> I: /"/5“? elJ'5‘§%J 'C‘$lJ% b7‘: §5li3l‘C*?...
ZIKEODSITB

12:O0~12:‘l5 ’I"/ l*CI77°/ EI‘/ 

12:15~12:30 HY§|5'E§tf%Il ‘/7l‘'—*‘/  HEW
‘|2:30~'l2:40 lfifi/ ‘—Z| ‘// 'li—3i...
E Eitfiii

«S / JI| |'7’E ($s7EI“bc7>O%>)  ' I
I 2015/o5Ji<i §‘. ‘f 
c Salesforcefi ifi’J3'7H I/ ..; ‘.~. -;. 

I‘ 7l'_'l‘/  ...
2014/10 Dreamforce 2014

i‘}J’§“i% I I

L I G H T N I N G User Interface
Sales Service Marketing Community Analytics APPS
...
Lightning 3 y/ Ti’—a<y I~
U|0)ti7°t’}IztI. ’,&fi$'IFl§

Lightningj ‘/ »T‘<—? > is

3‘/7I‘—? ~> I‘ =  7121‘)? 

E7J7’C)l/ lb...
App Builder

F5 “J 7& l“| II “J 7’C'U| "a‘: l’I5lfi

5”‘)/ “'J—i‘C‘0JB%F'a'i"a3|3E‘37fII< O I: 

G I-Ioon

. ... =.. ... .
...
Aura

JavaEEi‘C“§1lt’I5?‘? oU|7 l/ —/.  7-7
LightningliAuraJ: ‘C“§Jl’I5 b ‘C I. Z>

 

forcedotcom/ aura

https: //github....
airicirt-! %“I~« %: siI*~I. I.r: I*-= :5*§. ’§1+vIII  . 

IIiVI= _IfuI: tIzInI; igIiuginu §'I~*IFE; .'@»IE, fSIiF! '.’: %'...
Let's Handson

http: //9oo. g|/ btQw| e

Salesforce Lightning 3 ‘/7l‘'-»'i<‘/  I‘ 7-:  — l~ U 711»
http: //salesforcedeve|...
l5l%iFa'i7J‘E07EtI. 0)'C“
eanezexefiegao
(aim.  .,  , )

httP= //goo. g|/ btQw| e
§%5='EI 74 ‘y7EX§|5'E%t£%

Quicl<ConI'acI'. i
SearchBar

Rose Gonzalez

 CovIl*acH. i:I'

Sean Forbes
(512) 757—6000

Jack...
Lightning II ‘/7I{—3'r<‘/  I‘ wlfifi

   
  

nasrlvtla 77‘}‘f-"/ !>(l. l¢htnlrI¢ A»/ Ir-pi

     
   
   

controller h
hel...
ApexZl‘/  |~lZl—5—

0 Sa| esforcelE'J0J7"“—’5’lC77tX§"%>i%‘i%la*4lZ? E
0 ApexlE'J0)§QE
I @AuraEnab| ed7/7"'—°/ EI ‘/ 
I st...
—' ctelilili-"9rI| l‘g‘l'rt‘I3l£E’: 
» ii: -;i’uLIiI, 'nrioiIiIl, -,i, 'r, ?7fl*~1.,  A 

<aura: component controller-"Cont...
Template

o <aura: component>

0 imp| ementsE’l$
I force: appHostab| e
0 Sa| esforce10)d‘E"f‘—*‘/ El ‘/ ><: :L—Ffi
I flexip...
Template

- <aura: attribute>

o II‘/7l{—3i<‘/ l~PV. l‘C“$'J}5fi§‘élZl—7J)lz2$E¥5(
0 77'tzX7'3‘7‘£

I Template 2 {! v.<E'l$...
~lillkv; ‘
, - ‘l, “gII‘Il’: ltlE-: If(‘= VJ5P -, -.

/ / template
<aura: component implements= "force: appHostable">

<bu...
Style

0 Il‘/ /‘l‘? —3F‘/ |*P‘J§: ‘l30)X5”f}b
I r. TH| SJ 75X75‘5F; '§9é: "9"%’>Z<‘:7b*4lZ§

-by7Uy7fim: yfi—*yb%? fi%en%
o~y...
Event

v3Vfi—*>hEE%? ét®®&$$
vzéfiaa
F 77'J’J'—DEI‘/ ’f’“/  I‘
r3yfi—*yh4~yh
Vgfififlfimfi
1.4&ybWm
2. 1’/ ‘‘/  l~%f5z(Register)
3...
Event

° 4’“/ l~f’l5EJZ <aura: event> 0 4/“/ hfifi <aura: hand| er>
0 4/“/ hfifi <aura: registerEvent> 0 'f'“/ l~%W Controller...
Event

-4&yh%®fiE

- Fczi lEt4’%§7J'§Fafi7|. / 7 —r v 7:<7fi? :<: tEa“nn2:; L. t_a. !fi
’c*0)7“-*7 am reatgraete L :9“

I *f’“...
Helper

«: yfi—*yhW%®%®fi&
 HelperP§l'C‘lithis‘C*l1¥Z)‘H: '.bE. l’IEiE
<' Contro| leriJ'50)ll¥U“'cl: llJ(0)cB)

F he| per. <...
£’§§5"5«V"»‘, r . _ 

<design: component>
<design: attribute name= "su bject“ labe| ="Su bject" description= " SR3)?  " / ...
- ? ‘/t‘~y77J‘L; /ut“L
I 7 III ‘J Hfilllzijavascripto lé. “’Ll5J75‘/ ‘:'U0D4‘%l2lSt 72%: 
I *7‘~/ ‘—TE'J’(‘parseMfié 116
° 1...
$3267)

«T LightningZl‘J7l‘'—3i‘<‘J l~§l¥§‘C‘3‘7b‘? 
F §¥’é‘(‘§'
«' Aura! l¥= ‘éT‘§'fJ? 
K fis$. '€§‘
I‘ iffil@JE’JFfil§. ’§
...
Nächste SlideShare
Wird geladen in …5
×

Lightningコンポーネント事始め

25.644 Aufrufe

Veröffentlicht am

2015/7/30 フレクト社内勉強会資料

Veröffentlicht in: Internet
  • Sex in your area is here: ❶❶❶ http://bit.ly/36cXjBY ❶❶❶
       Antworten 
    Sind Sie sicher, dass Sie …  Ja  Nein
    Ihre Nachricht erscheint hier
  • Follow the link, new dating source: ❤❤❤ http://bit.ly/36cXjBY ❤❤❤
       Antworten 
    Sind Sie sicher, dass Sie …  Ja  Nein
    Ihre Nachricht erscheint hier
  • Hey guys! Who wants to chat with me? More photos with me here 👉 http://www.bit.ly/katekoxx
       Antworten 
    Sind Sie sicher, dass Sie …  Ja  Nein
    Ihre Nachricht erscheint hier

Lightningコンポーネント事始め

  1. 1. Lightning 3 y/ T{’—«1<y I~$!2’aA7> ~/ ‘/ X‘7l"/ ~ 2015/07/30 I5l53=I‘f%‘I‘i7 I2 7 I‘ 7_‘7Z7JJlzX/ °~‘/1" ‘J 1 I‘ Ill| l '7’E (@mitsuruog)
  2. 2. IatL)‘<V)I: ’l9IEiC%¥i7 I/7 l~¥iP5Jl: 'C / :"'E, HHEI’JlZfi1lOit’L‘CI; <’. ’> I: /"/5“? elJ'5‘§%J 'C‘$lJ% b7‘: §5li3l‘C*? “o
  3. 3. ZIKEODSITB 12:O0~12:‘l5 ’I"/ l*CI77°/ EI‘/ 12:15~12:30 HY§|5'E§tf%Il ‘/7l‘'—*‘/ HEW ‘|2:30~'l2:40 lfifi/ ‘—Z| ‘// 'li—3i<V l*l’l5l55?. &i§% 12:40~12:45 AppBui| der’, ‘l>fl6'>Ii7_<7>I 12:45~12:50 K <‘. '. 39') ° EEEE ‘l2:50~'l 3:00 Efi (X) AyfWym%%%: yv—»Tfim$? o §$mmé$e%$? :t.
  4. 4. E Eitfiii «S / JI| |'7’E ($s7EI“bc7>O%>) ' I I 2015/o5Ji<i §‘. ‘f c Salesforcefi ifi’J3'7H I/ ..; ‘.~. -;. I‘ 7l'_'l‘/ l‘I‘/ l“I‘/ ‘D/ “:7 Salesforce Summer Tokyo 2015 5""E :5! ' / 5/ . 34/
  5. 5. 2014/10 Dreamforce 2014 i‘}J’§“i% I I L I G H T N I N G User Interface Sales Service Marketing Community Analytics APPS o L I <3 H 1' N I N 6 components - Framework - Builder _/ PLATFORM SERVICES Iorce. com - Horoku - Wave sdcsforccltueuixino
  6. 6. Lightning 3 y/ Ti’—a<y I~ U|0)ti7°t’}IztI. ’,&fi$'IFl§ Lightningj ‘/ »T‘<—? > is 3‘/7I‘—? ~> I‘ = 7121‘)? E7J7’C)l/ lb 4’/ ‘> IE7I‘lfCE}§‘s X9‘y073"5Ifi'é Lightning: ‘/7K-$7 FORE http: //www. sIIdeshare. net/ DeveloperForceJapan/ intro-tolightningcomponents-j
  7. 7. App Builder F5 “J 7& l“| II “J 7’C'U| "a‘: l’I5lfi 5”‘)/ “'J—i‘C‘0JB%F'a'i"a3|3E‘37fII< O I: G I-Ioon . ... =.. ... . 17.27.. sso« 7* ~- m 9,00, ‘W "T . ... .D. . _ --2.2 U I . I‘. §TEl j e -. ~. . ,,. .. ..: ... .. . ... _. G. ..” . nu, * g . ... .. u . —w a. .. 9,, .. .., . 5,“ _M M. .. , , r 5.0134 —, .., 5.. ., T aw . . I SO .5 :21 V I: . ,,. ... r . -., u :1 . ,.. . .6 -= 2. $9ma ‘ 3 >1)’ I -1
  8. 8. Aura JavaEEi‘C“§1lt’I5?‘? oU|7 l/ —/. 7-7 LightningliAuraJ: ‘C“§Jl’I5 b ‘C I. Z> forcedotcom/ aura https: //github. com/ forcedotcom/ aura
  9. 9. airicirt-! %“I~« %: siI*~I. I.r: I*-= :5*§. ’§1+vIII . IIiVI= _IfuI: tIzInI; igIiuginu §'I~*IFE; .'@»IE, fSIiF! '.’: %' -. _. ‘I5 : Iy7Ii’—fI= >I~7I/ —A7—’JIi3zt’£1’cI%§i€0>$fi ? »< (7J9Ei€£EI'S'£3iilI3Zl‘/7T‘{—5r1‘/ I~7 I/ —L'7—7lCIQi3:L; ’CL/ Z: <@> I I‘-— '. i»‘; I I Polymer React Lightning Fl ht Brick II. -. »I ‘I II A platform ! I5IililTIIl: !K! )II|9l9)Il§lIli-1’ '6‘9l'€i_5Ei‘1')Ir"7‘| '0'*‘—~‘M; O'4iIiFS3 3lii,0)”I'A'a'I'I'I'lk‘Iml? )-flilillilIE1?‘DismalIu3lill30l((4E)9Ellifl3I-IIlfililiIlliI5(0)IIl9lI)Il= |Ili'I‘l§I5RlE| i
  10. 10. Let's Handson http: //9oo. g|/ btQw| e Salesforce Lightning 3 ‘/7l‘'-»'i<‘/ I‘ 7-: — l~ U 711» http: //salesforcedeve| opersjapan. github. io/ |ightning-components-tutoria| /
  11. 11. l5l%iFa'i7J‘E07EtI. 0)'C“ eanezexefiegao (aim. ., , ) httP= //goo. g|/ btQw| e
  12. 12. §%5='EI 74 ‘y7EX§|5'E%t£% Quicl<ConI'acI'. i SearchBar Rose Gonzalez CovIl*acH. i:I' Sean Forbes (512) 757—6000 Jack Rogers (336) 2227000 Pm Slumuller 10141427-4427 Andy Young (735) zaiezoo Tim Barr I312) 595 iooo http: //9oo. g|/ btQwle
  13. 13. Lightning II ‘/7I{—3'r<‘/ I‘ wlfifi nasrlvtla 77‘}‘f-"/ !>(l. l¢htnlrI¢ A»/ Ir-pi controller h helper E £86 :1‘/ m—3=‘/ I-Ifi! ltL‘rI: |!I: !.svG, ooc. DESIGN. Iiuosnsnlfibe §ELightningZI ‘/71''-$7 I‘ Mfi (1) - Appirio japan http: /lappirio. co. jplcategory/ tech-biog/201 5/05/I ightningcomponentdev1 I
  14. 14. ApexZl‘/ |~lZl—5— 0 Sa| esforcelE'J0J7"“—’5’lC77tX§"%>i%‘i%la*4lZ? E 0 ApexlE'J0)§QE I @AuraEnab| ed7/7"'—°/ EI ‘/ I static public with sharing class . ':. z;: : ; _ : { public static List<Contact> " l() { return [SELECT id, name, phone FROM Contact LlMrl' ]; } }
  15. 15. —' ctelilili-"9rI| l‘g‘l'rt‘I3l£E’: » ii: -;i’uLIiI, 'nrioiIiIl, -,i, 'r, ?7fl*~1., A <aura: component controller-"ContactListController"> </ aura: component> someAction: function(component, event, helper) { var action ; cfornpenentjgefl’clfindAlI‘); action. seVtCal| VbaclV<(this, ‘ tunctionta) I r/ _/_ « ‘* 1.-3:/ r -: <:/ H; 2': comptaVnent. set('/7.scmeAttribute', a. getRetumValue()); l); / /7 . , u, $A. ent1ueue/ V¢: ltitJn(<a‘ction); } l)
  16. 16. Template o <aura: component> 0 imp| ementsE’l$ I force: appHostab| e 0 Sa| esforce10)d‘E"f‘—*‘/ El ‘/ ><: :L—Ffi I flexipagezavailab| eForA| |PageTypes 0 AppBui| der‘’5Lightning/ °—‘/ V5’ 77% < component imp| ements= </ component>
  17. 17. Template - <aura: attribute> o II‘/7l{—3i<‘/ l~PV. l‘C“$'J}5fi§‘élZl—7J)lz2$E¥5( 0 77'tzX7'3‘7‘£ I Template 2 {! v.<E'l$4’%>} - Contro| ler(JS) I component. get('v. <l§'l‘$€: >'); <aura: component implements: <aura: attribute name= type= {! v.tit| e} </ aura: component> ({ someAction: function(component, event, helper) { var title = component. get( ); } })
  18. 18. ~lillkv; ‘ , - ‘l, “gII‘Il’: ltlE-: If(‘= VJ5P -, -. / / template <aura: component implements= "force: appHostable"> <button type= "button" onc| ick= "{l<: .someAction}">action</ button> </ aura: component> / / Controller (1 someAction: function(component, event, helper) { / / {EIIJWMAE } })
  19. 19. Style 0 Il‘/ /‘l‘? —3F‘/ |*P‘J§: ‘l30)X5”f}b I r. TH| SJ 75X75‘5F; '§9é: "9"%’>Z<‘:7b*4lZ§ -by7Uy7fim: yfi—*yb%? fi%en% o~y7—7u74v7xue@fi%ena . TH| S { background-colon black; } . THIS. white { background-color: white; }
  20. 20. Event v3Vfi—*>hEE%? ét®®&$$ vzéfiaa F 77'J’J'—DEI‘/ ’f’“/ I‘ r3yfi—*yh4~yh Vgfififlfimfi 1.4&ybWm 2. 1’/ ‘‘/ l~%f5z(Register) 3. 4’“/ l%§f~T. (Subscribe) 4.4Nyh%Kmm)
  21. 21. Event ° 4’“/ l~f’l5EJZ <aura: event> 0 4/“/ hfifi <aura: hand| er> 0 4/“/ hfifi <aura: registerEvent> 0 'f'“/ l~%W ControllerP§‘C‘¥”a§ / / 77') 7-9 3 >447 H‘F§£ <aura: event type= "APPL| CAT| ON"> <aura: attribute name= "searchKey" type= "String"></ aura: attribute> </ aura: event> <aura: component> <aura: hand| er event= "c: SearchKeyChange" action= "{lc. someAction}”/ > </ aura: component> / / 77v 7-93 >4«'*/ I~§fi(5%9<llIJ) <aura: component> <aura: registerEvent name= "onSearchKeyChange" type= "c: SearchKeyChange"/ > </ aura: component> ({ someAction: function(component, event, helper) { var target = $A. get('e. c:SearchKeyChange'); target. fire(); })
  22. 22. Event -4&yh%®fiE - Fczi lEt4’%§7J'§Fafi7|. / 7 —r v 7:<7fi? :<: tEa“nn2:; L. t_a. !fi ’c*0)7“-*7 am reatgraete L :9“ I *f’“/ l~%W0JSnippet ({ someAction: function(component, event, helper) { / / . fi9<—f&‘/ NEW? ! var target = $A. get('e. c:eventName‘) / / . !%9<5§l: I'§‘/ V5)‘ —9%IQE target. setParams({ value: event. target. va| ue l) / / . 4 N7 HEX target. fire()
  23. 23. Helper «: yfi—*yhW%®%®fi& HelperP§l'C‘lithis‘C*l1¥Z)‘H: '.bE. l’IEiE <' Contro| leriJ'50)ll¥U“'cl: llJ(0)cB) F he| per. <E§&4’%> l“'. 'i: l|, ~I: i (1 311'! ‘ ilvlnl-i I IVS? E s l , in ~11-[I)au[ ‘I1nLg‘ ), tfillntgp. jinn; -iit-gs (flux, -jj l -(~Ja’l~10)[: n[-1:“: 413,»: o”[olnu“)>. .I fllQI0l0)lL5l ii I": -1-In-1lI: ; (i »‘Q]Itl= ILIiIII)Ih' iv. Iu: -in-Jalt-mung: -1min; ,.: w:mq, ii= Ilg: :|i> l il= l[_Il: lilI'TILg[. ), . ’ l
  24. 24. £’§§5"5«V"»‘, r . _ <design: component> <design: attribute name= "su bject“ labe| ="Su bject" description= " SR3)? " / > </ design: component> :1 : ,_ , ' _. <aura: component implements= "flexipage: availab| eForAllPageTypes"> <aura: attribute name-"subiect" type-"String" / > {! v.subject} </ aura: component>
  25. 25. - ? ‘/t‘~y77J‘L; /ut“L I 7 III ‘J Hfilllzijavascripto lé. “’Ll5J75‘/ ‘:'U0D4‘%l2lSt 72%: I *7‘~/ ‘—TE'J’(‘parseMfié 116 ° 1’%§7J': °EFEfiC7)¥E -: yfi—*yh§% I $’l~’: ’i‘l$7 7’fJb0)$| JH§75;‘£ I <| tng: require> I Javascriptl; tCSP$'J|3E7b“a‘>3 '0 %‘%El’J ‘J ‘/ —Z7b“FJ‘7J'3‘E -: yfi—*ybE®u§v7%fiEE -fimUv—x&7n—Rwzfi§% %E§LightningIl ‘J7T§—$ ‘J l‘ 553% (3) - Appirio Japan http: //appirio. co. jp/ category/ tech—b| og/2015/06/Iightningcomponentdevill
  26. 26. $3267) «T LightningZl‘J7l‘'—3i‘<‘J l~§l¥§‘C‘3‘7b‘? F §¥’é‘(‘§' «' Aura! l¥= ‘éT‘§'fJ? K fis$. '€§‘ I‘ iffil@JE’JFfil§. ’§ r Lightning II ‘J7l'°—*‘J | ~0)l: |:? fiflé’>&lat$§’lfi$'JFli‘9"? o r Salesforce0)7’-‘-977’eZ0)‘é. ‘l35:‘lal'Aura’$i{§'E5 H UllE'Jlat3'J03Javascript5’f 75 ‘J ’E$lJFfi b J: 5 O fi$B’J'J ‘/ —7Efi§'E 0 ex) React, Knockout, Poymer
  27. 27. T E5’. @mitsuruog

×