基于NodeJS+MongoDB的響應式企業(yè)網(wǎng)站開(kāi)發(fā)發(fā)布者：本站     時(shí)間：2020-05-05 12:05:36

隨著(zhù)信息技術(shù)的高速發(fā)展，數字化、信息化的網(wǎng)絡(luò )技術(shù)已經(jīng)被更多的人接受并融入了我們的日常生活和工作。企業(yè)也越來(lái)越多地要和外界進(jìn)行信息溝通，通過(guò)不同的客戶(hù)端展示自己的企業(yè)文化和風(fēng)采。近幾年興起的HTML5，以它良好的用戶(hù)體驗、嚴謹清晰的代碼結構、便捷的維護管理、跨平臺開(kāi)發(fā)及較低的開(kāi)發(fā)成本等優(yōu)勢不斷滿(mǎn)足企業(yè)網(wǎng)站的各種需求。

如今，利用移動(dòng)設備訪(fǎng)問(wèn)企業(yè)網(wǎng)站的頻率遠遠高于傳統的PC，傳統的網(wǎng)站開(kāi)發(fā)技術(shù)又難于兼容所有的移動(dòng)設備尺寸，企業(yè)為了在不同的移動(dòng)設備上都能完美的展示自己的企業(yè)文化、發(fā)布產(chǎn)品信息和企業(yè)動(dòng)態(tài)、優(yōu)化與用戶(hù)的交互過(guò)程，開(kāi)始重新構建基于HTML5+Bootstrap模式的響應式網(wǎng)站。這樣不僅更加直觀(guān)的展示信息給用戶(hù)，而且加強了用戶(hù)溝通，提升用戶(hù)體驗[1,2]。

1 、系統開(kāi)發(fā)的相關(guān)技術(shù)

該系統設計語(yǔ)言采用NodeJS，系統框架采用Express技術(shù)，數據庫開(kāi)發(fā)采用MongoDB。系統支持Windows、Linux和MacOS等現在流行的主要系統。NodeJS是一個(gè)基于Chrome JavaScript運行時(shí)建立的開(kāi)發(fā)平臺，響應速度快、易于擴展，使用事件驅動(dòng)，非阻塞I/O模型，非常適合在分布式設備上運行。Express是一個(gè)基于NodeJS平臺的簡(jiǎn)單靈活的web應用開(kāi)發(fā)框架，它提供一系列強大的特性，幫助創(chuàng )建各種Web和移動(dòng)設備應用。而MongoDB是現今最流行的一類(lèi)NoSQL數據庫，具有操作簡(jiǎn)單、性能高等特點(diǎn)。

1.1 、HTML5[3,4]

隨著(zhù)移動(dòng)互聯(lián)網(wǎng)的飛速發(fā)展，目前html5技術(shù)也得到了不斷的完善，開(kāi)發(fā)技術(shù)方面越來(lái)越成熟了，成為了目前主流的開(kāi)發(fā)語(yǔ)言之一。

HTML5可以實(shí)現移動(dòng)開(kāi)發(fā)、游戲開(kāi)發(fā)、跨瀏覽器開(kāi)發(fā)等多平臺開(kāi)發(fā)任務(wù)，它能夠支持音視頻，具有清晰的代碼結構，可實(shí)現更好的互動(dòng)體驗。這一前端開(kāi)發(fā)主流語(yǔ)言技術(shù)將會(huì )被越來(lái)越多的個(gè)人開(kāi)發(fā)者或者企業(yè)開(kāi)發(fā)商所青睞。

1.2、 NodeJS

NodeJS[5]是一個(gè)可以快速構建網(wǎng)絡(luò )服務(wù)及應用的平臺。作為JavaScript服務(wù)端的開(kāi)發(fā)平臺，開(kāi)發(fā)簡(jiǎn)單、易于擴展。同時(shí)，由于NodeJS具有事件驅動(dòng)，異步、非堵塞I/O，單線(xiàn)程等優(yōu)勢，因此在開(kāi)發(fā)高并發(fā)網(wǎng)絡(luò )服務(wù)時(shí)，性能非常出眾；NodeJS占用系統資源少，運行成本低；NodeJS對GoogleV8[6]引擎進(jìn)行了封裝，執行JavaScript的速度快、效率高。

1.3 、MongoDB

MongoDB[7]是一個(gè)基于分布式文件存儲的NoSQL數據庫，由C++編寫(xiě)的，存儲數據方便、性能高[8]。

2 、系統分析

2.1 可行性分析

(1）技術(shù)可行性[10]：本系統支持Windows、Linux及MacOS等多平臺搭建系統；數據庫采用NoSQL——MongoDB，并利用mongoose來(lái)管理數據庫，避免了sql語(yǔ)言的直接接觸；框架使用express；前端設計利用jade模板引擎結合bootstrap樣式，簡(jiǎn)化代碼的同時(shí)，界面更加美觀(guān)，更加人性化，因此，從技術(shù)上來(lái)說(shuō)是相對容易實(shí)現的。

(2）經(jīng)濟可行性：由于選擇的開(kāi)發(fā)工具和服務(wù)器可以使用免費的開(kāi)源軟件，因此，本系統在經(jīng)濟上投入低，系統建成后，將為企業(yè)文化和產(chǎn)品宣傳提供很大的方便[9]。

2.2、 需求分析

根據相關(guān)調研及企業(yè)網(wǎng)站的需求分析[11]，發(fā)現目前企業(yè)網(wǎng)站包含的內容逐步增多，使得網(wǎng)站的主要展現的內容的得不到充分的展示，本系統主要通過(guò)對傳統的企業(yè)網(wǎng)站的簡(jiǎn)化，實(shí)現企業(yè)文化、企業(yè)精神及相關(guān)突出信息的重點(diǎn)展示與宣傳。

3 、系統前端功能設計與實(shí)現

3.1、 前端結構與布局設計[12]

本網(wǎng)站主要用于企業(yè)的文化和產(chǎn)品展示、信息和動(dòng)態(tài)發(fā)布、公司招聘等功能。具體的功能模塊分為網(wǎng)站首頁(yè)、產(chǎn)品展示、品牌故事、最新動(dòng)態(tài)、團隊介紹和聯(lián)系我們等6個(gè)功能模塊，每個(gè)功能模塊分為幾個(gè)小的功能模塊[13]，功能模塊如圖1所示。

3.2 、系統分層開(kāi)發(fā)

為了降低開(kāi)發(fā)成本，提高開(kāi)發(fā)效率，按照企業(yè)網(wǎng)站功能模塊的劃分，系統開(kāi)發(fā)按功能模塊分層開(kāi)發(fā)。整個(gè)開(kāi)發(fā)過(guò)程大致分為：搭建總體結構，設計模塊，制作頁(yè)面設置，搭建底層JS腳本[14]，設計JS交互效果，內部測試，優(yōu)化代碼等。

3.3、 編寫(xiě)系統代碼

在編寫(xiě)系統代碼時(shí)，按照功能模塊的開(kāi)發(fā)次序，先編寫(xiě)HTML布局，再進(jìn)行CSS的開(kāi)發(fā)。

3.4、 系統內部測試及后期優(yōu)化

前端測試[15]，先對頁(yè)面效果和設計圖進(jìn)行比對，逐步優(yōu)化頁(yè)面細節。再利用不同尺寸和規格的設備，查看頁(yè)面的兼容性。最后再進(jìn)行代碼優(yōu)化，提高訪(fǎng)問(wèn)速度。

圖1 企業(yè)網(wǎng)站前端模塊劃分圖

4 、系統后臺管理系統的設計與實(shí)現

4.1、 系統管理界面功能設計

系統后臺管理系統主要是對前端頁(yè)面展示內容的即時(shí)更新，還有公司相關(guān)管理人員的權限的設置管理。主要管理的模塊有：管理員權限、職務(wù)管理、辦公環(huán)境、產(chǎn)品管理、新聞發(fā)布等，頁(yè)面布局采用當前比較流行的扁平化趨勢[16]，簡(jiǎn)潔明了的展示頁(yè)面的主要管理功能。

4.2 、系統數據庫的搭建

本系統數據庫采用NoSQL—MongoDB[17]運行，管理利用mongoose來(lái)實(shí)現，不需要使用sql語(yǔ)言進(jìn)行直接接觸。MongoDB是一個(gè)基于分布式文件存儲的NoSQL數據庫，由C++編寫(xiě)的，存儲數據方便、性能高。