---
# System prepended metadata

title: 寒假作業
tags: [課程]

---

# 寒假作業
###### tags: `課程`
寒假作業分為兩個部份，線上課程跟實做一個express+mongodb的留言板
建議先看完線上課程再做留言板
## 線上課程
我們是使用codecademy，它是互動式的教學課程，會一步一步帶你做
**一定要完成的有這兩個課程:**
**html**----https://www.codecademy.com/learn/learn-html
**css**----https://www.codecademy.com/learn/learn-css
這兩個課程是我們在寫網頁前端時必定會用到的工具

**推薦看但不一定要完成的課程:**
**javascipt** https://www.codecademy.com/learn/introduction-to-javascript
**react** https://www.codecademy.com/learn/react-101
這個主要是寫後端的時候會用到，教的大部分是一些語法
如果覺得自己程式能力還不夠好的最好看一下

課程裡面會有一些章節有標記pro那個是要錢的，可以直接跳過沒關係
html跟css的課很重要一定要看完。
寒假開始前會跟你們說要在什麼時候之前把這兩個課程看完，要記得看。
看完之後截圖傳到discord群組，像這樣:
![](https://i.imgur.com/6SQK3Gf.png)
## 留言板
雲端硬碟有留言板的範例程式(example_blog.zip)，這個資料夾的範例碼就是用express+mongodb寫出來的一個簡單的留言板。

請參考這個code 上面的線上課程跟我們給的書(基本上是nodejs那本，建議看完做出一個留言板。
後端功能做完之後有餘力也可以用上面學到的東西幫自己的網站美化一下。

寫這個留言板是為了讓你們熟悉express框架，之後暑假正式上工的時候也是用這個框架。
這個作業用express+mongodb，寫完之後應該會對一個網站的前後端架構，mvc模型有更深入的了解。

### 網站的大概架構
1. 首頁
    * 註冊頁面(可以註冊個帳號)
    * 登入頁面
    * 文章檢視
    **登入就不會看到註冊、登入
    但是可以登出跟發文或刪除跟修改自己的文章**
2. 檢視文章頁面
    * 可以留言
    * 可以刪除修改自己的留言
    
    完成所有功能後你們應該會很清楚要如何讓網頁可以有新增修改刪除
    
### express框架裡重要的資料夾
* views這裡面是所有網頁html內容
* public這裡面是放圖片、排版的css檔、前端會用到的東西
* routes這裡面是控制後端,所有的router都在這裡面，每跑一次網址都會經過裡面
* models這裡面每個檔案都是一種資料的模板

在寫的時候一定會有一堆問題，常見的解決方法就是google大神，但關鍵字要打對

### **以下是一些有幫助於解決問題不錯的網站**

**前端用**
https://codepen.io/
**測試好用**
https://www.w3schools.com/
各種網頁知識都有主要是前端

https://www.runoob.com/css/css-tutorial.html

**後端用**
https://expressjs.com/zh-tw/api.html#express
express官網,有很多常用的function的範例

https://mongoosejs.com/docs/populate.html
寫後端很多要用到的function都在這裡面有解釋

**其他**
https://stackoverflow.com/
https://developer.mozilla.org/zh-TW/
https://ithelp.ithome.com.tw/
https://www.itread01.com/
https://www.csdn.net/

最後有任何問題都可以問我們！！！
