信息類大一新生,想在假期時間自己寫一個小網站,那麼具體實現時應該如何對前端和後端的功能進行劃分?

具體例子:假設一個頁面可以根據用戶的設置在頁面中添加到其他網站的外鏈,這些鏈接顯然保存在後端資料庫,那麼是應該在前端頁面ajax獲取到這些網址,再用jQuery中append之類的方法動態添加到頁面中,還是應該讓伺服器端寫完整個頁面的HTML代碼,讓瀏覽器直接渲染這些代碼呢?PS:剛剛接觸網站開發,對更多高級技術並不了解,請見諒。


初學者開發個人網站的目的一般都是通過實際開發增長經驗,所以題主不妨兩種都嘗試一下……一部分頁面由後端去套模板,一部分頁面用 Ajax+API,然後都使用過之後再來比較兩種方法的優缺點分別在哪裡。

或者也可以以你未來期望的發展方向為主軸。如果題主未來更傾向於做後端,那就應該更多的用後端處理問題,才能學習到更多後端相關的東西,前端同理。


1.我現在寫項目一般都是前後端分離 後端只關注後端流程不參與頁面生成,只提供數據和服務, 前端獲取數據後自己渲染。 2. 沒必要append去動態生成,你可以先預設展示外鏈的列表隱藏起來 需要顯示的時候從後端查詢然後顯示就可以了

3.現在前端有很多mvvm框架,比如vue.js,angular.js你可以了解一下。


首先,不建議把目標定太高,網站看似功能簡單,但是對美工、交互要求很高,對於剛入門的同學而言自己做的系統與業界網站差距太大,反而會產生心理落差,產生挫敗感。

如果向快速搭建一個網站,建議使用已有的成熟的框架,如Joomla、WordPress等,類似這些框架在模板、內容管理、模塊化、用戶管理、許可權管理等方面已經非常成熟,用XAMPP +開源框架半天就可以搭建一個網站。

自己興趣開發的話,建議可以做個小型的管理系統,如學生信息管理系統,顯示層可以採用Bootstrap或者easyUI等前端框架,控制層可以基於SpringMVC進行構建,後台資料庫採用MySQL。功能看似簡單,但是可以幫助去理解系統的架構以及實現,對後續學習與應用是非常有益的。

僅供參考。


告訴你這兩者的異同,自己根據情況選擇:

你所說的jquery append:

也就是前端發出請求獲取數據,動態添加到頁面。選擇這樣做,你服務端得提供個查詢api,前端腳本就是個簡單的ajax獲取內容插入,效果可能會是頁面載入進來剛開始沒有,間隔一小會兒你的外鏈顯示出來,可以用loading稍微改善下。

服務端渲染:

不管你用的什麼服務端語言都一樣,用對應的插值語法,把模板寫好,變數插好,路由請求該頁面即可,體驗會好一點,不過如果是外鏈應該也沒多少數據,估計差不了太多。

對於題主說的小網站而言,其實如果沒有過多的需求和邏輯,服務端寫一下簡單省事。

當然如果想多學習技術,兩者都可以折騰一下,應該都花不了多少時間。
前端即是交互,後端即是數據。前端即是體驗,後端即是速度。

前端即是邏輯,後端即是安全。

兩段邏輯都可以很複雜,後端重在安全速度。前端重在如何讓用戶方便快捷,而後端是讓正常的用戶方便快捷
- 如果數據經常變動,使用 Ajax- 如果是比較固定的,可以服務端模版渲染,再做頁面靜態化

何必劃分那麼清楚,初學者又不可能自己開發後台,找個開源的CMS,試試就知道了


首先題主的問題描述的不是很清晰,我來梳理一下,其實想要實現的功能就是用戶在添加某些內容之後進行實時刷新,讓頁面可以正確顯示,你顯然陷入了雞生蛋和蛋生雞的邏輯中不可自拔,以致於你覺得不知道怎麼去實現,這個問題是一個典型的數據驅動頁面的需求,根據用戶的交互操作實現頁面實時刷新,那麼需要實現的就變成了:以數據為驅動,一言不合就重繪,那麼可以這樣寫,關於用戶需要操作的信息以JSON對象的形式進行保存,根據用戶ID去資料庫取出相應的內容,並根據取出的內容,通過map的方式渲染在頁面上的容器內,在用戶進行操作時,更改數據內容或結構,清空容器,並根據JSON對象重繪頁面,這樣就實現了頁面的實時刷新,這種方式呢,直接操作DOM,而且沒有對操作進行優化,顯然是低效的,於是你可以去了解React了,React了提供了State的樹的方式去綁定頁面狀態。並根據狀態去生成虛擬DOM,根據虛擬DOM再去渲染頁面,而且呢,對於新舊數據進行了演算法優化,之前呢是基於diff,v16.0以後呢,是基於Fiber,來實現最小代價的重繪,但是這樣的話呢,多頁面(組件)之間的狀態管理就變得複雜起來,功能越來越多的情況下會讓你的狀態樹難以管理和臃腫,於是你需要了解redux了,,,此處不再贅述,當然,你選擇Vue也是可以的,作為MVVM的一款框架,Vue做了很多的語法糖,各種鉤子,上手簡單,功能多樣,也有vuex來作為狀態管理的工具,,,


推薦閱讀:
相关文章