image

image.png

系統模組說明Web端功能

1.影片播放：我們會將所有影片放到網站上，這個影片播放功能與bilibi首頁有些類似，上面會放一些課程的列表，點進去之後就會看到這個課程會有多少課時。

6.技術棧：從目前來看採用vue、bootstrap-vue、SSR。如果單獨使用vue的話，其它並不需要服務端渲染。我們只需要將功能實現就可以，但是當你的Web端要做搜尋引擎最佳化的時候，還是需要SSR的。例如：https://afdian.net/

image.png

注意：當在檢視網頁原始碼的時候，頁面中除了標題外，內容中的文字一個都沒有(vue的專案都是這樣的，它會會將所有的程式碼都打包到一個index.js中)。所以對於百度來說，它只看原始碼，不會看介面上的文字的。所以這個網站的收視率就會非常的差，我們在百度上搜索不到文字的。所有加入SSR服務端渲染之後，我們在頁面中看到什麼文字，在原始碼中就會看到同樣的文字。只有這樣百度才能搜尋到。到時候我們會使用NestJS來實現。

image.png

image.png

管理端功能

1.影片管理

2.基礎資訊管理

3.訂單管理

4.使用者管理

5.廣告位管理:如果在網頁中放入一些輪播圖，都會需要廣告位管理，後臺可以隨時方便替換一些圖片

技術棧：vue、Element UI：bootstrap css 可以防止調整邊距。

微信小程式APP端功能

我們主要實現的是Web端，但是我們會考慮到在首頁上面去實現這些功能是沒有必要的。因為我們大多數人在沒有電腦的時候，使用手機看到情況會比較多。同時我們也是為了要介紹全棧開發，所以一定要包括APP端和小程式端。

這裡有個問題是比較重要的，就是在Web端和其它端都可以很方便的去實現支付功能，一但嵌入到APP端這個支付就需要小心一點了。微信和支付寶的支付在Android上面是沒有問題的。哪怕你所購買的是虛擬物品，但如果在平果上面你一定要走平果的內部支付，而且這個支付平果會抽取30%的手續費，所有說你賣的是虛擬物品的話，你賣出10元錢就會給平果3元錢。當然這個並不是平果的問題，因為如果是在國外的話，使用Andriod谷歌支付也是需要交手續費的。只不過在中國大陸，谷歌的服務支援的不是很好，所以基本上所有Android都不會使用谷歌的支付系統，而是使用微信和支付寶的支付。這是對虛擬物品的一個限制，當然如果你賣的是實物就沒有什麼問題了。像淘寶京東都是可以使用微信和支付寶來支付的。小程式會更加嚴格一些，是不能進行虛擬物品的購買，這需要我們自己去檢視一下小程式的相關條款。所以小程式儘量只實現功能，不要實現支付，支付在Web端來實現就可以。

服務端

服務端會包含兩塊，因為我們的後臺管理介面上面針對每一種東西的管理(增、刪、改、查)都是需要介面的，像影片的管理，基本資訊的管理、訂單管理都是需要(增、刪、改、查)介面的。所有說我們有一個管理端的介面，裡面使用的技術棧為Nest.js、MongoDB。

另外一個服務端就是給我們的包括Web端、APP端、小程式端都可以使用的一個介面。給客戶端使用的介面，它們兩者之間差別會比較大，因為後端需要任何元素的(增、刪、改、查)，而在APP上面其實是不需要(增、刪、改、查)的，決大部分都是在查詢，然後會有一些簡單的向資料庫中錄入資料的東西，比如說註冊、點贊、評論的時候需要錄入資料。但是不可能在APP或小程式或Web端來實現影片的新增功能，因為這是需要在後臺新增的。