在完成 express.js 的「安裝」後，我們要回到前端，來將設計「切板」出來了。不過嚴格來講，我們的設計可以完全由CSS來完成，所以其實是無圖可切的。在這個專案，我們採用了 Jade 和 Stylus，所以我們不會直接寫 HTML 和 CSS。

Jade 的語法是用一個 css selector 來代表一個 HTML，並且使用縮排，不需要結尾標簽。所以寫起來十分簡潔快速。例如

article#main
     h1.title 文章標題
     p 文章內容
     p 文章內容

會編譯成

<article id="main">
     <h1 class="title">文章標題</h1>
     <p>文章內容</p>
     <p>文章內容</p>
</article>

Stylus 則是一個可以編譯成 CSS 的語法。他有各種功能讓你節省寫 CSS 的時間。同時讓你可以省略分號和大括號，用縮排取代。例如我可以寫

.header
  a
    color: red

會編譯成

.header a {
color: red;
}

在這個專案中，我們也用 bootstrap，加速我們的開發。用了 bootstrap之後，我們可以一行 CSS 都不寫，只寫 HTML 就完成與 PSD 9成像的頁面。

再修改一下CSS，就完成我們的「切板」了。