① 如何做商業前端框架+UI庫選型
這將幫助你了解前端社區中海量的工具。
當然,這些只是一些可選的列表,當你需要做出選擇的時候幫助你抉擇。
我自己使用它嗎?
是的,當我需要開始項目的時候,我用它來作為提醒。
同時,每當有人問「我該使用什麼框架呢?」的時候,我就會把這篇文章給他看。
因為,正如你明白的,事情沒有絕對的對與錯,但是有一些優質的框架能夠幫助做出我們更好的選擇。
另外,我也會不時的更新本文,因為有時候當我學習更多後也會改變當初的想法。
我應該怎樣開始?
如果你的項目不是很小,你應該需要下面幾件事:
項目模塊化 我個人比較喜歡 Component-based architecture,因為他適用於 various-frameworks
同時,考慮一些其他的例子,比如 BOT 、 Elm Architecture 或者 re-frame 或者 CycleJS
模塊載入器(RequireJS,Browserify, Webpack, ComponentJS, SystemJS)
這些東西能夠幫助我們保持Javascript(或者components)彼此獨立和可維護。
包管理器(npm, jspm, bower)
我個人一直比較喜歡 npm ,似乎他是javascript和nodejs真正的標准。另外我會考慮bower來做補足,因為他是一個很好的下載靜態資源的工具,但它在管理組件和依賴又不如npm強大。
自動部署/編譯/構建流水線(grunt/gulp/brunch/broccoli)
因為,如果一直做重復的事情的話生命是很短暫的。
CSS預處理(jss/stylus/sass/css-moles)和 postprocessors(css0, autoprefixer, postcss)
這些工具使css更美好,去除了一些瀏覽器兼容的問題。是的,我是從2015知道這些的,但是不論如何,它在過去確實是痛點。
構建框架(Bootstrap, Zurb Foundation, Elemental UI, Material Lite)
這些框架讓很多web開發者合作,它們會幫助你處理基本的布局和樣式。
盡管,你可以考慮構建你自己的解決方案,如果你感覺構建很厲害或者希望成為前端專家,或者你需要為你的公司構建基本的視覺元素。
如果是這樣的話,建議你盡快使用方法論(BEM, OOCSS),它們可以幫助你節約時間。
我個人比較喜歡 BEM 命名方式和基本工作流,你能夠從 styleguide for Brainly.com找到一些可以幫助你的靈感。
如果你不構建基本的組成,建議看一看 HTML5 Boilerplate
測試工具(jasmine, karma, mocha, tape, itern)
任何人都需要測試,沒有例外的。
代碼質量監控工具(eslint, husky, editorconfig)
可以獲取幫助的社區(chats, IRC, meetups, twitter)
好了,下一步呢?
在選擇你的工具前有一些值得思考的問題需要解決。
准備好了嗎?
我需要和其他人合作嗎?他們是誰?他們想要什麼?
這個問題會幫助你選擇語言和工作流,這對你和你的夥伴都有幫助。
我最關注什麼?質量,開發速度,還是可維護性?
這樣你可以決定是否試驗一些新工具,以及是否能承擔失敗的風險。
是否需要開放給第三方?
面向的團隊不同可能會限制我們語言的選擇。
我是否在處理核心的項目
如果你處理核心項目,請最好選擇高穩定性的語言和框架,這更安全,讓你睡得更好。
是一個可交互的app還是基本的文檔頁面。
結果很可能是你僅僅需要基本的HTML +CSS + tools,或者靜態網站生成器或者CMS。
這是一個單一的項目還是其他項目的相關項目?
即使你有一系列項目,你也應該用一些組件和樣式引導,這些有不錯的文檔。
直接減少代碼重用,保持一致性。
另外,考慮SEO,和服務端渲染。
語言列表
當你回答完上面這些問題後,就可以和你的隊友聊聊,然後選擇一個語言了。
因為這里有很多的東西,而不是糟糕的Javascript,你可以選擇
是否有js開發團隊
考慮ES6(babel兼容)
這會讓你的生活簡單一些。
你是否偏愛typed語言?開發typed是否可以?
考慮 typescript
函數式編程是否接受?
你可以從簡單ES6庫開始,比如 lo-dash 或者 ramda。
這里有一些教程和書來幫助你開始美好的旅行。
你是否嘗試過函數式編程,想要更好的東西?
試試 elm ,很酷的!
你是否能夠全棧?
試試 clojurescript,很酷很酷的
你喜歡沙拉嗎?
試試scalaJS
你知道Haskell嗎?
試試 purescript,真的很酷
想要更多瘋狂的?
這里有一個可以編譯成javascript的語言列表,選一個然後享受吧。
框架列表
你僅僅需要基本的可運行的app?
沒有時間做更復雜的工作?
試試 angular. start looking for help imediately
你是否經常需要快速的原型開發?
是否能在未來修復一些問題?
試試 angular. 一些問題
你是嘗試前端開發的後端?
試試 angular. 尋找一些前端開發者
你是否需要很快的進行開發和構建,但是同時會丟失一些特點?
試試 ampersand/backbone
同樣的技術選型,怎樣從中型到大型?
把 marionette/chaplin添加到你的backbone裡面去,另外可以考慮 Reackjs
你是否有一些時間來實驗,同時得到很大的性能提升?
試試mithril/knockout/aurelia+
你是否有不錯的前端實驗精神,對函數式編程熟悉?
試試 ReactJS+Rex+ImmutableJS+
更多函數式編程技巧?或者偏好交互性強的應用?
使用 reactive streams(bacon, rxJS) 或者試試 Cycle.js(實驗性)
注意1: add streams any會是很好的選擇,可以推薦別人使用。
注意2: 請不要拒絕使用 FRP的reactive streams
你想要使用嚴格的驗證和通用處理方式?
你的應用會越來越大?
你計劃擴充你的團隊?
你有時間學習新東西?
建議花時間學習 EmberJS,他將會是很好的投資!
你是否需要「類桌面應用」?
你的應用有表格,圖例,或者其他分析功能?你在構建企業應用?
試試 ExtJS
你們是一個為其他開發者提供服務的工作室?
你最好有一個不錯的工具集,另外,同事之間最好有一些公共用例。
你是一個為他人提供工具的自由開發者?
適應他們的選擇。
嘗試angular,這將不會造成多大麻煩,讓其他人得到他們想要的。
注意:如果別人付費,請不要改變客戶的需求
你正在構建一個有吸引力的產品,它將會很多人使用?
有了明確的需求後我們就從上面的列表中選擇一個合適的框架。
關於開發什麼樣的應用你有明確的需求(比如10屏的移動應用)
花兩周時間來試驗特定的需求(ionic, famous, Sencha Touch)
怎樣開始編碼?
花一些時間閱讀你所選擇框架或者工具的文檔。
在社區裡面詢問一些經驗開發者怎樣算是優秀項目的開端。
准備所有的工具。
極客精神。但是我建議更加工程化一點。
...
成功。
不知道怎麼用我介紹的一些不常見框架?
看看 TodoMVC Examples,找到你選擇的框架。
但是記住,這些項目只是示例,大多數情況下他們不適合大中型項目。
② 做前端開發的需要與資料庫打交道嗎
這個是不需要的,前端主要負責頁面開發,也就是用到html、css、js這些基本的技術,最多涉及到Ajax,介面都是寫好的,只要調用就可以了。資料庫都是有後台人員來寫的。
③ 常見的前端集成部署方案有哪些各自的優缺點是什麼
前端行業經歷了這么長時間的發展,技術元素非常豐富,這里列舉出一般web團隊需要用到的技術元素:
開發規范:包括開發、部署的目錄規范,編碼規范等。不要小瞧規范的威力,可以極大的提升開發效率,真正優秀的規范不會讓使用者感到約束,而是能幫助他們快速定位問題,提升效率。
模塊化開發:針對js、css,以功能或業務為單元組織代碼。js方面解決獨立作用域、依賴管理、api暴露、按需載入與執行、安全合並等問題,css方面解決依賴管理、組件內部樣式管理等問題。是提升前端開發效率的重要基礎。現在流行的模塊化框架有requirejs、seajs等。
組件化開發:在模塊化基礎上,以頁面小部件(component)為單位將頁面小部件的js、css、html代碼片段放在一起進行開發、維護,組件單元是資源獨立的,組件在系統內可復用。比如頭部(header)、尾部(footer)、搜索框(searchbar)、導航(menu)、對話框(dialog)等,甚至一些復雜的組件比如編輯器(editor)等。通常業務會針對組件化的js部分進行必要的封裝,解決一些常見的組件渲染、交互問題。
組件倉庫:有了組件化,我們希望將一些非常通用的組件放到一個公共的地方供團隊共享,方便新項目復用,這個時候我們就需要引入一個組件倉庫的東西,現在流行的組件庫有bower、component等。團隊發展到一定規模後,組件庫的需求會變得非常強烈。
性能優化:這里的性能優化是指能夠通過工程手段保證的性能優化點。由於其內容比較豐富,就不在這里展開了,感興趣的同學可以閱讀我的這兩篇文章 [1] [2]。性能優化是前端項目發展到一定階段必須經歷的過程。這部分我想強調的一點是性能優化一定是一個工程問題和統計問題,不能用工程手段保證的性能優化是不靠譜的,優化時只考慮一個頁面的首次載入,不考慮全局在宏觀統計上的優化提升也是片面的。
項目部署:部署按照現行業界的分工標准,雖然不是前端的工作范疇,但它對性能優化有直接的影響,包括靜態資源緩存、cdn、非覆蓋式發布等問題。合理的靜態資源資源部署可以為前端性能帶來較大的優化空間。
開發流程:完整的開發流程包括本地開發調試、視覺效果走查確認、前後端聯調、提測、上線等環節。對開發流程的改善可以大幅降低開發的時間成本,工作這些年見過很多獨立的系統(cms系統、靜態資源推送系統)將開發流程割裂開,對前端開發的效率有嚴重的阻礙。
開發工具:這里說的工具不是指IDE,而是工程工具,包括構建與優化工具、開發-調試-部署等流程工具,以及組件庫獲取、提交等相關工具,甚至運營、文檔、配置發布等平台工具。前端開發需要工具支持,這個問題的根本原因來自前端領域語言特性(未來我會單獨寫一篇文章介紹前端領域語言缺陷問題)。前端開發所使用的語言(js、css、html)以及前端工程資源的載入與定位策略決定了前端工程必須要工具支持。由於這些工具通常都是獨立的系統,要想把它們串聯起來,才有了yeoman這樣的封裝。前面提到的7項技術元素都直接或間接的對前端開發工具設計產生一定的影響,因此能否串聯其他技術要素,使得前端開發形成一個連貫可持續優化的開發體系,工具的設計至關重要。
④ 如何打造有戰鬥力的前端團隊
目前的前端工具用Dreamweaver相對來說真的是很過時了,有很多比Dreamweaver好用的前端開發工具,方便又直觀~
⑤ 新組建的前端團隊如何選擇前端框架方案
當一個參數的值改變時,組件的render函數被調用並返回一個新的組件樹。 React 將返回的組件樹與虛擬 DOM 樹進行比較,以確定如何更新真實的DOM。這種重新渲染所有內容並將結果與虛擬 DOM 進行比較的技術經實踐證明是非常有效的
Angular 是一個非常適合有 Java 或 C# 背景的企業開發人員的平台。TypeScript 和 Intellisense 的支持將使這些開發人員感覺到非常熟悉。雖然 Angular 是新的,但它已經有很多第三方組件庫了,公司可以立即購買並立即開始使用。Angular 團隊承諾要快速迭代框架,使之更好,且不會再次破壞向後兼容性。Angular 可用於使用 NativeScript 構建高性能原生應用。
Ember.js 是一個優化小團隊和技能水平較高的獨立開發者的生產力框架。其對配置上的約定,為新開發人員和組織長期維護大型項目提供了極好的起點。承諾的「穩定無停滯」已被證明是維護大型應用的有效方法,而不需要在最佳實踐改變時進行重寫。穩定性、成熟度和致力於創造共享代碼,促生了一個生態系統,這個生態系統使得大多數開發的簡易程度讓人驚訝。如果您正在尋找一個長期項目的可靠框架,Ember 是一個很好的選擇。
Polymer 是一個對於希望創建單一樣式指南,和要在整個組織中使用的組件集合的大型組織而言特別適合的框架。該框架提供可比較的開發工具。如果你想將一些現代化的功能應用在你的程序上,而不需要編寫大量 JavaScript,那麼 Polymer 是你們很不錯的選擇。
⑥ 前端需要學習資料庫嗎
前端前景是很不錯的,像前端這樣的專業還是一線城市比較好,師資力量跟得上、就業的薪資也是可觀的,學習前端可以按照路線圖的順序,
0基礎學習前端是沒有問題的,關鍵是找到靠譜的前端培訓機構,你可以深度了解機構的口碑情況,問問周圍知道這家機構的人,除了口碑再了解機構的以下幾方面:
1. 師資力量雄厚
要想有1+1>2的實際效果,很關鍵的一點是師資隊伍,你接下來無論是找個工作還是工作中出任哪些的人物角色,都越來越愛你本身的技術專業前端技術性,也許的技術專業前端技術性則絕大多數來自你的技術專業前端教師,一個好的前端培訓機構必須具備雄厚的師資力量。
2. 就業保障完善
實現1+1>2效果的關鍵在於能夠為你提供良好的發展平台,即能夠為你提供良好的就業保障,讓學員能夠學到實在實在的知識,並向前端學員提供一對一的就業指導,確保學員找到自己的心理工作。
3. 學費性價比高
一個好的前端培訓機構肯定能給你帶來1+1>2的效果,如果你在一個由專業的前端教師領導並由前端培訓機構自己提供的平台上工作,你將獲得比以往更多的投資。
希望你早日學有所成。
⑦ 前端搞那麼多工具框架庫是讓開發更簡單還是更復雜
相當於寫作文別人已經弄好模版了 你只用填內容就行了 效率肯定更高啊
⑧ 學習web前端需要學資料庫嗎
學習web前端其實是不用學習資料庫的
web前端主要學習的內容有:
1、Web前端需要掌握HTML+CSS的靜態布局相關知識。
HTML主要就是網頁編輯,這部分知識非常簡單,基本上都能學會。當然前提是經常練習要掌握熟練。
2、Web前端還需要學習JavaScript的知識。
JavaScript是Web前端中最重要的知識,所以這部分知識要引起重視。當然難度也相對較大,同學們需要用功學習哦!
3、Web前端需要學習jQuery。
其實jQuery要容易一些,不過不要認為有了jQuery就忽略了JavaScript,大型互聯網公司都是直接用JavaScript寫的,這樣的安全性要更加的高。看這個人對自己的標準是怎麼樣的。
4、Web前端需要學一點HTML5+CSS3的知識。
不要認為HTML5隻是添加了一些標簽而已,如果有興趣可以去網路看看HTML5的強大之處,很多的特效用CSS3都可以做。
5、Web前端Bootstrap框架的學習,這個框架應該每個東西都會用,難度不大,必須掌握。
6、Web前端還要學習Node.js–react–angular.js—backbone其實這些東西如果你JavaScript理解的一般,學起來會困難一些,不過前端框架更新的還算很快。如果能夠把JavaScript學好其實上面都夠了。
⑨ web前端開發需要掌握的幾個必備技術
Web前端開發需要掌握的幾個必備技術是:
HTML +_CSS核心、JavaScript、VUE框架
前端的應用非常廣泛,基本網站、APP、HTML5小程序等都需要前端開發,所以只要是互聯網產品基本都需要前端。
前端程序猿切頁面寫頁面,Web上、H5上的炫酷效果,是前端開發大展身手的地方。最常見的用於前端開發的技術組合是:
HTML+CSS+JavaScript。
web前端是在開發人員中最直接面向產品、面向用戶的設計人員,一個開發團隊的成果是要靠web前端去展現,因為用戶不會去關心後台的處理有多麼強大。
後端開發是寫後台,各種業務邏輯、數據處理、模塊介面、客戶端介面等等。後端開發者通常精通於一種Web編程語言和一個資料庫管理系統。電商平台點擊篩選條件下面為你篩選出來的寶貝的功能以及付款人數數據的變化等都是由後台來實現提供的。
目前web產品交互越來越復雜,用戶使用體驗和網站前端性能優化這些都得靠web前端去做。
前端開發則是網站的前台代碼實現,包括基本的HTML和CSS以及JavaScript/ajax,最新的高級版本HTML5、CSS3,以及SVG等。
前端開發需要學習的技術
1 掌握基本web前端開發技術:HTML、CSS、JavaScript、DOM、BOM、AJAX等,而且要了解它們在不同瀏覽器上的兼容情況、渲染原理和存在的Bug
2 必須掌握網站性能優化、SEO和伺服器端開發技術的基礎知識
3 必須學會運用各種web前端開發與測試工具進行輔助開發
4 除了掌握技術層面的知識,還要掌握理論層面的知識,包括代碼的可維護性、組件的易用性、分層語義模板和瀏覽器分級支持等
5 未來web前端開發工程師還要研究HTML5、web視覺設計、網站配色、網站交互設計模式等相關技術
web前端有廣闊的發展空間,app、小程序、移動端、pc端等都網站是需要前端技術的開發支持才能夠完成,技術門檻相對較低、需求量較大,薪資待遇良好。只要是互聯網端的客戶界面,就需要前端來製作完成,前端開發的編程量不大,但是需要部分編程,入門簡單,但是要學的深入需要一個過程。
Web前端招聘崗位
• 前端開發工程師、Web開發工程師、網頁開發工程師、HTML開發工程師...
• H5開發工程師、移動應用開發工程師、App開發工程師、小程序開發工程師...
• JS開發工程師、Vue.js開發工程師、Node.js開發工程師、前端架構師...
• 小游戲開發工程師、數據可視化開發工程師、WebGL開發工程師、WebVR開 發工程師、Web安全工程師...
⑩ 學前端要學後台和資料庫嗎
後台多學一些還是有好處的,做前端頁面需要後台給你返回數據(比如ajax) 你都要回,還有一些基本的後台語言 都要懂一些