前端的未來 - Web 前端程式開發實務

Transcript

1. Copyright © 2012 FITPI. All rights reserved. ٢ငໃῲğྍ֥࠯ℿ భ؊۽ӱῘứℯ↩⇪‣
    ᾣ℩ğᾠקდ
   
   KPTFQIK 1
2. Copyright © 2012 FITPI. All rights reserved. ໃῲ୆ླᅧ໤֥ཌྷἬ࠯ℿ ๏ (JU)VC
   
   Ῐ٢ӱൔࠣสࡱ֥ഠಕ↌ᅟb಩ ޅ⊕ ֥ӱൔῘứದ≇׻∣ἐῂӈῲ⇨ᅳ⊷ ჷđॖၛᾳസնਈℭᾇĆằಖᗥ૫൞Ⴎ
   (JU
   ϱ Ч॥ܵ༢ⅼ෮ᆦ㏔đ୆္∣ἐေ὜b ๏ )5.-
   
   ิ܂↌ᅟ∻൭ὨῘứ۷؟ॖିྟđ Ἶಀ
   'MBTI
   Ҍିቓ֥aໃῲ
   )5.-
   ္ॖၛb ๏ /PEFKT
   
   ⃸
   +BWB4DSJQU
   ạ⏟´ఖ؊ࢳ䓬đ ୆ॖၛႨ෱ῲቓ۷؟൙b భ૫ࢺℚἾa҂ᄜ⊱ ඍĎ 2
3. Copyright © 2012 FITPI. All rights reserved. (JU
   
   (JU)VC 3 ϱЧ॥ܵ᾵ކഠಕ৯ਈđॖၛḲ୆സնਈῘứℭᾇ
4. Copyright © 2012 FITPI. All rights reserved. (JU
   ϱЧ॥ܵ۽ऎ ๏ ϱЧ॥ܵğⅅᄝ൉喁ℭᾇڿਔ൉喁Ọ༆׻Ⴕౢԣὸ ≘đॖၛ⅗ℭ߭֞Ἶಀb ❖ х૧Ϝӱൔ⇔ὒa҂ᆩೂޅἋჰb ❖ ҂⁠܄ඳↀộaἠದ׻ླေĆ ๏ (JU
   ֥ԛ⇀đປಆᾞ঺இ֥
   $7447/
   յೆ৏⻔b ๏ ቔᆀࣼ൞
   -JOVT
   -JOVY
   ᆭڳ ๏ (JU
   ൞۽ऎđሱ֥࠭ểₔࣼॖၛỒ৫≓ቔb ๏ മᇀӈႵದଦ
   (JU
   ቓ⟦ඇ↌ᅟb 4
5. Copyright © 2012 FITPI. All rights reserved. Joseph miiiCasa git clone Kevin git clone Hunter git clone ൐Ⴈ
   HJU
   DMPOF
   ॖၛ࿡෎ֹ♶⚧
   3FQPTJUPSZ
   ֞҂๝ֹٚ Richard git clone ૄἠ
   3FQPTJUPSZ
   ࢥֹ໊ཌྷ֩aỒ৫≓ቔa္ॖᄜФ
   DMPOF 5 11
   ࡏἧ
6. Copyright © 2012 FITPI. All rights reserved. Joseph miiiCasa Kevin Hunter HJU
   DPNNJU ҂႕⇉ః෰
   3FQPTJUPSZ HJU
   DPNNJU
   Ᾱᄝሱ࠭
   3FQP
   ᄹࡆὸ仛a҂႕⇉⦁֥
   3FQP 即使沒有網路依然可以 Commit、記錄我的變更 「做⾃自⼰己的版本控管」 vim foo.txt git add foo.txt git commit -m “typo correct” 6 ॖ 䍛ቔ∊
7. Copyright © 2012 FITPI. All rights reserved. Joseph miiiCasa Kevin Hunter HJU
   QVMM
   ᾞჰ൓
   3FQP
   ֥ṉ۷ሂ߭ῲႨ HJU
   QVMM
   ὜ᾞሱọቓ‥ἠ
   3FQP
   ֥ӱൔކ⟸ git pull 此時這裡有我的變更 + miiiCasa 的變更 git pull 7 ࡆೆ≊؊֥ṉ۷
8. Copyright © 2012 FITPI. All rights reserved. Joseph miiiCasa Kevin Hunter HJU
   QVMM
   SFNPUF
   CSBODI
   ᾞః෰
   3FQP
   ֥ṉ۷ሂ߭ῲႨ ᆺေ൞Ⴕཌྷ๝֥–ൎđॖၛ⅗ၩކ⟸ᆷק֥
   3FQP git pull Kevin master 此時這裡有我的變更 + miiiCasa 的變更 + Kevin 的變更 git pull Kevin master 8 ࡆೆ≊؊֥ṉ۷
9. Copyright © 2012 FITPI. All rights reserved. Joseph miiiCasa Kevin Hunter HJU
   QVTI
   ᾞ໡֥ྩڿẖෂ֞
   0SJHJO ॖ০Ⴈ
   QVMMQVTI
   ቓ⅄ཟ֥ކ⟸čࠧ๝҄Ď git push miiiCasa 有 我的變更 + Kevin 的變更 git push 9 Ếෂሱ֥࠭ṉ۷
10. Copyright © 2012 FITPI. All rights reserved. GitHub ⃸
    4PDJBM
    $PEJOH
    ҂ᆺ൞१ὂ 10
11. Copyright © 2012 FITPI. All rights reserved. ಆൗࢸᆩ଀֥
    0QFO
    4PVSDF
    1SPKFDU
    ׻ᄝ
    HJUIVC 11
12. Copyright © 2012 FITPI. All rights reserved. ิ܂٤ӈ؟
    4PDJBM
    $PEJOH
    ֥Ὠᇅ 0QFO
    4PVSDF
    ္൞ᄝࢌழႶάĆ ФἬᇿ∻Ф
    GPSL
    ֥Ց⅂ ॖᆰࢤ
    HJU
    DMPOF
    ầሼ
    ҂ླ䩏⤳ ⦁ದྩڿa༐ຬ୆
    NFSHF
    ⃪֥౰ Ῐ
    #VH
    ἡ୆ 12 ٤ӈܝ‑նࡅϜӱൔ٢֞
    (JU)VC ⃸
    4PDJBM
    ֥৯ਈ՜൐୆֥
    1SPKFDU
    ۷ݺ
13. Copyright © 2012 FITPI. All rights reserved. ᄝ
    HJUIVC
    ࡹ৫ↀộa∻ຓࢸٳཚॖ
    0QFO
    ֥۽ऎ∻⊦σ 13
14. Copyright © 2012 FITPI. All rights reserved. github.com ᄝ
    HJUIVC
    ࡹ৫ↀộa∻ຓࢸٳཚॖ
    0QFO
    ֥۽ऎ∻⊦σ Joseph employee miiiCasa private central repository Kevin employee Richard employee miiiCasa public central repository Clonn contributor ⇔ӱൔ֥҂ᆺ൞≇۽aὕႵ܄ඳຓ֥ῘứᆀĆ 14
15. Copyright © 2012 FITPI. All rights reserved. )5.- ๏ )5.-
    ℯόഈЇݣਔ
    )5.-
    ֥ྍṌ⚓a $44đࠣᅝ䌉ն؟⅂֥
    +BWB4DSJQUb ๏ ჰЧ
    )5.-
    ֥℟ίଢṌᆺ൞Ⴈῲ↾ൕ໓ࡱ∻޺ ཌྷ’᾵a❣٤Ⴈῲ⚧ቔཞ
    (NBJM
    ≾∄֥∣Ⴈӱ ൔb)5.-
    ₃Ṙਔ҂ቀb ๏ 'MBTI
    ൞Ἶಀ
    8FC
    ∣Ⴈӱൔ֥ϟᇶđၹ
    )5.-
    ֥ԛ⇀ࠣ
    J1IPOF
    ҂ᆦჱđໃῲ὜ᄀ ῲᄀ҂ᇗေb ๏ ၹ⏟´ఖཌྷಸྟ∻ℯቔ҂၂ᇁđ൐Ⴈ
    )5.-
    ℭсק֤ॉ⁒ཌྷಸྟࠣ㸗௖ק໊b 15
16. Copyright © 2012 FITPI. All rights reserved. ᆴ֤Ἤᇿ֥࠯ℿ ๏ $BOWBTğὡⅾ ๏ 'JMF4ZTUFNğ⃸
    +4
    ္ିẕ৘
    #JOBSZ ๏ 8FC4PDLFUğ∻යڛఖࠧℭ⅄ཟἦ๙ ๏ -PDBM
    4UPSBHFğᾞ⊷ਘթ٢ᧄ⏟´ఖ ๏ )JTUPSZ
    "1*ğ҂㍤∉↌ᆶ۷ྍ ๏ 8FC
    'POUTğ≘ೆሳ྘ẵ ๏ "VEJP
    
    7JEFPğ↌∉ჰള֥Ѭ٢ఖ 16
17. Copyright © 2012 FITPI. All rights reserved. $BOWBT ๏ )5.-
    ὡⅾ၂ᆰ׻թᄝᇷđཞ൞
    *&
    ၂ᆰႵ
    7.-
    ࠯ ℿb֌㬪ਔॴ௜෻aն؟⅂ದ֥⇢≢ὕ൞
    'MBTIb ๏ $BOWBT
    ൞
    %
    ࠯ℿaбᾱӮඃb္Ⴕ
    8FC(-
    ֥
    %
    ࠯ℿb ๏ ཞ൞⅜ⅾa⃸ᅶோुఏῲ௜߁≾ུ
    $BOWBT
    ׻ႵὨ὜ ቓ֞đ֌ဆෘὨᇅ֥สࡱଢభᾱഒb ๏ (PPHMF
    ൐Ⴈᆀၩᾖ߭Ύॖᾞằభ↌∉ࢩⅾ❟֞ය ڛఖഈ
    
    $BOWBT
    ࠯ℿĆ ๏ :6*
    (SBQIJDT
    ཌྷಸᧄ
    47(a7.-a$BOWBT ❖ IUUQZVJMJCSBSZDPNZVJEPDTHSBQIJDT 17 ࿅शɿhttp://f2eclass.com/lab/html5/canvas.html
18. Copyright © 2012 FITPI. All rights reserved. 'JMF4ZTUFN ๏ Їݣ؟ẵഈẖaạም૫ഈ຀ঘẵσ֞∉૫ᇏ čّᆭၧಖĎb ๏ :6*
    ֥
    6QMPBEFS
    ิ܂ਔ຀ঘഈẖđࣼ൞၂ἠ ޓϿ֥
    'JMF4ZTUFN
    ∣Ⴈb ❖ IUUQZVJMJCSBSZDPNZVJEPDTVQMPBEFS 18 ࿅शɿhttp://f2eclass.com/lab/html5/yui-uploader.html
19. Copyright © 2012 FITPI. All rights reserved. -PDBM
    4UPSBHF ๏ ⊷ਘ҂၂קေ۵
    4FSWFS
    ଦđ೏҂ӈ۷ྍđ≣∣ẓ թᄝ⏟´ఖх૧শỷ₹ῥčỚིିႵḲᇹĎb ๏ Ἶಀေẓթ⊷ਘᄝ൐Ⴈᆀ֥⏟´ఖᆺି๩Ἶ
    $PPLJFđ֌ಸਈႵཋb'MBTI
    ิ܂֥ॢᾇّطбᾱ ℳކb ๏ )5.-
    ิ܂ਔ؟ἠ⊷ਘẓթٚσğ -PDBM4UPSBHFa*OEFY%#a"QQMJDBUJPO
    $BDIFb ๏ :6*
    ֥
    $BDIF
    ۽ऎğᆜކਔ
    -PDBM4UPSBHFb IUUQZVJMJCSBSZDPNZVJEPDTDBDIF 19 ࿅शɿhttp://f2eclass.com/lab/html5/yui-cache.html
20. Copyright © 2012 FITPI. All rights reserved. )JTUPSZ
    "1* ๏ Ἶಀ҂㍤∉࠯ℿč+40/1a"+"9Ďေିᆜކഈ၂ ∉a༯၂∉ࠇࡆ֞໡֥ቋḨᆺିႨ
    
    ῲℯቔb ๏ ⇀ᄝཞ
    'BDFCPPLa5XJUUFSa(JUIVC
    ׻ℯቔਔ
    )JTUPSZ
    "1*ğ⃸҂㍤∉֥↌ᆶିⴺọⅢ۷㍤b ❖ ुुữ২ğIUUQTHJUIVCDPNKPTFQIKNPEVMF ề⇢༯૫ẵσ಩ၩ’᾵❣Ἥҳ↌ᆶb ๏ :6*
    ิ܂ਔ
    )JTUPSZ
    "1* IUUQGFDMBTTDPNMBCIUNMZVJIJTUPSZIUNM 20 ࿅शɿhttp://f2eclass.com/lab/html5/yui-history.html
21. Copyright © 2012 FITPI. All rights reserved. 8FC
    'POUT ๏ ࢶႮᆰࢤ༯≘ሳ྘ẵđ⃸↌∉ᇏ֥໓ሳၛՎሳⅴ↾ ൕaࠧ൐൐Ⴈᆀໃν⊬္㢻Ἤ⚜b ๏ ႇ໓ޓಸၞℯ⇀đၹ㬪ሳ⅂ഒğ ❖ ⃪Ṛॉ
    (PPHMF
    'POU
    "1* IUUQTEFWFMPQFSTHPPHMFDPNXFCGPOUTEPDT HFUUJOH@TUBSUFE2VJDL@4UBSU ๏ ᇏ໓ሳ⅂෾؟҂ℳކđ֌Ⴕದℯቔห൹࠯ℿč὜ٳ ༅↌∉ᇏႵଧུሳaᄜ༯≘ᆺႵ≾ུሳ֥ሳ྘ẵğ ❖ ⃪Ṛॉ
    KVTU'POU
    wࣼ൞ሳx IUUQXXXKVTUGPOUDPN 21
22. Copyright © 2012 FITPI. All rights reserved. <audio>
    Ṍ⚓ ๏ ᆦჱ⏟´ఖğ
    *&
    ࠣᇶੀ⏟´ఖ ๏ ᆦჱ۬ൔğ.1
    8"7
    0((b ๏ ↜ⅳğ ❖ ."
    ൞ଢభ
    J5VOF
    ֥ᆦჱ۬ൔb ❖ ҂๝⏟´ఖᆦჱ֥۬ൔ҂๝b ❖ ေ⊁Ṧ⏟´ఖᆦჱ؇෾ྌ७ਔĆ ๏ ạ
    *&
    ᆦჱ֞൭Ὠ⏟´ఖ
    
    4PVOE.BOBHFS ❖ IUUQXXXTDIJMMNBOJBDPNQSPKFDUTTPVNBOBHFS 22
23. Copyright © 2012 FITPI. All rights reserved. <video>
    Ṍ⚓ ๏ ۵
    BVEJP
    Ṍ⚓ཌྷбđWJEFP
    ᆦჱ؇↜ⅳ۷؟ ❖ ᆦჱ⏟´ఖğ*&
    ࠣᇶੀ⏟´ఖ ❖ ᆦჱ۬ൔğ BWJ
    ҂ᆦჱ
    EBU
    ҂ᆦჱ ✦ 8FC.
    5IFPSB7PSCJT
    PHH
    
    PHW
    )
    
    ""$
    NQ
    
    NW ๏ ն҆ٳ֥႕ၻ↌ᅟ὜ᾞ۲⊕҂๝֥႕ၻẵ⊨㬪
    '-7
    'MBTI
    7JEFP đ০Ⴈ
    'MBTI
    1MBZFS
    Ѭ٢b ❖ ൭Ὠ҂ᆦჱ
    'MBTIđ֤Ⴕ
    )
    ẵၛ
    BVEJP
    Ѭ٢b ❖ ࢳ㢯ٚσ㬪
    'MPX1MBZFSğIUUQGMPXQMBZFSPSH ๏ ೏༐ຬᆦჱնਈ۬ൔđ൐Ⴈᆀ֤⊬
    7-$
    1MBZFSb ❖ ൭Ὠ֥↜ⅳ၂∄֤ਸ਼ຓࢳ 23
24. Copyright © 2012 FITPI. All rights reserved. ‣↮ğWJEFP 24 <video> <source src="video.ogg"> <source src="video.m4v"> <p>ޓАవĆଢ଼֥⏟´ఖ҂ᆦჱ
    )5.-
    7JEFP</p> </video> http://www.w3schools.com/tags/ref_av_dom.asp Ⴕଧུℾྟaٚمa൙ࡱॖၛṚॉğ ࿅शɿhttp://f2eclass.com/lab/html5/video.html
25. Copyright © 2012 FITPI. All rights reserved. భ؊֥ധೆ࿹࣮ ๏ ໾ࡱẹཟğ001
    0CKFDUPSJFOUFE
    1SPHSBNNJOH
    Ῐ ứॖնਈ㦆ഒᇗ♶֥ӱൔb ๏ ଆ⊾ࡏἧğೂޅ్ٳ↌ᅟ֥ࡏἧ۷ଆ⊾ ߄đ⃸→Ὂྟ۷ࡆルb ๏ +BWB4DSJQU
    .7$
    ࡏἧğྍ֥Ῐứଆ ൔaℳކႨᄝ∣Ⴈӱൔ ֥↌ᅟb ๏ ӻ⇟ᆜކğս௖⊑ሱọᾋҰaሱọ
    #VJMEaሱọ߄Ṧℷa"1*
    ໓ࡱ߄ 25
26. Copyright © 2012 FITPI. All rights reserved. 26 భ؊֥ധೆ࿹࣮ ≾ུᇶⅳ׻ޓնđ۵భ؊֥
    6*
    ္㢻ᆰࢤἬ⚜ ֌ି⃸ↀộ֥Ῐứࡏἧສᆞ⃷֥ٚཟളṵ ⃸ૄἠῘứӮ≇׻൳ၭ ଢభ၂Ϯ܄ඳ֥భ؊Ῐứࡏἧಯ҂ෘປᆜ ෮ၛޓླေ≾∄֥ದҌğభ؊ࡏἧ℩b
27. Copyright © 2012 FITPI. All rights reserved. ୭৯⇔
    1SPUPUZQFĆ 27 ⊈ૼॖྛྟaऋ䌉ॢ१䪌Ϣὐ భ؊۽ӱ℩૫Ớ֥ὔ࣢♶≗č⏟´ఖཌྷ㹁Ď ∣ἐх૧Ⴈw҉Ṧx֥ٚൔẕ৘↜ⅳđ২ೂğ w∣ἐ൞
    *&
    ֥
    #VHxaw∣ἐ൞
    :6*
    ֥
    #VHx ཌྷᾱᧄᗥ؊ॖିླ℟ᇂὔ࣢ࠇṇ∙ భ؊ᆺေႵ⅗൭ॖ֤֥ὸ൙Ч
    
    ⏟´ఖࠧॖℷ⇼ ෮ၛϜ↜ⅳẪẛ߄aॹ෎⇔ἠཬữ২ࣼॖ⊈ૼਔ ္⇝ն؟ℭީa҉Ṧ๙ӈ҂Ӯ৫b ྍ࠯ℿ֥ॖྛྟ࿹္࣮൞ླေ
    1SPUPUZQJOH
    ֥Ć
28. Copyright © 2012 FITPI. All rights reserved. Ἤᧄ૫ℷ
    '& 28 ๏ ൞ڎỚῘứႵ⃼౦ğἠದ҆ઋ۬a‟ℼaᖁশb
    ๏ ൞ڎ৘ࢳჰ৘a҂ିᆺ൞὜Ⴈหקݦൔῠb ๏ ൞ڎႵॖᅚൕ֥⊦σࠇቔ௖↌ᅟb ๏ ൞ڎᇗℶӱൔ→Ὂྟaնᧄ
    6*
    ᧓‏ӱ؇b ๏ ൞ڎႵᆞ⃷Ἥ୑ğ২ೂ৘ࢳ
    4FNBOUJDaᾛΆൔᆦ ჱa↥ᅰḧ֩b ๏ ൞ڎႵℂⅴↀộކቔῂ⇼b ๏ ൞ڎⴺw႗xğჭࡱࡏἧa$MPTVSFaଆ⊾ࡏἧa .7$aϱЧ॥ܵa⟦ඇ∗ⅳaӻ⇟ᆜކ֩b ԢਔⅢ؇đ໡૫ℷℭ὜Ἥҳၛ༯⇊ଢ
29. Copyright © 2012 FITPI. All rights reserved. ෻↉֥భ؊ࢌੀऊ὜ ๏ +4%$
    +BWB4DSJQU
    %FWFMPQFS
    $POGFSFODF ❖ +BWB4DSJQU
    ୍֥؇ഹ὜ ❖ IUUQKTEDUX ๏ +BWB4DSJQUUX ❖ ᄝ෻Кa෻ᇏ҂ק௹ΉḰཬऊ
    ❖ IUUQCMPHKBWBTDSJQUUX ๏ /PEFKT
    5BJXBO
    1BSUZ ❖ /PEFKT
    ཌྷἬᇏ໓⊷⇫
    ❖ IUUQOPEFKTUX ๏ ෻↉۽ӱ℩୍؇նϨϨ
    
    04%$UXa$04$61 29 ܝ‑նࡅ؟Ṛࡆࢌੀ὜đ૧ỷႻॖṵᆩℰ
30. Copyright © 2012 FITPI. All rights reserved. 30 Q & A ὕႵ൉喁ླေṘԉ֥Ĥ
31. Copyright © 2012 FITPI. All rights reserved. 31 Thank Youʂ ۋ⇖նࡅῲṚ∻భ؊۽ӱℯ↩⇪‣ ὓ႒նࡅЌӻ‗⚝a؟؟޺ཌྷٳཚ