摘要：隨著互聯網技術的發展，人們趨向于利用互聯網，進行一些商品和信息的交易。在國內，網上購物已經成為人們生活的一部分，通過便捷的網上交易，滿足各自的需求?，F如今，疫情的到來，讓運動健康成為了時代熱門話題，人們更加關注其自身健康，注重身體健康的標準，對健身方面的物品需求變得越來越大。為了使健身購物更一目了然，網站功能簡潔，界面新穎，內容充實。本文詳細闡述以Vue腳手架搭建網站前端的基本框架，使用CSS，HTML完成頁面布局，運用Node.js完成服務器端與數據庫之間的功能和數據的互通等技術設計的展示健身商品和購物交易的過程。本平臺的搭建，可有效實現對健身商品領域需求的補缺，通過熱門商品推薦、購買商品、活動中心以及個人中心等模塊，把商品做到統一規劃，以擴大對健身商品和知識方面的宣傳。實現一個功能完整，性能穩定，操作界面友好的購物平臺，讓用戶快捷有效的達成在健身購物平臺上商品的交易。

關鍵詞：HTML、CSS；Vue框架；MVVM設計模式

目 錄

摘 要

Abstract

1  前言-5

1.1 課題背景-5

1.2 課題現狀-5

1.3 課題意義-6

2  需求分析-7

2.1 可行性-7

2.2 功能需求-7

2.3業務流程-8

3  開發概要介紹-9

3.1開發工具-9

3.2開發技術-10

4  健身購物平臺的設計-11

4.1 運行環境-11

4.2 功能模塊-11

    4.2.1 前端設計-12

4.3 數據庫-13

4.3.1 數據庫實體類字段-13

5  健身購物平臺的實現-16

5.1 注冊與登錄-16

    5.1.1 用戶注冊-16

5.1.2 用戶登錄-16

5.2 主頁面-16

5.3 熱門推薦-17

5.4 商品購買-17

5.5 活動社區-18

5.6 個人中心-18

5.6.1 用戶信息-18

5.6.2 我的收藏-18

5.6.3 查看訂單-19

5.6.4 用戶評價-19

6  測試-20

6.1 測試目的-20

6.2 測試的主要內容-20

6.3 測試結果-20

結  論-22

致  謝-23

參考文獻-24