⑴ 求推薦一下關於Web前端的相關資料！
一）前端基本功
前端相關的基礎知識
《HTTP/3 來了 ！未來可期》
《你可能已經忽略的 git commit 規范》
《手寫一個 WebSocket 協議》
《5000字解析：前端五種跨平台技術》
《一篇搞定移動端適配》
《Chrome DevTools中的這些騷操作，你都知道嗎？》
《Chrome 運行時性能瓶頸分析》
《當瀏覽器全面禁用三方 Cookie》
《無形中提高工作效率的 Chrome 插件》
《還分不清 Cookie、Session、Token、JWT？》
《你連 HTTPS 原理都不懂，還講「中間人攻擊」？》
《npm install 原理分析》
《不容錯過的 Babel 7 知識匯總》
《一文搞懂 Web 中暗藏的密碼學》
《解讀HTTP/2與HTTP/3 的新特性》
《那些不常見，但卻非常實用的 CSS 屬性》
《面試官：你可以用純 CSS 判斷滑鼠進入的方向嗎？》
《二營長，快掏個CSS出來給我畫個井字棋游戲》
《CSS 故障藝術》
《我寫CSS的常用套路(附demo的效果實現與源碼）》
《來自新時代的 CSS》
《你還不會 CSS 動畫？》
《誰說前端不需要懂二進制》
《你不知道的 Blob》
《Javascript常用的 60 余種工具方法》
《你可以這樣優化 if-else 代碼結構》
《JS 圖片壓縮的實現思路》
《一個簡潔、有趣的無限下拉方案》
《請你實現一個大文件上傳和斷點續傳》
《從 ES6 到 ES10 的新特性萬字大總結》
《JavaScript 手寫代碼無敵秘籍》
《通俗易懂的 TypeScript 入門教程》
《用 TypeScript 編寫 React 的最佳實踐》
《一文讀懂 JS 裝飾器》
《你真的懂 Promise 嗎？》
《Typescript 那些好用的技巧》
《Typescript 嚴格模式有多嚴格？》
《用 TypeScript 編寫 React 的最佳實踐》
《2020 年你應該知道的 React 庫》
《5 個技巧助你編寫更好的 React 代碼》
《10個案例讓你徹底理解React hooks的渲染邏輯》
《組件演進史：從Mixin到HOC，再到Hook》
《1.1萬字從零解讀Vue3.0源碼響應式系統》
《重頭來過的 Vue 3 帶來了什麼？》
《一杯茶的時間，上手 Node.js》
《深入理解 Node.js 進程與線程》
《Deno 會取代 Node.js 嗎？》
《了不起的 Deno 入門教程》
《推倒 Node 重做，Deno 1.0 來了》
《一文搞懂 Webpack 多入口配置》
《GraphQL-前端開發的利劍與橋梁》
《GraphQL 入門看這篇就夠了》
《前端工程師應該了解的 GraphQL》
《高頻前端面試題》
《吐血整理！再來一打 Webpack 面試題》
《前端同學經常忽視的一個 JavaScript 面試題》
《如何輕松拿到淘寶前端 offer》
《三年大廠面試官：二面題》
《十幾道含答案的大廠面試題總結》
《如何答一道驚艷面試官的數組去重問題？》
《10 個 CSS 高頻面試題，你都會嗎？》
《經常被面試官考的 JS 數據類型知識你真的懂嗎？》
《面試須知：瀏覽器相關原理詳細總結》
《2019 大齡前端如何准備面試？》
《2018 大廠高級前端面試題匯總》
《前端如何在項目中做出亮點》
《Facebook 前端技術棧重構分享》
《當前端基建任務落到你身上，該如何推動協作？》
《使用 docker 高效部署你的前端應用》
《關於前端學習路線的一些建議》
《各種場景喚起 App 的騷操作》
《Web 視頻播放前前後後那些事》
《你必須要注意的依賴安全漏洞》
《從 12.67s 到 1.06s 的網站性能優化實戰》
《網易雲音樂前端性能監控實踐》
《一個阿里前端工程師的成長之路》
《非常全面的前端協作規范》
《一名合格前端工程師的自檢清單》
《從 0 到 1 再到 100：搭建、編寫、構建一個前端項目》
CSS
JavaScript
TypeScript
二）前端框架、工具、庫
React
Vue
Nodejs
Deno
Webpack
GraphQL
VS Code
《動圖演示11個必備 VS Code 插件》
三）面試題精選
四）前端開發的職業修煉
希望對你有用，望採納~
⑵ web前端小知識
1.學習web前端,需要掌握哪些知識點
第一階段：前端頁面重構
內容包含了：PC端網站布局項目、HTML5+CSS3基礎項目、WebApp頁面布局項目。
第二階段：JavaScript高級程序設計
內容包含：原生 JavaScript交互功能開發項目、面向對象進階與 ES5/ES6應用項目、JavaScript工具庫自主研發項目。
第三階段：PC端全棧項目開發
內容包含：jQuery經典交互特效開發、HTTP協議、Ajax進階與PHP/JAVA開發項目、前端工程化與模塊化應用項目、PC端網站開發項目、PC端管理信息系統前端開發項目。
第四階段：移動端項目開發
內容包含：Touch端項目、微信場景項目、應用 Angular+Ionic開發 WebApp項目、應用 Vue.js開發 WebApp項目、應用 React.js開發 WebApp項目。
第五階段：混合（Hybrid,ReactNative）開發
內容包含：微信小程序開發、React Native、各類混合應用開發。
第六階段：NodeJS全棧開發
內容包括：WebApp後端系統開發、一、NodeJS基礎與NodeJS核心模塊二、Express三、noSQL資料庫。
第七階段：大數據可視化
內容包含：大數據可視化基礎與實戰、一、數據可視化入門、二、D3.js詳解、三、其他JS庫。
2.web前端開發需要具備哪些知識
不管是從事什麼行業 都需要不斷學習 提升自己的能力
看題主的描述 題主還停留在比較初級的前端上面
建議題主再找一些系統的視頻教程來學習，比如《web前端開發教程》
這套教程主要包括前端開發必須掌握的以下知識：
階段一 - Web前端基礎學習
Web前端開發之HTML+CSS基礎入門
Web前端開發之HTML5+CSS3快速入門
Web前端開發之Javascript初步開發入門
Web前端開發之Ajax初步
Web前端開發之Photoshop切片
Web前端開發之jQuery入門課程
階段二 - Web前端實戰
前端開發項目：一起來做秒殺活動
高級工程師手把手帶你做企業門戶前端
less從入門到精通
Backbone入門基礎
階段三 - Web前端項目實訓
移動前端開發項目
至於更多擴展方面的知識，那就需要題主根據自己的實際情況而學習了
3.web前端需要掌握的哪些知識
WEB前端要掌握的專業技能包括：
最基礎的：結構樣式（HTML、CSS）
移動端相關及HTML5新增的：HTML5和CSS3
與網頁行為、特效相關，也是WEB前端最核心的：JavaScript技術（包含原生JavaScript、jQuery以及AJAX）
如上是最核心的一些知識，除此之外還有PhotoShop（知道如何切圖）、瀏覽器的調試、SVN或Git（版本管理器）、SEO（涉獵與網頁製作相關即可）。
4.web前端工作需要哪些知識
首先，了解前端開發
什麼是html?
首先要明確，html是前端的基礎！Web前端開發是從網頁製作演變而來的，名稱上有很明顯的時代特徵。在互聯網的演化進程中，網頁製作是Web1.0時代產物，那時網站的主要內容是靜態的，用戶使用網站的行為也以瀏覽為主。2005年以後，互聯網進入Web2.0時代，各種類似桌面軟體的Web應用大量涌現，網站的前端由此發生了翻天覆地的變化。網頁不再只是承載單一的文字和圖片，各種富媒體讓網頁的內容更加生動，網頁上軟體化的交互形式為用戶提供了更好的使用體驗，這些都是基於前端技術實現的。說得直白點就是美工photoshop，交互設計，flash,js,html+css。就小規模公司而言，一個技術員都得會這幾樣技能，這樣很鍛煉人的，慢慢的你就會成為公司的主力。大規模的公司把這些分得很細，所以，你可以精通一門，熟悉其他的，進軍大公司。
那麼我們應該怎麼學習前端開發這門技術呢？ 現在很多小夥伴喜歡在互聯網上找視頻資料學習網頁製作，但是光看視頻你是不可能學會網頁製作的，沒有人指導你，而且很多視頻已經過時了，並沒有什麼用！ 如果你真的想學習網頁製作這門技術，你可以來這個裙，前面是6壹0，中間是思壹五，最後是三一思！在這里有最新的HTML課程免費學習 也有很多人指導你進步，不需要你付出什麼，只要你是真心想學習的，隨便看看的就不要加了，加了也是浪費大家的時間。610415314
Web前端的學習建議
Web前端的學習誤區 入門快、見效快讓我們在不知不覺中已經深深愛上了網頁製作。此時，很多人會陷入一個誤區，那就是既然藉助這么帥的IDE，通過滑鼠點擊菜單就可以快速方便地製作網頁。
那麼我們為什麼還要去學習HTML、CSS、JavaScrpt、jQuery等這些苦逼的代碼呢？這不是舍簡求繁嗎？
但是隨著學習的深入，就會發現我們步入了一種窘境——過分的依賴IDE導致我們不清楚其實現的本質，知其然但不知其所以然。
因此在頁面效果出現問題時，我們便手足無措，更不用提如何進行頁面優化以及完成一些更高級的應用了。其原因是顯而易見的——聰明的IDE成全了我們的惰性，使我們忽略了華麗的網頁背後最本質的內容——code。
在學習Web前端中的一些建議和方法。
在CSS布局時需要注意的一個問題是很多同學缺乏對頁面布局進行整體分析，不能夠從宏觀上對頁面中盒子間的嵌套關系進行把握，就急於動手去做，導致頁面中各元素間的關系很混亂，容易出現盒子在浮動時錯位等情況。建議大家在布局時採用「自頂向下，逐步細化」的思想，先用幾個盒子將頁面從整體上劃分，然後逐步在盒子中繼續嵌套盒子。
「君子生非異也，善假於物也」，在學習的過程中還要多瀏覽一些優秀的網站，善於分析借鑒其設計思路和布局方法，見多方能識廣，進而才可以融會貫通，取他人之長為我所用。
web前端開發工程師做為互聯網行業緊缺的職位之一，人才缺口巨大，每天還在不斷的更新。人才少，薪資自然也是很吸引人的，據某網站77939樣本統計從業人員平均月薪9690元，而且跟據經驗的增加，薪資也是在不斷的攀高的。潭州教育就業環節擁有專業的就業團隊，對畢業學員全程指導，真正兌現萬元就業。
引用喬布斯的話，Web就是未來，我們作為前端開發工作者也是未來。相信Web前端開發的明天會更好。
⑶ 誰能給我出一兩道 web前端筆試題 上機題啥的，呵呵，比較常考的
[面試題] 某企業前端開發面試題
【HTML & CSS】
1. Doctype? 嚴格模式與混雜模式-如何觸發這兩種模式，區分它們有何意義?
2. 行內元素有哪些？塊級元素有哪些？CSS的盒模型？
3. CSS引入的方式有哪些? link和@import的區別是?
4. CSS選擇符有哪些？哪些屬性可以繼承？優先順序演算法如何計算？內聯和important哪個優先順序高？
5. 前端頁面有哪三層構成，分別是什麼？作用是什麼？
6. css的基本語句構成是？
7. 你做的頁面在哪些流覽器測試過？這些瀏覽器的內核分別是什麼?經常遇到的瀏覽器的兼容性有哪些？怎麼會出現？解決方法是什麼？
8. 如何居中一個浮動元素?
9. 有沒有關注HTML5和CSS3?如有請簡單說一些您對它們的了解情況！
10. 你怎麼來實現下面這個設計圖,主要講述思路 （效果圖省略）
11. 如果讓你來製作一個訪問量很高的大型網站，你會如何來管理所有CSS文件、JS與圖片？
12. 你對前端界面工程師這個職位是怎麼樣理解的？它的前景會怎麼樣？
【Javascript】
1. js是什麼，js和html 的開發如何結合？
2. 怎樣添加、移除、移動、復制、創建和查找節點
3. 怎樣使用事件以及IE和DOM事件模型之間存在哪些主要差別
4. 面向對象編程:b怎麼繼承a
5. 看看下面alert的結果是什麼
view sourceprint?1.function b(x, y, a) {
.arguments[2] = 10;
.alert(a);
}
b(1, 2, 3);
如果函數體改成下面，結果又會是什麼？
a = 10;
alert(arguments[2] );
6. 請編寫一個JavaScript函數 parseQueryString，它的用途是把URL參數解析為一個對象
var obj = parseQueryString(url);
alert(obj.key0) // 輸出0
7. ajax是什麼? ajax的交互模型? 同步和非同步的區別? 如何解決跨域問題?
8. 什麼是閉包？下面這個ul，如何點擊每一列的時候alert其index?
<ul id=」test」>
<li>這是第一條</li><li>這是第二條</li><li>這是第三條</li>
</ul>
9. 最近看的一篇Javascript的文章是？
10. 常使用的庫有哪些？常用的前端開發工具？開發過什麼應用或組件？
11.說說YSlow(可以詳細一點)
答案在參考資料裡面可以找到，答案在參考資料裡面可以找到，答案在參考資料裡面可以找到
⑷ Web前端工程師的入門指南-教你如何成為一名web前端開發工程師
今天小編要跟大家分享的文章是關於Web前端工程師的入門指南-教你如何成為一名web前端開發工程師。經過如此多的試驗和測試，而不是說你從頭開始創建了所有內容，接著，你在網頁上創建了第一個登錄表單時，你感覺如何?經過了多次更改後，將布局分配給第一個Web應用程序時感覺如何?當成功處理了數千個用戶的操作時，你感覺如何？
大多數Web開發人員都經歷了上述所有階段，最初可能會對其中某些感到沮喪，但是當他們看到自己的網站正在運行並且人們在世界各地使用它時，總體感覺確實令人興奮和驚奇。Web開發人員負責許多任務，從收集需求到設計網站，處理網站的後端部分，並使其成功地為用戶服務。每年，行業中都會涌現出新技術和工具，以提高開發人員的工鄭槐作效率，並為用戶提供更好的網站。對於他們來說，保持在Web開發游戲之上的挑戰變得越來越大。今天，我們將討論要在2020年成為Web開發人員的完整地圖。這將是針對所有開發人員(前端，後端和全棧)的實用指南。
1、首先確定你的目標或道路
我們將討論很多技術，趨勢和工具，但我們不希望您不知所措，因此你需要首先決定要成為一名Web開發人員要做什麼，因為這將幫助你選擇合適的工具。和學習技術。成為Web開發人員的原因有很多，下面列出了一些選擇因素：
·你想作為一卜叢賀名Web開發型派人員在一家公司工作，這是最普遍的原因。
·你想以自由開發人員的身份來開始自己的業務或代理。
·你可以成為其他公司的顧問。
·你可以創建自己的應用來賺錢。
·編碼是你的業余愛好。
從上述感興趣或目標的領域，你可以選擇適用於你的目標的正確工具和技術。如果你的目標是成為一名前端開發人員，則可以選擇前端開發的工具和技術。後端和全棧開發也是如此。
2、Web開發的基本工具和軟體
·
計算機和操作系統：如果沒有計算機和操作系統，則無法編寫代碼。要學習Web開發，你不需要任何高端計算機(如果你擁有的話，那麼更好)。你可以使用任何類型的中型筆記本電腦或台式機。對於操作系統，可以使用適合你的MacOS，Windows(最新版本)或Linux。
·文本編輯器/
IDE：毫無疑問，VSCode適用於大多數情況和大多數語言。它具有良好的性能，出色的擴展性，內置的終端功能以及大量功能。在2019年StackOverFlow調查中，VSCode也是開發人員的首選。你還可以選擇其他一些不錯的選擇，例如Sublime
Text或Atom。如果我們談論IDE，那麼是Visual
Studio(#或C#)，Eclipse和Netbeans(Java)。是不錯的選擇。
·
Web瀏覽器：大多數開發人員的首選是Chrome或Firefox。Chrome速度很快，並且使用V8引擎(JavaScript引擎)。Firefox也取得了長足的進步，其中的一些好東西不在chrome瀏覽器中。兩種瀏覽器都有出色的開發工具，可以對Web開發中的問題進行故障排除。
·終端：您將使用一些系統命令來使用CLI進行很多工作。您可以將默認或第三方終端用於您的Web開發項目。Bash，Zsh，Powershell，Git
Bash，iTerm，Hyper這些都是可以使用的選項。
·設計(可選)：並不是每個人都需要學習。在公司中，有專門的團隊來製作圖像，徽標或草圖，但是如果您是自由職業者，則可能必須學習Adobe
XD，Photoshop，Sketch或Figma。
3、從HTML和CSS開始
HTML和CSS是Web開發的基本構建塊。無論您的Web應用程序有多先進，或者使用什麼框架和後端語言，都必須使用HTML和CSS構建前端應用程序。因此，這是在Web開發中要學習的第一件事。
·HTML5(語義元素，屬性，文檔類型等)
·CSS基礎知識顏色，字體，位置，盒子模型等。
·CSSGrid和Flexbox對齊內容或創建列。
·CSS自定義屬性
4、響應式布局
您的應用程序應該在所有類型的設備(例如智能手機，平板電腦，台式機，iPad或任何其他屏幕尺寸的設備)上都可以查看和使用。因此，了解創建響應式設計或布局非常重要。讓我們來看一些重要的主題。
·了解如何設置視口
·媒體查詢不同的屏幕尺寸。
·流體寬度
·雷姆單位
·移動優先
5、自定義可重用CSS組件
與其依賴大型的CSS框架(如Bootstrap)，不如創建自己的模塊化，可重用的CSS組件以在項目中使用。如果您構建自己的定製設計，則無需導入完整的庫。您創建只需要特定UI的組件。的新趨勢最近還出現了有助於更有效地編寫CSS代碼的代碼。如果你已經了解CSS，那麼您無需在學習Saas上花費很多精力。Saas是CSS預處理程序，可為標准CSS添加更多功能並使其更加高效。你可以使用變數，嵌套，條件語句來減少CSS的重復並提高其效率。你還可以為每個可重用組件創建單獨的Saas文件。Sass確實節省了很多時間，所以你絕對應該在2020年學習它。
6、CSS框架
學習CSS框架的普及程度不如去年，但對於不擅長設計的開發人員而言，仍然非常相關或有用。有許多流行的CSS框架可供使用，其中一些如下。
·Bootstrap是最流行的CSS框架。學習引導程序也有助於學習其他框架。
·Tailwind
CSS是其他正在流行的框架，與其他框架幾乎沒有什麼不同。它是一組實用程序類，因此您可以創建自己的按鈕和其他看起來與其他按鈕確實不同的東西。它們也是高度可定製的。
·物化
·布爾瑪
7、前端必須語言：JavaScript
學習HTML和CSS之後，接下來需要學習的是Vanilla
Javascript。對開發人員來說，掌握javascript基本知識非常重要。您將在伺服器端語言(例如PHP，Python或#)中使用大量javascript，並且如果您想與React，Angular，NodeJS，Vue或任何其他javascript框架或庫一起使用，則非常需要學習這種語言。以下是你應該在javascript中涵蓋的一些重要主題
·JavaScript基礎知識(變數，數據類型，函數，條件等)
·DOM(文檔對象模型)
·JSON(JavaScript對象表示法)
·提取API(請求/響應/Ajax)
·如果您想轉向React，Vue，Angular或其他框架，現代JS(ES6)概念對於學習非常重要。
8、一些重要工具
Web開發中將使用一些工具。這些工具將幫助你進行調試，提高生產率，管理代碼，與其他開發人員合作以及類似的東西。讓我們討論其中一些工具。
·
Git(版本控制)和Github是您肯定會在2020年學習的最受歡迎的工具。Git在與其他開發人員協作和管理代碼方面有很多幫助。您還可以選擇其他一些選項，例如GitLab，Bitbucket和其他一些選項。
·
了解如何使用瀏覽器開發工具。無論是chrome還是firefox，您都應該知道如何使用不同的選項卡，例如元素選項卡，javascript控制台，用於請求和響應的網路選項卡，應用程序選項卡以及其他用於不同目的的選項卡。
·大多數IDE或文本編輯器都具有添加擴展名或插件的功能，這對提高生產力和構建Web應用程序非常有幫助。例如，Visual
Studio代碼中的VSCode擴展可幫助下載擴展，例如實時伺服器或實時saas編譯器以與React一起使用。
·Emmet是另一個很棒的工具，它允許您編寫非常快速的HTML和CSS，這有助於提高開發人員的生產力。
·
學習使用javascript軟體包管理器，例如NPM和Yarn。如果您正在使用Javascript框架或庫(例如React)，那麼這些軟體包管理器將使用很多，但是對於其他語言(例如Python或Php)，您將使用不同的軟體包管理器。
·
如果要在前端安裝NPM軟體包，則必須使用Webpack或Parcel。如果要創建自己的模塊，或者要將一個javascript文件帶到另一個javascript文件，則默認情況下不能僅使用瀏覽器來執行此操作，因此需要Webpack或Parcel對其進行捆綁。
9、基本部署
此時，一旦你知道應該為前端開發學習什麼工具或技術，就需要知道如何在Internet上部署前端網站。如果你正在為小型企業構建一些小型應用程序，登錄頁面或個人站點，則無需學習AWS或DevOps，僅因為它們具有光澤和新潮。你將使事情變得更加復雜而不是簡單。你需要在2020年學習一些部署工具和步驟。
·域注冊(Namecheap，Google等)
·託管託管(InMotion，Hostgator，Bluehost等)
·靜態主機(Netlify，Github頁面)
·SSL證書。
·FTP，SFTP(文件傳輸協議)非常適合小型應用程序。
·SSH(安全外殼)，用於高級應用程序。
·CLI和Git。
到目前為止，我們討論的任何工具，技術趨勢或步驟都是前端開發的一部分。您尚不知道該框架，但可以為個人和小型企業構建網站，也可以構建適合移動設備的布局。您還可以使用到目前為止討論的工具或技術來部署小型應用程序或項目。如果您想申請工作，那麼學習一些前端框架(如React，Vue或Angular)將是很棒的。
10、前端框架和狀態管理
框架使您可以進行更高級的前端開發。框架為您提供了許多優勢，例如可重用的組件，更有條理的UI或頁面交互。這對於協作更好，也有助於編寫簡潔的代碼。另外，了解狀態管理。每個框架都有不同的方法。以下是2020年的一些流行框架和狀態管理器。
·React：React庫是最流行的Web開發學習方法，與其他框架和庫相比，它相當容易。React開發人員還有很多工作要做。您可以將Rex和
ContextAPI與Hooks一起使用以進行狀態管理。
·Vue：
Vue也越來越受歡迎，開發人員也更喜歡學習Vue。與React和Angular相比，Vue最容易學習。VueX是為視圖而構建的狀態管理器。
·Angular：此框架通常在大型組織中使用。它具有相當陡峭的學習曲線。用Angular學習
TypeScript也很好。它允許您使用可選的靜態類型並支持ES2015的功能。NGRX和Services是可以學習此框架的良好狀態管理器。
可選學習：
·
如果您具有這三個框架之一的知識，那麼您還可以使用Svelte，它是一個JavaScript編譯器，可讓您生成純凈的原始JS代碼並幫助您輕松構建用戶界面。
·
了解伺服器端渲染。NextJS(React)和NuxtJS(Vue)是允許您在伺服器上運行React和Vue的框架。兩者都有很好的功能，例如更好的SEO，文件系統路由，自動代碼拆分，靜態導出，JS中的CSS和許多其他功能。
·靜態網站生成器：Gatsby(反應式)和Gridsome(Vue)
我們已經討論了所有大多數前端開發工具和技術。現在讓我們討論成為後端開發人員或全棧開發人員的語言和技術。
11、伺服器端語言(選擇一種)
您應該至少了解一種伺服器端語言。要在2020年選擇一種語言，下面提供了一些選項...
·NodeJS(不是語言，而是運行時環境)
·Python(非常適合初學者)
·Java(適合大型組織)
·Php(適合自由職業)
·Ruby(2020年少兩極)
·C#
·Go
注意：無論你喜歡學習哪種伺服器端語言，都要確保你了解使用該語言的數據結構和演算法。數據結構和演算法將幫助您為用戶呈現數據，並將幫助您優化Web應用程序中的代碼。我們特別建議您專注於使用數組和字元串(最重要)。你將同時使用這兩種方法。
12、伺服器端框架(選擇一項)
一旦學習了自己選擇的一種伺服器端語言，就可以使用其中一種語言框架。您可以選擇以下給出的選項之一...
·Node.js_Express，Koa，Adonis，Feather.js，Nest.js
·Python：Django，Flask，
·Java：SpringMVC，Grails
·PHP：Laravel，Symfony，Codeignitor，Slim
·Ruby：Sinatra上的RubyonRails
·C#：ASP.NETMVC
·Go：Revel
13、資料庫(選擇一項)
大多數Web應用程序都需要一個存儲數據的地方。在某些情況下，某些技術或某些語言可以與某些資料庫配合使用。例如：在Mern堆棧中，M代表MongoDB，而在LAMP堆棧中M代表MySQL，但完全取決於您要為應用程序選擇哪個資料庫。我們將討論2020年一些流行的資料庫。
·關系資料庫：RDBMS仍然是最受歡迎的資料庫。最喜歡使用PostgreSQL，MySQL，MSSQL。
·NoSQL：MongoDB，RethinkDB，CouchDB
·雲資料庫：Firebase，AzureCouldDB，AWS
·輕量級和緩存：Redis，SQLlite，NeDB
在學習資料庫時，您還將學習RDBMS，ORM(對象關系映射器)或ODM(對象數據映射器)的SQL(結構化查詢語言)。GraphQL
：(可選)您可以了解現在流行的GraphQL。這是API的查詢語言。它具有類似於JSON的簡單語法，並且相當容易實現。
14、CMS：內容管理
您絕對應該了解內容管理系統，尤其是如果您是自由職業者。CMS用於將內容添加到您的網站或應用程序。客戶能夠更新自己的內容非常好。
·
傳統CMS：WordPress(PHP)，Drupal(PHP)，Keystone(Javascript)，Enro(Javascript)
·其他CMS：DEDECMS，帝國CMS，PHPcms，Prismic.io，Strati。
15、部署和DevOps
託管全棧應用程序或後端應用程序比僅前端應用程序要復雜一些，尤其是當您擁有資料庫時。確保您知道如何使用CLI進行部署。了解有關用於部署應用程序的以下內容。
在大多數公司中，有不同的團隊從事DevOps的工作。因此，擁有有關DevOps的知識完全是可選的。您可以了解到，如果您正在從事自己的項目。
·SSH(安全外殼)
·Web伺服器環境：NGINX，Apache
·應用程序託管：Linode，Heroku，AWS，Azure，Now。
·虛擬化：Docker，Vagrant
·測試：單元，功能，集成等
·負載平衡，監視，安全性。
以上所有技術工具都足以使您成為前端，後端或全棧開發人員。根據最終目標選擇正確的工具和技術。
以上就是小編今天為大家分享的關於Web前端工程師的入門指南-教你如何成為一名web前端開發工程師的文章，希望本篇文章能夠對正在從事web前端工作的小夥伴和正在學習web前端知識的夥伴們有所幫助，想要了解更多web前端相關知識記得關注北大青鳥web培訓官網。最後祝願小夥伴們工作順利，成為一名優秀的web前端開發工程師！
英文|#/how-to-become-a-web-developer-in-2020-a-complete-guide/翻譯|web前端開發(ID：web_qdkf)
⑸ 求web前端開發常見的面試題，和一些瀏覽器兼容性問題，理論知識，要求簡潔，最好有題庫
http://www.w3cfuns.com/forum.php?mod=forumdisplay&fid=51&filter=typeid&typeid=177裡面有很多公司的筆試題
⑹ 零基礎轉行，學web要多久
近兩年Web前端可以說是狠狠地火了一把，不僅僅是因為招聘市場需求量大，還有一個重要的原因就是，入歲型粗行門檻低，入門簡單。真的是這樣嗎?
0基礎的小白也能轉行嗎?很多同學都有這樣的疑慮，認為沒那麼簡單。下面總結了一些關於web前端入門的東西，希望對大家有所幫助。
一、web前端入行門檻低嗎?
對於這個問題，應該辯證地看。相對於IT技術類的其他崗位，web前端絕對算是門檻較低的，當然對應的起點也低。如果是小白入行或轉行到IT技術的話，建議選擇web前端。
它的門檻低主要體現在兩個方面：
Web前端入門門檻低體現在HTML和CSS上，前者只是結構標簽，後者是樣式配置，入門是非常簡單的，課呱呱上有全套的入門教程可以免費學習，而且還有配套的題庫練習。
2.Web前端入門門檻低的另一個重要體現就是，符合82定律，也就是20%的東西使用率佔到80%。所以很適合囫圇吞棗，因此我們的重點就是把這20%學起來，而首先要做的就是把這20%的東西找出來。前端這20%的東西大概就是常用的html標簽，css的盒子模型，基本的原生js，以及熟練使用jquery，ajax，常見瀏覽器的兼容。
拿下這些東西意義非凡，一方面證明你適合做前端這份工作，另一方面這些技能能讓你找到一份工作。讓你能夠從容地去學習剩下的80%。總之就是專心對付最重要的東西，那些什麼less、sass、angular這類的東西，當你把我之前說的基礎打好之後，學習起來暢通無阻，隨學隨用。最後最難的就是實踐，只有實踐才能學到真正的技術，新人很難參與一些有價值有意義的項目，沒有這些項目又很難成長，所以自己有項目可參與應該珍惜。
二、怎樣入門web前端?
有同學給出了很好的建議，現在小編推薦給大家：
學習前端就好比如蓋房子~HTML就充當了房子架構這部分，也是房子的基礎。
CSS呢，就好比咱們房子的裝修，牆面什麼顏色，什麼風格，什麼地板...這些給房子改變風格。
cssjava，就好比這個房子的功能，房子需要製冷吧，需要暖氣吧，也需要上下水吧。這些功能性的就相當於是java，例子可能不是很恰當，只是幫助大家對Web有個初步的認識。
方法步驟、工具以及開發的案例展現：
1、前端工具箱(dreamwear/sublime/Photoshop/SVN等)
2、零基礎入門(html，CSS)、常用標簽集合、常用選擇器&標簽類型劃分、浮動進階、定位、表格和表單、兼容性問題處理、整站進階、css3入門、移動端布局、Animation和Transform、Bootstrap前端開租兆發框架、
3、項目實戰
這里我也推薦幾個適合拿來練手的項目：
HTML5實現2048游戲
HTML實現拼圖游戲
HTML實現掃雷游戲
CSS3實現抽獎大轉盤
網頁版別踩百塊游戲
這些項目可以幫助你在游戲的過程中學會編程，趣味性比較強。乎鎮這些在課呱呱平台上都是免費分享給大家，在學習期間可以嘗試自己練手，很有成就感。
⑺ 求web前端面試題庫及答案
1.對WEB標准以及W3C的理解與認識
標簽閉合、標簽小寫、不亂嵌套、提高搜索機器人搜索幾率、使用外 鏈css和js腳本、結構行為表現的分離、文件下載與頁面速度更快、內容能被更多的用戶所訪問、內容能被更廣泛的設備所訪問、更少的代碼和組件，容易維 護、改版方便，不需要變動頁面內容、提供列印版本而不需要復制內容、提高網站易用性；
2.xhtml和html有什麼區別
HTML是一種基本的WEB網頁設計語言，XHTML是一個基於XML的置標語言
最主要的不同：
XHTML 元素必須被正確地嵌套。
XHTML 元素必須被關閉。
標簽名必須用小寫字母。
XHTML 文檔必須擁有根元素。
3.Doctype? 嚴格模式與混雜模式-如何觸發這兩種模式，區分它們有何意義?
用於聲明文檔使用那種規范（html/Xhtml）一般為 嚴格 過度 基於框架的html文檔
加入XMl聲明可觸發，解析方式更改為IE5.5 擁有IE5.5的bug
4.行內元素有哪些?塊級元素有哪些?CSS的盒模型?
塊級元素：div p h1 h2 h3 h4 form ul
行內元素: a b br i span input select
Css盒模型:內容，border ,margin，padding
5.CSS引入的方式有哪些? link和@import的區別是?
內聯 內嵌 外鏈 導入
區別 ：同時載入
前者無兼容性，後者CSS2.1以下瀏覽器不支持
Link 支持使用javascript改變樣式，後者不可
6.CSS選擇符有哪些?哪些屬性可以繼承?優先順序演算法如何計算?內聯和important哪個優先順序高?
標簽選擇符 類選擇符 id選擇符
繼承不如指定 Id>class>標簽選擇
後者優先順序高
7.前端頁面有哪三層構成，分別是什麼?作用是什麼?
結構層 Html 表示層 CSS 行為層 js
8.css的基本語句構成是?
選擇器{屬性1:值1;屬性2:值2;……}
9.你做的頁面在哪些流覽器測試過?這些瀏覽器的內核分別是什麼?
Ie(Ie內核) 火狐（Gecko） 谷歌（webkit） opear(Presto)
10.寫出幾種IE6 BUG的解決方法
1.雙邊距BUG float引起的 使用display
2.3像素問題 使用float引起的 使用dislpay:inline -3px
3.超鏈接hover 點擊後失效 使用正確的書寫順序 link visited hover active
4.Ie z-index問題 給父級添加position:relative
5.Png 透明 使用js代碼 改
6.Min-height 最小高度 ！Important 解決』
7.select 在ie6下遮蓋 使用iframe嵌套
8.為什麼沒有辦法定義1px左右的寬度容器（IE6默認的行高造成的，使用over:hidden,zoom:0.08 line-height:1px）