2013年12月8日 星期日

[Node.js Web Framework] Sails 檔案目錄結構

上一篇 [Node.js Web Framework] Sails 介紹與安裝 提到,如何安裝 sails 。
這一篇會接續上一篇所建立的 sails 的 web 目錄做一些簡單的說明。

1. sails new newProject
2. cd newProject

上次第一個步驟我們使用 sails new 專案名稱,初始化一個新的專案,叫做 yourNewProjectName , 不過在今天這個範例我是把我的 project name 叫做 newProject。接著我們打開 (cd) 這個 newProject 資料夾。




第一層目錄
newProject 第一層的目錄
  • api 資料夾:
    主要是放置整個網站的 controller 跟 model 的部分,還有 service, adapters, policies (api 資料夾是整個 application 蠻重要的資料夾,後面再多加說明)。
  • assets 資料夾:
    放置靜態的檔案,如 favicon.ico, css 檔案, JavaScript 檔案, image 圖檔等等。
  • config 資料夾:
    偏全站設定的檔案幾乎都會在此,比較常用到的設定像是 routes.js , csrf.js, policies.js  等等都在此資料夾。
  • node_modules 資料夾 :
    這個使用 npm 管理 package 會出現的資料夾 (從 npm 下載下來的本地端模組) ,裡面放的都是一些相依性套件的檔案,(個人習慣:通常我都會把 node_modules 放到 .gitignore)。
  • views 資料夾:
    以 sails 的 MVC 架構來說,V 就是放在 views 這個資料夾,倘若你使用的是 ejs 的 Template Engine,那麼預設會有幾個附檔名為 .ejs 的檔案,而使用 sails lift 啟用 server 服務時所看到的畫面,就是 views/home/index.ejs 的內容。
    另外值得順帶一提的是,views/layout.ejs 可以說是網站的一個模板,預設就會有這個 layout.ejs 這個檔案,他的內容就是整個 html 的 <head> 標籤的內容跟載入共同 JavaScript 的部分,當你第一次訪問到 http://localhost:1337 ,他的確是 render 到 views/home/index.ejs 沒錯,但是外層控制要載入哪些 css 以及 JavaScript 其實是 layout.ejs。 
  • Gruntfile.js:
    這是 Grunt 的設定檔,有助於前端開發的工具設定 (如果有需要用到 linker 的話,值得注意這個部分),可以參考 http://sailsjs.org/#!documentation/assets
  • package.json :
    就是整個 application 的設定跟說明檔 (請容許我這樣簡單的說明...) ,以及進入點 main (通常會寫 app.js ),這個檔案對我來說最重要的就是可以知道這整個 applicaion 需要哪些相依性套件以及版本, 當我第一次拿到這個 application 的資料夾時,我才能透過 npm install/update 取得或更新其所需要的相依性套件。
  • README.md 我就暫時先跳過了。


我自己個人是認為,其實這裡只要大概知道整個 sails 的 MVC 架構的資料夾分別在那裡,以及靜態檔案 (assets) 放哪,view 的檔案在哪裡, routes 設定檔, 我覺得也就差不多了。

其餘的像是 policies, service, adapter 這些名詞的檔案,比較偏向 sails 這個 Web Framewrok 的設計。只知道名詞,很難知道他要拿來做些什麼,但我只能依照我的水平大概解釋一下,詳細的功能跟用法,還需要各位朋友透過實作體會,會比較清楚。



API 資料夾

  • adapters 資料夾 : 主要放置一些用來跟 database 連結用的檔案。
  • controllers 資料夾 : Controller 的檔案。
  • models  資料夾:models 的檔案。
  • policies 資料夾:一些使用者的存取權限規則,這裡的 policies 寫的檔案都是偏一些邏輯上的判斷,以及流程上的控制,比方說有個 isAdmin.js 用來判斷是不是管理員,是的話該做什麼...不是的話又該做什麼....,跟 config/policies.js 不太一樣,config/policies.js 是純粹針對不同的 controller 或是 method 做 policies 的設定,比方說我的首頁就需要有 isAdmin 這個 policies,可能就會設定 'home': 'isAdmin' 類似這樣一組的 key 跟 value 的對應,當然了,一個 controller 或是 models 也能有多個 policies。
  • service 資料夾:(待確認,我現在還不清楚這個資料夾的用意)


以上是我個人最近看 sails 的一些整理,如果有錯誤還希望大家幫忙指正,謝謝。


老實說 Sails 的 MVC 架構蠻清晰的,不知道是不是檔案結構的分法界定比較明確,v 就放 views, c 就放 api/controller, v 就放 api/models,我比較不會把 code 放錯地方,之前用 Express 常常不確定什麼 code 該放什麼地方(也有可能是我不熟),而且,某種程度上來看,這樣的 MVC 架構跟我過去所接觸過的 PHP Framework CodeIgniter 感覺蠻像的,不同 Controller 有相對應的 views 的資料夾,以及 model 的設定,頗有親和力 :),有種 moving  from PHP to Node 的感覺,至於是不是無痛轉移呢?這就要看個人的造化了~。


參考:




沒有留言:

張貼留言

若你看的文章,時間太久遠的問題就別問了,因為我應該也忘了... XD

Vue multiselect set autofocus and tinymce set autofocus

要在畫面一進來 focus multiselect 的方式: 參考: https://jsfiddle.net/shentao/mnphdt2g/ 主要就是在 multiselect 的 tag 加上 ref (例如: my_multiselect), 另外在 mounted...