Privileged Apps with Vue.js

Transcript

1. Privileged Apps with Vue.js Firefox OS ίʔυϦʔσΟϯάϛʔτΞοϓ #11 (2014/11/15) @masawada
2. ͜Μ͹Μ͸
3. @masawada
5. FxOSϋοΧιϯͱ͔ओ࠵
6. http://masawada.me
7. εϥΠυ50ຕͳͷͰ ඈ͹͠·͢
8. Privileged Apps with Vue.js
9. Vue.js
10. MVVMϑϨʔϜϫʔΫ
11. MVCͷѥछΈ͍ͨͳͷ
12. ৄࡉ͸ׂѪ
13. (͜Θ͍͓͡͞Μ͜Θ͍)
14. Model View ViewModel
15. Model var model = { hello: “” };
16. View <body> <div id=“app”> <p v-text=“hello”></p> <input type=“text” v-model=“hello”> </div> </body>
17. ViewModel var app = new Vue({ el: "#app", data: model });
18. ViewͱModelΛ ViewModel͕όΠϯυ
20. Privileged Apps (ಛݖΞϓϦ)
21. Privileged Apps ɾHosted AppsͰ͸࢖͑ͳ͍API͕࢖͑Δ ɾmanifest.webappʹࢦఆΛॻ͘ ɾ੍͍͔ͭ͘ݶ͕͋Δ ɾΞϓϦΛެ։͢Δͱ͖ʹ৹͕ࠪ͋Δ
22. ੍͍͔ͭ͘ݶ͕͋Δ
23. CSP
24. Content Security Policy
25. Content Security Policy ɾؔ਺ίϯετϥΫλͷېࢭ ɾeval ͷېࢭ ͳͲͳͲ… https://developer.mozilla.org/ja/Apps/CSP ΛݟͯͶ
26. Vue.js
27. ؔ਺ίϯετϥΫλଟ༻ͯͨ͠
29. ΍ͬͨͥ
30. Ͳ͏΍࣮ͬͯݱ͍ͯ͠Δ͔
31. mmckegg/notevil
32. mmckegg/notevil ɾNode.jsͷϞδϡʔϧ ɾVue.jsͰ͸͜ΕΛforkͯ͠ґଘϥΠϒϥϦΛ݁߹ ɾariya/esprimaͰparseͯ͠Δ ɾάϩʔόϧΦϒδΣΫτʹΞΫηε͠ͳ͍
33. mmckegg/notevil case 'BinaryExpression': var l = walk(node.left) var r = walk(node.right) switch(node.operator) { case '==': return l === r case '===': return l === r
34. .oO(not evil …?)
35. ศརͳͷͰ࢖͍·͠ΐ͏
36. ݱ஍͔Β͸Ҏ্Ͱ͢
37. ༨ஊ
38. ίʔυϦʔσΟϯάͷ ͓ͱ΋ʹ
39. git find ίϚϯυ
40. git find ɾgit subcommand ɾPATHͷ௨Δॴʹgit-findϑΝΠϧΛஔ͘ → git findͰ࣮ߦͰ͖Δ ɾpeco͕ඞཁ
41. pecoͷΠϯετʔϧ (mac) $ brew tap peco/peco $ brew install peco
46. ࠷ߴ
47. git find DST_PATH=$(git grep -n $1 | grep -v "[0-9]:\s*//" | peco | awk -F ":" '{print "-c "$2" "$1}'); if [ ${#DST_PATH} -ne 0 ]; then vim $DST_PATH; fi
48. [git find peco][ݕࡧ]
49. ͥͻ͓࢖͍͍ͩ͘͞
50. ͋Γ͕ͱ͏͍͟͝·ͨ͠