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

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

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

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

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

1.1 、HTML5[3,4]

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

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

1.2、 NodeJS

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

1.3 、MongoDB

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

2 、系統(tǒng)分析

2.1 可行性分析

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

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

2.2、 需求分析

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

3 、系統(tǒng)前端功能設(shè)計(jì)與實(shí)現(xiàn)

3.1、 前端結(jié)構(gòu)與布局設(shè)計(jì)[12]

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

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

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

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

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

3.4、 系統(tǒng)內(nèi)部測(cè)試及后期優(yōu)化

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

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

4 、系統(tǒng)后臺(tái)管理系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)

4.1、 系統(tǒng)管理界面功能設(shè)計(jì)

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

4.2 、系統(tǒng)數(shù)據(jù)庫(kù)的搭建

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