基于Web技術(shù)的校園體育用品租借App設(shè)計

梁天成 劉博文 朱立鍇

摘要：目前，隨著人類生活質(zhì)量的提升，學生的活動意識也逐漸強化，特別是在新冠肺炎疫情背景下，體育運動成了在校大學生課余生活的重要組成部分，但部分體育用品價格昂貴，開發(fā)相應(yīng)的體育用品租借系統(tǒng)就顯得尤為重要。文章利用Web系統(tǒng)的前后端框架技術(shù)，開發(fā)一款校園體育用品租借App平臺，對學生閑置的體育用品進行線上整合，通過線上或線下兩種方式完成租借活動，平臺上的閑置體育用品同樣可以進行二手出售，用戶可根據(jù)需要選擇，為當代大學生提供一個更加適應(yīng)當下活動模式的可靠服務(wù)平臺，使學生閑置的體育用品在另一部分有需求的學生身上發(fā)揮價值，營造一個更加積極的校園運動環(huán)境。

關(guān)鍵詞：Web；體育用品；租借；App；前后端分離

中圖分類號：TP311.1文獻標志碼：A

0 引言

隨著生活水平的日益提升，人們越來越注重體育鍛煉，但有部分體育活動對體育器材的依賴性較大且對學生群體而言成本較高，很多學生也因此止步。在傳統(tǒng)模式下，體育用品一般采用直接售賣的模式，無論是全新的還是二手的，這對于只想嘗試尚未確定是否要持續(xù)開展此項體育活動的人群而言不太友好。校園體育用品租借App系統(tǒng)的開發(fā)正好可以解決這一系列問題，將雙方的活動范圍局限于校園中，平臺也將對價格與質(zhì)量進行把控，這樣的活動模式不僅響應(yīng)國家鼓勵廣大人民參與體育鍛煉的號召，還可以對大學運動風氣的建設(shè)起到推進作用，豐富疫情背景下學生的校園生活。

1 應(yīng)用現(xiàn)狀

傳統(tǒng)的線下二手體育用品多為直接售賣，缺點是效率低、渠道窄，無法跟上移動互聯(lián)網(wǎng)的熱潮，且只能售賣、不可租賃，特別是二手用品，一旦售出不可退換，售后難以保障。本研究通過開發(fā)一款校園體育用品租借App，能較好地解決這些問題。相比于傳統(tǒng)二手交易，其優(yōu)勢在于能夠加快體育用品行業(yè)和移動互聯(lián)網(wǎng)產(chǎn)業(yè)的融合，用戶只須在應(yīng)用程序上完成簡易的操作，就可以做到體育用品的租借，無須購買，對于只想嘗試一次或運動頻率不高的人群而言性價比更高。設(shè)計的關(guān)鍵就在于如何在校園中實現(xiàn)閑置體育用品的有效處理、交易渠道與交易規(guī)模的完善、響應(yīng)智能終端的快速發(fā)展。

2 Web發(fā)展新技術(shù)優(yōu)點

隨著信息技術(shù)的發(fā)展，互聯(lián)網(wǎng)已經(jīng)深入各行各業(yè)，產(chǎn)生了非常大的影響。計算機技術(shù)、網(wǎng)絡(luò)技術(shù)和信息通信技術(shù)快速發(fā)展，高校要適應(yīng)這樣的環(huán)境，完全依靠PC端已經(jīng)落伍了，必須積極地開發(fā)能夠適應(yīng)移動端的產(chǎn)品，才能更好地適應(yīng)時代的發(fā)展。目前，眾多開發(fā)企業(yè)不僅重視對Web開發(fā)技術(shù)的研究，不斷提高自身的管理水平，也擁有較為成熟的Web開發(fā)技術(shù)能力，完善Web系統(tǒng)開發(fā)的流程［1］。

傳統(tǒng)App開發(fā)方式能夠訪問手機的所有功能，比較快捷地使用移動設(shè)備端提供的接口，并支持大量的圖形和動畫，其缺點是針對Android和iOS兩種系統(tǒng)均獨立開發(fā)對應(yīng)的App，無形地提高了開發(fā)成本。而運用Web技術(shù)延伸的Web App的本質(zhì)是通過瀏覽器訪問Web應(yīng)用，配合移動端UI框架，使其適合顯示在移動端設(shè)備，因此，Web App也可以運行在Android、iOS和PC上，但也有一些缺點，例如，對移動設(shè)備的硬件功能使用會有缺失，訪問頁面須重新加載內(nèi)容，從而導致頁面內(nèi)容的渲染速度不及App系統(tǒng)開發(fā)，瀏覽速度也與手機終端性能和網(wǎng)絡(luò)環(huán)境掛鉤，容易被其影響。綜合考慮兩種設(shè)計App的優(yōu)缺點，結(jié)合當前網(wǎng)絡(luò)環(huán)境和當代學生對移動設(shè)備的依賴，基于Web相關(guān)技術(shù)開發(fā)的校園體育用品App系統(tǒng)更能夠跟上時代的腳步，在現(xiàn)今移動設(shè)備應(yīng)用普及的背景下，為全體學生提供一個更方便的體育活動環(huán)境，豐富學生的校園生活，選擇Web App顯然是一種更為明智的方案。

3 校園體育用品租借App的設(shè)計

3.1 校園體育用品租借App系統(tǒng)框架

目前，越來越多的企業(yè)通過Web技術(shù)完成一系列產(chǎn)品的開發(fā)。雖然傳統(tǒng)的Web開發(fā)仍有許多讓人詬病的情況，例如畫面表現(xiàn)力差、瀏覽數(shù)據(jù)丟失等情況。但在互聯(lián)網(wǎng)技術(shù)高速發(fā)展的現(xiàn)在，應(yīng)用SpringBoot+Vue前后端分離技術(shù)搭建前后兩端可以解決諸多問題。App使用Element.UI作為UI層關(guān)鍵技術(shù)，所以App在技術(shù)上可以與現(xiàn)在主流的地圖導航App（如高德地圖、騰訊地圖等）更好地結(jié)合，并實現(xiàn)體育用品租借地點的智能導航。在數(shù)據(jù)庫的永久數(shù)據(jù)選擇中使用MySQL數(shù)據(jù)庫，具有體積小、速度快、總體成本低、開放源代碼等優(yōu)點，因此得到了較為廣泛的應(yīng)用。

系統(tǒng)設(shè)計總框架如圖1所示。

3.2 系統(tǒng)表現(xiàn)層的相關(guān)設(shè)計

該系統(tǒng)在表現(xiàn)層的設(shè)計上對App移動端和PC端采取不同設(shè)計。

App移動端上將使用Element.UI作為關(guān)鍵技術(shù)搭建平臺，Element.UI作為一套基于Web系統(tǒng)的組件庫，擁有非常多的優(yōu)點。站在開發(fā)者的角度，組建指令的設(shè)計與正常生活的流程、邏輯保持一致；站在用戶的角度，簡化的流程與清晰的步驟可以讓用戶得到更好的使用體驗［3-4］。在將Element.UI作為交UI層的基礎(chǔ)上使用Vue作為交互層的情況下，可以通過自定義的Vue指令實現(xiàn)對平臺數(shù)據(jù)的快速搜索，尤其是結(jié)合大數(shù)據(jù)的關(guān)鍵詞搜索能力，可以做到對龐大信息的篩選以解決網(wǎng)頁的卡頓現(xiàn)象。相信這不僅會提升用戶體驗，也將優(yōu)化管理系統(tǒng)對Web系統(tǒng)后臺數(shù)據(jù)的整理。Vue是一個漸進式輕量級框架，在Vue生態(tài)系統(tǒng)的庫與第三方庫的整合下，可以驅(qū)動更復雜的Web頁面［5］。

PC端使用Bootstrap前端開發(fā)框架。這種開發(fā)框架優(yōu)點也同樣良多，例如，代碼編寫較為簡單、開發(fā)人員更容易上手、可以降低管理員學習成本、縮短系統(tǒng)開發(fā)周期等。基于Bootstrap框架設(shè)計的頁面具有強悍的頁面適應(yīng)能力，可以輕易地適應(yīng)不同設(shè)備的不同頁面大小，在頁面布局上可以更好地規(guī)劃內(nèi)容。Bootstrap技術(shù)的高速發(fā)展使之擁有更多、更強大的內(nèi)置Web組件，可以更好地完成頁面的導航、進條度、縮略圖等，使用基于Bootstrap框架設(shè)計的頁面可以使展示的內(nèi)容獲得更加豐富的表現(xiàn)形式。

3.3 API接口的相關(guān)設(shè)計

應(yīng)用業(yè)務(wù)層主要以SpringBoot為框架技術(shù)并搭建系統(tǒng)的API接口。API接口作為系統(tǒng)總設(shè)計的架構(gòu)核心點，在平臺的正常運行上起著至關(guān)重要的作用。用戶在進行網(wǎng)頁的相關(guān)操作時，運行Web服務(wù)器對用戶的操作數(shù)據(jù)進行處理，再通過Web服務(wù)器返還數(shù)據(jù)經(jīng)處理后得到的結(jié)果［6-7］。

3.4 App功能流程

隨著互聯(lián)網(wǎng)技術(shù)的運用更加成熟與可靠，現(xiàn)在對一款應(yīng)用程序的設(shè)計也更加方便與簡潔。在產(chǎn)品的使用上，用戶以賬號登錄后就可以進入程序，然后錄入自己對體育用品的租借類型、時間、地點等需求，后臺數(shù)據(jù)再對已經(jīng)存入庫中的體育用品數(shù)據(jù)進行篩選，選擇出較為合適租借的幾款對象，供用戶選擇。功能使用流程總框架如圖2所示。

3.5 校園體育用品App的社會效益

該設(shè)計目的主要是促進校園運動風氣的建設(shè)，為學生創(chuàng)造一個更方便與快捷的運動環(huán)境。相信這樣龐大的學生群體可以產(chǎn)生足夠的吸引力，吸引很多運動品牌加入校園風氣的建設(shè)，無論器具還是活動教學，都可以更加完善，實現(xiàn)互惠共利。

4 結(jié)語

校園體育用品租借App是基于SpringBoot+Vue前后端分離技術(shù)搭建的系統(tǒng)平臺，無論是在移動端還是電腦端上，都可以穩(wěn)定地運行并保證用戶的使用體驗，再結(jié)合Element.UI，Bootstra，Vue，SpringBoot等豐富的組件或插件內(nèi)容，該平臺獲得了不俗的活動內(nèi)容展示能力。該App設(shè)計的線上交易活動模式也可以將體育用品租借這一社會剛需活動控制得更加合理。

參考文獻

［1］陳徐毅.移動互聯(lián)時代Web與APP的技術(shù)應(yīng)用之爭［J］.中關(guān)村，2022（7）：46-47.

［2］鄭煜榮.基于軟件工程的Web開發(fā)技術(shù)［J］.中國新通信，2021（11）：65-66.

［3］馬雪山，張輝軍，陳輝，等.前后端分離的Web平臺技術(shù)研究與實現(xiàn)［J］.電子技術(shù)與軟件工程，2022（8）：70-73.

［4］綦慧，徐曉慧.基于Web系統(tǒng)的大數(shù)據(jù)搜索技術(shù)的實現(xiàn)和優(yōu)化［J］.計算技術(shù)與自動化，2021（2）：17-19.

［5］黃旭日，胡偉平.“智游小盒”旅游APP的設(shè)計與分析［J］.無線互聯(lián)科技，2021（21）：60-61.

［6］張晶晶，曹雙雙，楊怡潔，等.基于Bootstrap框架的響應(yīng)式網(wǎng)站設(shè)計［J］.電腦知識與技術(shù)，2020（34）：247-248.

［7］楊暉.高校計算機網(wǎng)絡(luò)平臺設(shè)計與應(yīng)用策略研究［J］.信息與電腦（理論版），2018（6）：16-17.

（編輯 （王雪芬）