搜尋
什麼是前端Feb 26, 2018 am 09:58 AM
什麼前端


這次帶給大家甚麼是前端,前端的概念詳解,一起來看一下。

過年的時候跟表哥聊天,他說以前也用html,js,css寫過網頁,那現在的前端和那個時候有什麼不同,我當時就向他介紹了一下前端。

但當時我對前端的理解也不是很透徹,所以我自我感覺也沒有介紹清楚。

隨著我自己學習的深入,我自己覺得有必要總結一篇前端和寫網頁不同的博文了。同時也為了記錄下我現在的見解和認識,等過一段時間回過頭來在看,一定會對自己的進步有很多感悟。

由於知識水平實在有限,如果有任何錯誤,麻煩在評論區中指出,謝謝!

網頁開發時代

那時候,人們透過html寫網頁,並且用js,css調整樣式。

我們在各種經典書籍《Head First HTML與CSS》《精通CSS:高級Web標準解決方案》《JavaScript高級程式設計》裡面學到的,也基本上是這方面的東西。慕課網上的大部分視屏,也都僅限於這方面而已。

網頁模板時代

隨著網頁的複雜度加大,程式設計師為了開發上的便利,於是開發各種網頁模板語言。

比如說簡化寫css的less語言,簡化寫js的coffeejs,還有很多html和js混寫的各種模板。

ajax時代

隨著js的發展,XHR的發明使得程式設計師可以在前端處理數據,分擔了一些後端的工作。

很好的例子是表單驗證啊,瀏覽器滑桿滑到底部才開始載入圖片啊什麼的。

SPA時代

SPA=Single Page Application單一頁面應用程式。

隨著ajax的發展,人們在瀏覽器端就可以做資料處理,這就意味著前端可以寫一整個應用程序,即SPA。

在SPA時代,程式設計師用js來處理整個前端部分,使用者在開啟網站的時候就下載所有的js,在以後的開啟頁面等互動中,就直接在瀏覽器端用js進行處理,不需要向服務端發送http請求。

這個時候有一個很重要的概念就是路由,由於開啟頁面不發送http請求,所以對於一個網址,需要瀏覽器不知道怎麼辦。這個時候需要有一個機制來指導瀏覽器對於什麼網址打開什麼內容,這就是路由。

MVC時代

隨著SPA時代的發展,人們為了開發的方便,常常把專案分成各種模組。其中最典型的是MVC,即model,view和control。

這個時代湧現出各種框架,例如backbone框架等。

MVVM時代

由於MVC的control模組一般是由服務端處理的,這不屬於前端的內容。為了解決這個問題,人們提出了一個解決辦法,就是利用view model來取代control,這就是MVVM框架的由來。實現的技術叫做雙向綁定。

這個時代就出現了現代前端框架:reactjs,angularjs等。這時候,前端工程師已經可以開發在瀏覽器上運行的和應用軟體一樣的軟體了,包括在手機瀏覽器上運行的。

相信看了這些案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!

相關閱讀:

實作瀑布流程佈局的兩個方法

詳解瀏覽器渲染流程

overflow的捲動有哪些重要性

HTML中行動端有哪些佈局方案

以上是什麼是前端的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
巧用CSS实现各种奇形怪状按钮(附代码)巧用CSS实现各种奇形怪状按钮(附代码)Jul 19, 2022 am 11:28 AM

本篇文章带大家看看怎么使用 CSS 轻松实现高频出现的各类奇形怪状按钮,希望对大家有所帮助!

5个常见的JavaScript内存错误5个常见的JavaScript内存错误Aug 25, 2022 am 10:27 AM

JavaScript 不提供任何内存管理操作。相反,内存由 JavaScript VM 通过内存回收过程管理,该过程称为垃圾收集。

Node.js 19正式发布,聊聊它的 6 大特性!Node.js 19正式发布,聊聊它的 6 大特性!Nov 16, 2022 pm 08:34 PM

Node 19已正式发布,下面本篇文章就来带大家详解了解一下Node.js 19的 6 大特性,希望对大家有所帮助!

实战:vscode中开发一个支持vue文件跳转到定义的插件实战:vscode中开发一个支持vue文件跳转到定义的插件Nov 16, 2022 pm 08:43 PM

vscode自身是支持vue文件组件跳转到定义的,但是支持的力度是非常弱的。我们在vue-cli的配置的下,可以写很多灵活的用法,这样可以提升我们的生产效率。但是正是这些灵活的写法,导致了vscode自身提供的功能无法支持跳转到文件定义。为了兼容这些灵活的写法,提高工作效率,所以写了一个vscode支持vue文件跳转到定义的插件。

浅析Vue3动态组件怎么进行异常处理浅析Vue3动态组件怎么进行异常处理Dec 02, 2022 pm 09:11 PM

Vue3动态组件怎么进行异常处理?下面本篇文章带大家聊聊Vue3 动态组件异常处理的方法,希望对大家有所帮助!

聊聊如何选择一个最好的Node.js Docker镜像?聊聊如何选择一个最好的Node.js Docker镜像?Dec 13, 2022 pm 08:00 PM

选择一个Node​的Docker镜像看起来像是一件小事,但是镜像的大小和潜在漏洞可能会对你的CI/CD流程和安全造成重大的影响。那我们如何选择一个最好Node.js Docker镜像呢?

聊聊Node.js中的 GC (垃圾回收)机制聊聊Node.js中的 GC (垃圾回收)机制Nov 29, 2022 pm 08:44 PM

Node.js 是如何做 GC (垃圾回收)的?下面本篇文章就来带大家了解一下。

【6大类】实用的前端处理文件的工具库,快来收藏吧!【6大类】实用的前端处理文件的工具库,快来收藏吧!Jul 15, 2022 pm 02:58 PM

本篇文章给大家整理和分享几个前端文件处理相关的实用工具库,共分成6大类一一介绍给大家,希望对大家有所帮助。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
2 週前By尊渡假赌尊渡假赌尊渡假赌
倉庫:如何復興隊友
4 週前By尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
4 週前By尊渡假赌尊渡假赌尊渡假赌

熱工具

DVWA

DVWA

Damn Vulnerable Web App (DVWA) 是一個PHP/MySQL的Web應用程序,非常容易受到攻擊。它的主要目標是成為安全專業人員在合法環境中測試自己的技能和工具的輔助工具,幫助Web開發人員更好地理解保護網路應用程式的過程,並幫助教師/學生在課堂環境中教授/學習Web應用程式安全性。 DVWA的目標是透過簡單直接的介面練習一些最常見的Web漏洞,難度各不相同。請注意,該軟體中

PhpStorm Mac 版本

PhpStorm Mac 版本

最新(2018.2.1 )專業的PHP整合開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

這個專案正在遷移到osdn.net/projects/mingw的過程中,你可以繼續在那裡關注我們。 MinGW:GNU編譯器集合(GCC)的本機Windows移植版本,可自由分發的導入函式庫和用於建置本機Windows應用程式的頭檔;包括對MSVC執行時間的擴展,以支援C99功能。 MinGW的所有軟體都可以在64位元Windows平台上運作。

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強大的PHP整合開發環境