面向AngularJS開發人員的21款實用工作流工具

最近一段時間以來,AngularJS已經成爲Web領域人氣最高的技術方案,而這要歸功於其在簡化Web應用程序開發方面所起到的良好收效。目前,AngularJS已經成爲開發人員與技術愛好者社區當中最炙手可熱的名頭之一。在AngularJS的幫助下,我們可以構建起一系列Web應用程序及網站方案。如果各位朋友感興趣,也推薦大家點擊此處查閱《AngularJS學習免費電子書》來做好利用該技術進行開發的前期準備。

AD:51CTO 網+ 第十二期沙龍:大話數據之美_如何用數據驅動用戶體驗

最近一段時間以來,AngularJS已經成爲Web領域人氣最高的技術方案,而這要歸功於其在簡化Web應用程序開發方面所起到的良好收效。目前,AngularJS已經成爲開發人員與技術愛好者社區當中最炙手可熱的名頭之一。在AngularJS的幫助下,我們可以構建起一系列Web應用程序及網站方案。如果各位朋友感興趣,也推薦大家點擊此處查閱《AngularJS學習免費電子書》來做好利用該技術進行開發的前期準備。

AngularJS應用程序也能夠被整合到其它現有系統或者項目當中。它同時也是一套強大的前端框架,可用於設計富用戶界面(簡稱UI)。目前人氣較高的AngularJS應用程序包括Ghost(一款博客平臺,可不是與蕃茄花園並駕齊驅那款)、Goodfilms移動站點(一個電影回顧站點)以及CVsIntellect(一款簡歷製作應用)。

好了,如果大家已經身爲一名AngularJS應用程序開發人員,那麼肯定需要各類輔助工具幫自己更高效地進行項目創建。因此在今天的文章中,我們將共同瞭解二十一款極具實用性的AngularJS工具。這份清單當中包含有多款代碼編輯器、測試工具以及擴展方案等等。下面一起來看。

AngularJS框架

1) Ionic

Ionic

Ionic是一套開源前端框架,旨在利用HTML、CSS以及JavaScript實現移動應用程序開發。大家可以藉此爲AngularJS帶來多種更爲強大的能力,例如UI交互、手勢操作與動畫效果等等。此外,大家還可以生成動畫與漸變系統,併爲自己的應用程序設計啓動畫面與圖標。Mallzee與Chef Steps就是兩款利用Ionic開發而成的知名應用產品。

2) Supersonic

Supersonic

Supersonic是一款前端框架,專門用於開發數據驅動型混合應用程序以及面向移動設備的酷炫用戶界面。除了大量CSS組件之外,大家還能夠在Supersonic中以原生方式實現UI組件,例如導航欄、標籤欄、抽屜、信息卡以及網格系統等等。

3) LumX

Lumx

Lumx是一款基於AngularjS與谷歌Material設計原則的響應式前端框架。它是一款強大的JavaScript MVC框架,能夠以輕鬆快捷的方式創建出單頁面應用程序。大家還可以利用LumX在開發成果中加入流暢動畫、日期選擇、通知、下拉菜單、文本字段、滾動條以及其它多種功能。

4) Radian

Radian

Radian是一套AngularJS框架,合適處理多種開發項目。在Radian的幫助下,大家可以將一款AngularJS應用程序拆分成多個可管理的去耦組件,從而將代碼的抽象及模塊化水平提升到新的層面。Radian基於AMD架構(即異步模塊定義)且允許大家將其用於應用程序測試。

5) Mobile Angular UI

Mobile

Mobile Angular UI是一款前端框架,旨在利用Bootstrap 3與AngularJS構建HTML 5移動應用程序。這套框架提供大量Bootstrap 3移動組件,其中包括開關、覆蓋、側邊欄以及導航欄等等。目前利用Mobile Angular UI開發的熱門應用程序包括Hotelier News以及Good Doctor。

AngularJS代碼編輯器

6) Sublime Text

Sublime

Sublime Text是一款面向代碼、標記與內容整理等工作的跨平臺文本編輯器。它提供多種可定製選項,幫助大家進行按鍵綁定、代碼補全、片段、宏以及其它常見操作。在Sublime Text的支持下,我們可以實現變更縮進設置、在編輯過程中進行多重內容選定並變更語法等等。

7) CodePen

CodePen

CodePen是一款面向前端Web開發工作的HTML、CSS以及JavaScript代碼編輯器。它提供多種功能,具體包括代碼審查、調試、實時代碼編輯以及協作等。

8) JS Fiddle

JS Fiddle

JS Fiddle是一款在線代碼編輯工具。大家可以利用各自獨立的面板分別執行JavaScript、CSS、HTML以及輸出代碼。大家還可以利用JS Fiddle實現代碼片段共享、代碼審查、測試、調試以及實時協作等功能。

AngularJS IDE

9) WebStorm

Webstorm

Webstorm是一款極具人氣的JavaScript集成開發環境(簡稱IDE),允許用戶利用Node.js實現客戶端/服務器端開發工作。這款工具還內置一款代碼編輯器,支持Compass、AngularJS、HTML以及CSS等等。它亦能夠實現一系列功能,例如錯誤檢查、重構與代碼補全等。

10) Aptana

Aptana

Aptana是一款開源的Web應用集成開發環境(簡稱IDE)。這款工具允許大家構建、測試、編輯、審查並調試HTML、CSS以及JavaScript代碼。這款工具基於雲環境且擁有高度可定製特性。

11) Appery

Appery

Appery是一款基於雲的平臺,旨在利用公有/私有云選項開發移動及響應式應用程序。大家可以利用它構建起多種iOS、HTML 5以及Android應用程序。這套集成開發環境(簡稱IDE)還提供可視化編輯器,幫助大家通過簡單的拖拽操作利用jQuery Mobile、Angular JS、HTML 5以及Bootstrap組件構建起富用戶界面。

AngularJS測試工具

12) Protractor

Protractor

Protractor是一款專門面向AngularJS應用程序的Node.js測試框架。在Protractor當中,其提供一套利用JSON Webdriver Wire協議控制的瀏覽器,能夠以異步方式執行查找及DOM元素交互等操作。因此,它允許大家對各類運行在真實瀏覽器之內的應用程序進行測試——正如用戶的實際使用過程一樣。

13) Mocha

Mocha

Mocha是一套面向Node.js與該瀏覽器的JavaScript框架。它同時支持行爲驅動與測試驅動兩類開發方式。Mocha使得異步代碼測試變得非常便捷,而且支持使用任意斷言庫。Mocha還提供多項定義功能,例如:

•    元生成套件與測試用例

•    將未捕獲異常映射至正確測試用例

•    可擴展報告

•    測試特定超時

•    支持節點調試工具

14) Code Orchestra

Code

Code Orchestra是一款用於對移動/Web應用程序進行測試及構建的開發工具。它以程序方式起效,允許用戶實時編寫代碼。當大家編輯代碼並點擊保存時,相關修改內容會被直接交付至運行中的應用程序。它同時可與AngularJS等多種主流Web技術協作,且支持全部IDE方案。

AngularJS擴展

15) ng-inspector

ng-inspector.

ng-inspector提供一套監督控制面板,用於對AngularJS應用程序進行開發與調試。它屬於一款面向Chrome、Safari以及火狐等平臺的瀏覽器插件。該擴展提供DOM高亮顯示、層次範圍查看、範圍模式查看等,且完全以實時方式更新。

16) angular-gettext

Angular-gettext

Angular-gettext是一款面向AngularJS應用程序的翻譯工具。它支持超過130種不同種類的語言。

17) Angular JS Eclipse Plugin

Eclipse

Eclipse是一套面向Java開發人員的集成開發環境(簡稱IDE)。不過我們可以利用各類插件輕鬆對其進行擴展,從而支持多種編程語言,包括JavaScript、Python以及Ruby。AngularJS Eclipse插件能夠對Eclipse WTP(即Web工具平臺)進行擴展,從而將其轉化成一套支持AngularJS表達與命令、Angular Explorer視圖的HTML編輯器外加JavaScript編輯。

AngularJS庫

18) Angular Fire

Angular Fire

Angular Fire是一套AngularJS代碼捆綁方案,用於將Firebase後端與AngularJS應用程序相對接。Firebase是一套Web應用程序開發框架,其主要產品就是Angular Fire——AngularJS的一套開源庫。Firebase SDK與Angular Fire能夠提供三向數據綁定、快速數據同步、內置驗證與用戶管理服務以及免費託管等功能。

19) Polymer

Polymer

Polymer是一套用於擴展HTML詞彙的庫。它提供一套聲明式語法,能夠便捷地對定製化元素進行定義。除此之外,它還提供其它多種功能,例如模板、雙向數據綁定以及屬性觀察等。因此,它能幫助大家以更爲精簡的代碼構建起可以重複利用的Web技術元素。

20) UI Bootstrap

Twitter Bootstrap

Twitter Bootstrap是一款高人氣HTML、CSS以及JS框架,主要用於面向移動設備的Web應用程序開發任務。UI Bootstrap通過提供一系列基於Bootstrap標記與CSS組件的原生Angular JS命令發揮出Twitter Bootstrap的強大能力,其中包括Accordion、Alert、Carousel、Cooapse、Timepicker以及Dropdown等等。

21) Angular UI Router

Angular UI Router

Angular UI Router是一款面向Angular JS命令的原生庫。它作爲Angular JS的路由框架起效,能夠將界面拆分成一套狀態機。它的主要優勢體現在強大的狀態與視圖摺疊能力。

總結

我已經把自己整理出的一切有價值信息都囊括在了文章當中。但是可以肯定,目前大家常用的AngularJS工具、擴展及測試方案還有很多。如果各位在實踐過程中積累到了其它出色的選項,請在評論欄中與我們分享。

原文鏈接:

http://codecondo.com/useful-workflow-tools-for-angularjs-developers/

原文標題:21 Useful Workflow Tools for AngularJS Developers

核子可樂譯

發佈了4 篇原創文章 · 獲贊 39 · 訪問量 38萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章