前端之今天的我，未來的我們

剓鵜涸䧮劢⢵涸⡹

⵹畮⛓ 剓鵜涸䧮劢⢵涸⡹

䬚ⴀ陾겗 錚㻌㣐㹻㼩倴鑪陾겗涸✽⹛ ⛳僽♧珏鏤鎙 0CKFDUJFE私ꏗ晚

䨾⟃鸏㜥UBML涸湡涸

湡涸♧   䋞劆䧮➛㣔涸⚺겗  〳⟃雊ぐ⡙䙼罌搂ꣳ〳腋

湡涸✳   䋞劆〵抓剤馊⢵馊㢵➃  梖鸏❉⚺겗

䨾⟃  㺂鏪䧮䪾➛㣔⚺겗䳖♧♴

⵹畮⛓ ➛㣔涸䧮劢⢵涸䧮⦛

鼩僽銴⯓闍穡锸

穡锸♧   ➛㣔涸Ⰹ㺂♶〫♧⦐⚺겗

14  㢵⯋涸⿾꬗僽䧮♶濼麥聃✫➊랃

穡锸✳   ➛㣔涸Ⰹ㺂♶剚䌟⡹ⰅꟌ 〫䌟⡹溏ⵌꟌ

14  䨾⟃䧮剚䌟⡹溏ⵌ䖎㢵䧮剓鵜Ꟛ涸Ꟍ

Ꟛ㨥ゅ

剓鵜涸䧮  ➛㣔涸䧮

剓鵜涸䧮㖈梖➊랃  ➛㣔涸䧮銴闍➊랃ヤ

7BOJMMB+4

䧮剓鵜䟝⨞1PSUGPMJP

䧮剓鵜䟝⨞1PSUGPMJP  䧮剓鵜聃ⵌ7BOJMMB+4鸏⦐そ鑂

7BOJMMB+4僽➊랃

7BOJMMB+4僽➊랃 7BOJMMB껻虋

7BOJMMB+4僽➊랃 7BOJMMB껻虋 7BOJMMB+41VSF+4

⛳㽠僽 /P+2VFSZ

⛳㽠僽 /P+2VFSZ /P"OHVMBS+4

⛳㽠僽 /P+2VFSZ /P"OHVMBS+4 /P3FBDU

⛳㽠僽 /P+2VFSZ /P"OHVMBS+4 /P3FBDU /P7VF+4

㔐娝㣐荈搭涸䠑䙼

䠑纏僽➊랃

䠑纏僽➊랃  㥶卓♧⦐矦㋲✽⹛馄㼱涸QPSUGPMJP꨾銴  'SBNFXPSL

䠑纏僽➊랃  㥶卓♧⦐矦㋲✽⹛馄㼱涸QPSUGPMJP꨾銴  'SBNFXPSL腋溏㌨

♧⡙慍崎剦⿼涸⵹畮꬗鑑겗

♧⡙慍崎剦⿼涸⵹畮꬗鑑겗 … Marvel provides an open API allowing users to
explore their entire catalogue of comics, series, characters and relationships between those objects. … Avoid spaghetti code: Ensure your code is decoupled. Use some kind of application architecture (e.g. Redux, Flux, MVVM, MVC etc.). Restrictions: You must not use a full framework in your implementation (e.g. Angular, Ember). You must not use jQuery or equivalent. Note, you are free to use any libraries that you like as long as they are single purpose e.g. routing, templating, ajax requests.

穡卓䧮剦⿼荈䊹ⵠ✫.7$QBUUFSOㄤ  UFNQMBUFFOHJOF

穡卓䧮剦⿼荈䊹ⵠ✫.7$QBUUFSOㄤ  UFNQMBUFFOHJOF    搭䖕鼩僽鄄䠮闒✫㔔捀➮⦛Ⱖ㻜銴罌涸僽  ⡹㼩0QFO4PVSDF剤㢵擿䜫

穡卓䧮剦⿼荈䊹ⵠ✫.7$QBUUFSOㄤ  UFNQMBUFFOHJOF    搭䖕鼩僽鄄䠮闒✫㔔捀➮⦛Ⱖ㻜銴罌涸僽  ⡹㼩0QFO4PVSDF剤㢵擿䜫罜♶僽➊랃鿪銴荈䊹ⵠ

䨾⟃7BOJMMB+4デ鏰䧮涸僽

䨾⟃7BOJMMB+4デ鏰䧮涸僽    銴㧇㊥涸麌欽鰶㶩

湱ꡠ须彂  1. https://vanillalist.com 2. https://github.com/davidhund/awesome-vanilla-js 3. https://github.com/sorrycc/awesome-javascript

䨾⟃  䧮㎲鑑䬚唳3FBDU⿡ⵠQPSUGPMJP

䧮涮植尝剤✫3FBDU   剚ꬌ䌢涸尝㸞䠮ㄤ䗉䗀

7BOJMMB+4 1SPHSFTTJWF8FC"QQ

♳妄㼭翹䧮ⴕ❧✫1SPHSFTTJWF8FC"QQ  https://speakerdeck.com/shiningjason1989/progressive-web-app-zhi-shi-fou- shi-wo-de-wei-lai

籏穡1SPHSFTTJWF8FC"QQ 1SPHSFTTJWF

籏穡1SPHSFTTJWF8FC"QQ 1SPHSFTTJWF 3FTQPOTJWF

籏穡1SPHSFTTJWF8FC"QQ 1SPHSFTTJWF 3FTQPOTJWF $POOFDUJWJUZJOEFQFOEFOU

籏穡1SPHSFTTJWF8FC"QQ 1SPHSFTTJWF 3FTQPOTJWF $POOFDUJWJUZJOEFQFOEFOU "QQMJLF

'SFTI

'SFTI 4BGF

'SFTI 4BGF %JTDPWFSBCMF

'SFTI 4BGF %JTDPWFSBCMF 3FFOHBHFBCMF

'SFTI 4BGF %JTDPWFSBCMF 3FFOHBHFBCMF *OTUBMMBCMF

'SFTI 4BGF %JTDPWFSBCMF 3FFOHBHFBCMF *OTUBMMBCMF -JOLBCMF

䨾⟃䧮涸QPSUGPMJP 1SPHSFTTJWF 3FTQPOTJWF $POOFDUJWJUZJOEFQFOEFOU "QQMJLF

䨾⟃䧮涸QPSUGPMJP 1SPHSFTTJWF銴雊嫦⦐懳錒㐼穅畮鿪〳⟃姻䌢⢪欽 3FTQPOTJWF $POOFDUJWJUZJOEFQFOEFOU "QQMJLF

䨾⟃䧮涸QPSUGPMJP 1SPHSFTTJWF銴雊嫦⦐懳錒㐼穅畮鿪〳⟃姻䌢⢪欽 3FTQPOTJWF銴雊嫦⦐輶䍌㣐㼭鿪〳⟃莞黠涸ꠗ隡 $POOFDUJWJUZJOEFQFOEFOU "QQMJLF

䨾⟃䧮涸QPSUGPMJP 1SPHSFTTJWF銴雊嫦⦐懳錒㐼穅畮鿪〳⟃姻䌢⢪欽 3FTQPOTJWF銴雊嫦⦐輶䍌㣐㼭鿪〳⟃莞黠涸ꠗ隡 $POOFDUJWJUZJOEFQFOEFOU雊剤䗱➃〳⟃㖈ꨶ唑⚥糒糵ꠗ隡䧮涸矦娜 "QQMJLF

䨾⟃䧮涸QPSUGPMJP 1SPHSFTTJWF銴雊嫦⦐懳錒㐼穅畮鿪〳⟃姻䌢⢪欽 3FTQPOTJWF銴雊嫦⦐輶䍌㣐㼭鿪〳⟃莞黠涸ꠗ隡 $POOFDUJWJUZJOEFQFOEFOU雊剤䗱➃〳⟃㖈ꨶ唑⚥糒糵ꠗ隡䧮涸矦娜 "QQMJLF雊䧮㖈➝稲荈䊹儘〳⟃湬䱺㖈呲꬗Ꟛ㉬⢪欽

'SFTI荈⹛刿倞矦娜须俲 4BGF %JTDPWFSBCMF 3FFOHBHFBCMF *OTUBMMBCMF -JOLBCMF

'SFTI荈⹛刿倞矦娜须俲 4BGF)5514 %JTDPWFSBCMF 3FFOHBHFBCMF *OTUBMMBCMF -JOLBCMF

'SFTI荈⹛刿倞矦娜须俲 4BGF)5514 %JTDPWFSBCMF4&0 3FFOHBHFBCMF *OTUBMMBCMF -JOLBCMF

'SFTI荈⹛刿倞矦娜须俲 4BGF)5514 %JTDPWFSBCMF4&0 3FFOHBHFBCMF殜 *OTUBMMBCMF -JOLBCMF

'SFTI荈⹛刿倞矦娜须俲 4BGF)5514 %JTDPWFSBCMF4&0 3FFOHBHFBCMF殜 *OTUBMMBCMF䥰鑪〫剤䧮剚㸞酤 -JOLBCMF

'SFTI荈⹛刿倞矦娜须俲 4BGF)5514 %JTDPWFSBCMF4&0 3FFOHBHFBCMF殜 *OTUBMMBCMF䥰鑪〫剤䧮剚㸞酤 -JOLBCMF䥰鑪〫剤䧮剚㸞酤

㥶⡦㻜⡲

1. https://github.com/shiningjason1989/shiningjason1989.github.io 2. https://developers.google.com/web/fundamentals/getting-started/your-first- progressive-web-app/

䨾⟃18"鑪䙦랃鏤鎙➊랃儘堥鑪欽

䨾⟃18"鑪䙦랃鏤鎙➊랃儘堥鑪欽  呏亙⢪欽罏㥶⡦莅⡹䲿⣘涸⭆⧩✽⹛ㄤ㢵䌢✽⹛

7BOJMMB+4 1SPHSFTTJWF8FC"QQ $IBUCPU

1PSUGPMJP3FTVNF

1PSUGPMJP3FTVNF  $IBUCPU

1. https://www.facebook.com/messinabot/ 2. http://www.estherbot.com/

㥶⡦㻜⡲

㥶⡦㻜⡲  ⢪欽4NPPDI

㥶⡦㻜⡲  ⢪欽4NPPDI ⸈Ⰵ"* PQUJPO FY8JUBJ

⿮罌鸮穡 1. https://github.com/esthercrawford/EstherBot 2. https://github.com/shiningjason1989/JasonBot 3. https://medium.com/@EstherCrawford 4. https://blog.techbridge.cc/2016/07/02/ChatBot-with-Wit/

爢纈 1. https://www.facebook.com/groups/chatbot.tw 2. https://www.facebook.com/groups/cuitaiwan

穡勲㓫

7BOJMMB+4 1SPHSFTTJWF8FC"QQ $IBUCPU

18" $IBUCPU

18" $IBUCPU劢⢵涸"QQ

穡锸

䧮僽や剤麨ⵌ湡涸ヤ

湡涸♧雊ぐ⡙䙼罌搂ꣳ〳腋湡涸✳雊刿㢵➃䟝Ꟛ鸏⦐Ꟍ騥鸏⦐㗄䧮僽や剤麨ⵌ湡涸ヤ

䊨㉂儘꟦

㥶卓⡹㼩3FBDU剤莇馱 3FBDU2VJDL5VUPSJBM俒㶶來勞  https://github.com/shiningjason1989/react-quick-tutorial 㼭儘䘰鸠ⰅꟌ3FBDU箁♳铭玑갸飑⚥  https://4cats.teachable.com/courses/24hrs-react-101

㥶卓⡹㼩18" $IBUCPU剤莇馱姹鵔⡹鷴麕♴꬗倰䒭莅䧮耢窄  ⸈ⰅTPGUOTIBSF爢纈猙鎝TIJOJOHKBTPO  https://softnshare.wordpress.com/slack/    &NBJM  [email protected]  湡⵹〫铞䠦涸堥㐼➃ https://shiningjason1989.github.io

前端之今天的我，未來的我們

前端之今天的我，未來的我們

More Decks by shiningjason1989

Other Decks in Education

Featured

Transcript