Non-MVC Web Framework

8,246 views

Published on

JavaScript is a client-side script language, but we can use it on server side programming now. However, it is still difficult to write server-side application for front-end developer.

Here we try to find a solution to write server-side script that developer only need to understand and have client-side experience.

Published in: Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
8,246
On SlideShare
0
From Embeds
0
Number of Embeds
3,977
Actions
Shares
0
Downloads
42
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Non-MVC Web Framework

  1. 1. Non-MVC Web Framework前端工程師也能淡定地開發網站應用程式 Fred Chien
  2. 2. 我是誰?Who Am I
  3. 3. Fred Chien 錢逢祥
  4. 4. 永遠的大四生 Forever
  5. 5. StartupMandice Software.
  6. 6. StartupMandice Software.
  7. 7. 慣C救火 Startup 惡搞 Mandice Software. 創新
  8. 8. 慣C救火 JavaScript 惡搞 創新
  9. 9. cfsghost At gmail.com
  10. 10. Blogfred-zone.blogspot.com
  11. 11. Personal Website people.linux.org.tw/~fred/
  12. 12. 回到主題Non-MVC Web Framework
  13. 13. 正式提到 Non-MVC 之前 Some Stories
  14. 14. Web 的故事 Story of Web
  15. 15. 簡單來說
  16. 16. 商人眼中的 Web 發展 History of Web
  17. 17. Web 1.0做很多網頁來賺錢
  18. 18. 泡沫化
  19. 19. Web 2.0讓用戶自己做很多網頁來賺錢
  20. 20. Cloud嗯... 滿出來的錢
  21. 21. 但是
  22. 22. 工程師眼中的 Web 發展 As Developer
  23. 23. Homepage 做很多網頁
  24. 24. CGI伺服器有了多功能
  25. 25. Homepage + CGI 功能好多好開心
  26. 26. 泡沫化
  27. 27. CHomeGpagIe已經看不懂自己在寫什麼了
  28. 28. 救星
  29. 29. Web Framework有條理的整理我們的 code
  30. 30. 因為 MVC 的介入 降世於 Web
  31. 31. Web 從此...
  32. 32. 有臉蛋View
  33. 33. 有身材Model
  34. 34. 還有神秘的三角地帶 Controller
  35. 35. 從此 MVC 讓大家過著爽歪歪的日子 Happiness Forever
  36. 36. 一個星期前在 Node.js Taiwan 活動
  37. 37. 發現一個驚人的事實! Amazing
  38. 38. 強者都要自幹一套Web Framework
  39. 39. 我要當強者!於是我也自幹了一套 Web 框架
  40. 40. RedTea
  41. 41. RedTea這不是紅茶!這不是紅茶!
  42. 42. RedTea 是什麼?
  43. 43. Non-MVC 的嘗試 Experimental
  44. 44. githubgithub.com/cfsghost/redtea
  45. 45. 我沒有因 MVC 爽歪歪
  46. 46. 我只想要用 JavaScript
  47. 47. 回到原點思考 Thinking
  48. 48. 傳統 Web 開發不外乎... Traditional Web Development
  49. 49. HTML Page
  50. 50. Front-end JavaScript
  51. 51. Server-side ScriptingPHP, Python, RoR, ASP, .Net.....etc
  52. 52. MVC World Server-side Scripting Model Controller (Database) (Handler) View (Front-end) User
  53. 53. MVC World Server-side Scripting Model Controller (Database) (Handler) View (Front-end) User
  54. 54. 對!
  55. 55. 前端工程師
  56. 56. 只看臉蛋
  57. 57. 只專精前端
  58. 58. 難道就不能得到幸福嗎?
  59. 59. 郎情妾意劍就教不了
  60. 60. Non-MVCWeb Framework前端工程師的奸夫淫婦劍
  61. 61. 因為JavaScript只能寫前端
  62. 62. 然後有了光
  63. 63. Node.js我能用 JavaScript 寫後端了!
  64. 64. 可是碰了壁前後端開發經驗差好大!
  65. 65. 要會寫後端程式...
  66. 66. 學會組裝網頁把資料塞到網頁中送出去
  67. 67. 學會 GET/POST 機制接收各式各樣從 Client 送來的資料
  68. 68. 學會自定 API 和 Protocol 為了和前端 Ajax 套上
  69. 69. JavaScript != JavaScript 老子都不老子了
  70. 70. 為什麼 不能只用前端經驗?
  71. 71. 為什麼 後端的前戲這麼多?
  72. 72. 長驅直入才是王道!
  73. 73. Non-MVCWeb Framework前端工程師的奸夫淫婦劍
  74. 74. 如果
  75. 75. 你可以直接使用後端 Class不再需要再學會怎麼用 GET/POST 傳遞資料
  76. 76. 後端 API 就像 Browser 內建的 API不再需要設計 API Protocol 和學會 Ajax
  77. 77. 前端工程師時代容易上手,開發效率比 MVC 高
  78. 78. Browser-side JavaScript Codevar c = document.getElementById(content);var chat = RedTea.API.Chat();chat.conversation.push(Fred: Hello!<br>);chat.getConversation(function(err, data) { c.innerHTML = data;});c.innerHTML += chat.conversation.join();
  79. 79. Server-side JavaScript Codemodule.exports = { Chat: Chat };function Chat() { var self = this; this.conversation = []; this.getConversation = function(callback) { callback(null, self.conversation); }; ...}
  80. 80. 一個放上面,一個放下面
  81. 81. 會寫 JavaScript 就搞定! 這只有 JavaScript 才辦得到!
  82. 82. Convert source code to AST Compile AST to real Object Send AST to client Server-side Browser-side JavaScript JavaScript Class Script RPC
  83. 83. chat.getConversation(...);Operate chat.conversation.push(...) Caller Ajax/Web Socket Server
  84. 84. RedTea 開發四部曲● 決定 URL Path● 設計 Layout in HTML● 設計前端功能 (In JavaScript)● 設計後端功能 (In JavaScript)
  85. 85. RedTea 四大部份● Route (統一化的 routing 設定)● UI (如同 MVC 的 views)● API (Server-side Script)● Runner (Client-side Script)
  86. 86. Routing Runner index.jsGet /index UIindex.jade Browser
  87. 87. But
  88. 88. RedTea 只是原型不支援 Session, Auth......etc
  89. 89. 某一天在 IRC 上irc.freenode.net #Node.js-tw
  90. 90. 和 Caesar 討論未來可以應用的方向
  91. 91. 決定以 Express 重新包裝
  92. 92. 名字千挑萬選 Naming
  93. 93. Kamalan葛瑪蘭、嘎媽蘭
  94. 94. Kamalan Web Framework 台灣味的 Web Framework
  95. 95. 最重要的是
  96. 96. 全世界唯一神明認可 我有擲茭杯!
  97. 97. githubgithub.com/cfsghost/Kamalan
  98. 98. Feature 特色
  99. 99. Express 有的我們都有 All We Have
  100. 100. 而且
  101. 101. 使用方法一樣
  102. 102. 可是
  103. 103. RedTea 的機制還沒移植
  104. 104. Coming Soon
  105. 105. 為了表示歉意
  106. 106. Live Demo 也歡迎打臉
  107. 107. 第一個要求 打臉 的講者

×