高效的Coding，前端開發人員值得一看的前端開發工具

摘要

　　看着我稚嫩的代碼，今天我應該也能夠過個快樂的兒童節吧，哈哈哈哈哈。既然是兒童節，那我就要給小夥伴們發發禮物，什麼禮物呢？那就是小編在使用的前端開發工具，保證你會有個難忘的兒童節。好，下面就由我帶你們一一的看看禮物吧。

 

工欲善其事必先利其器

　　對於一個前端開發人員來講，擁有一款適合本身的「武器」是很是重要的。vscode就是這樣一款優秀的前端開發編輯器，由於小編也在使用這個編輯器，像別的webstorm、sublime text等也是很棒的。因爲小編目前在使用vscode，因此給你們分享下個人編輯器經常使用的插件。讓你們一塊兒去學習打磨屬於本身的前端開發「武器」。

 

-語言包

　　 Chinese (Simplified) Language Pack for Visual Studio Code（這是vscode編輯器中文（簡體）語言包，能夠爲vscode提供本地化中文界面）

 

-界面美化

 　　Agila Theme（界面主題，這款主題我我的比較喜歡，界面配色看着舒服。小夥伴若是不喜歡，能夠在插件庫中尋找本身喜歡的主題進行設置）

　　vscode-icons（vscode圖標，這個插件能夠很好的區分.css、.js等文件圖標，大大提升開發效率，強烈推薦你們使用）

 

-代碼美化

 　　Bracket Pair Colorizer（括號對色器，這個插件能夠快捷的找到括號的另外一半，簡而言之就是能輕易的在代碼海中找到左右括號）

　　Rainbow Brackets（彩虹括號，爲圓括號、方括號和大括號提供彩虹色，能在開發中快捷找到括號對）

　　indent-rainbow（縮進彩虹，一個簡單的擴展，促使代碼的縮進更易讀懂）

　　Syntax Highlighter（語法突出顯示，提供全部編程語言的通用語法着色引擎，凸顯關鍵字、自定義函數等語法着色區分）

　　Prettier - Code formatter（格式化美化代碼，漂亮的代碼書寫老是每一個程序員的追求，這個插件能夠配置屬於本身的代碼格式，一鍵優化雜亂的代碼）

 

-便捷式編碼 

 　　Auto Close Tag（自動標籤閉合，自動添加HTML/XML的標籤閉合）

　　Auto Rename Tag（自動標籤重命名，自動重命名配對好的HTML/XML標籤）

　　Auto Import（自動導入，自動查找解析並提供全部可用可導入的代碼操做）

　　Code Spell Checker（代碼拼寫檢查器，一個簡單的代碼拼寫檢查插件，能夠快速的捕獲在編碼中的書寫錯誤，保持高效的編碼）

　　ES7 React/Redux/GraphQL/React-Native snippets（ES7/JS代碼段，這個插件可使用簡短的代碼段書寫繁瑣的代碼，提升開發效率）

　　React-Native/React/Redux snippets for es6/es7（React-Native/es6/es7代碼段，這個插件也能夠快速的書寫代碼段，能夠對比着使用）

　　Path Intellisense（智能路徑，快捷高效的引入組件的路徑，節省了書寫組件路徑名的額外開發時間）

 

-GIT功能插件

　　Azure Repos（Azure存儲庫，它容許咱們監視、構建、管理Git源存儲庫的拉取請求和更多的工做項）

　　Git Graph（Git圖，能夠查看我的的存儲庫以及項目組庫的Git庫，能夠輕鬆的進行合做開發）

　　GitLens — Git supercharged（GitLens，GitLens加強了vscode中內置的Git功能，同時能夠清晰的查看代碼做者的身份等信息，能夠促使項目組更好的去Review代碼）

 

-vscode檢修插件

　　Fix VSCode Checksums（vscode檢驗和修復器，用於檢查vscode編輯器的校驗和，應用校驗和更改重啓vscode，消除編輯器核心文件警告）

 

衆人拾柴火焰高

　　一我的的力量老是有限的，咱們要學會與他人合做，學會交流溝通。小編以爲本身身處的項目組溝通合做就很棒，能快速的瞭解到項目的進度，能及時的掌握最新的需求變更等等。那咱們項目組是如何作到這樣默契的配合呢，接下來就由我給你們繼續推薦兒童節禮物，合做溝通的方式。溝通是一個前端開發人員必備的一項技能，由於它可讓你的技術進一步提高，還能夠提高我的的交流度。無論你是技術大牛仍是技術小白都須要和別人溝通交流，能讓他人清晰的瞭解到你的意圖與需求。因此這就給你們發放一些小組合做的一些方案，能更清晰的發現問題，這樣就能夠及時的去溝通交流，促使項目更快的開發完畢。

 

-石墨文檔（強烈推薦）

　　石墨文檔是小編目前用的最多的合做方式，不只實時更新快，並且合做簡便易懂。簡單的列舉項目中可使用石墨文檔創建的文檔，具體文檔能夠分爲下列幾等：

　　　　一、項目迭代文檔：（肯定項目開發時間、開發人員安排、項目開發需求原型圖、測試用例等）

　　　　二、bugs收集處理表：（測試人員收集測試過程當中的bugs，與開發人員同步進行，實行測試修復同步操做）

　　　　三、項目組開發人員具體開發時間節點表：（安排開發人員的開發週期，具體的安排每一天的開發工做，明確開發進度）

 

-合做開發

　　Worktile（worktile，可使用worktile創建bugs處理文檔，讓開發人員及時的處理未解決的bugs和掌握已解決完畢的bugs） 

　　RAP2（rap2接口說明文檔，接口說明文檔，讓先後端開發及時瞭解聯調的是哪一個接口以及讓前端開發人員瞭解接口返回數據格式等，促使先後端去溝通交流接口數據的統一性）

　　Leangoo 領歌（可視化實時協做，讓開發更透明、更高效。領歌有着靈活的看板模式，能夠創建定義不一樣人員的工做流程，拖動任務體現開發人員工做進度，讓團隊成員之間的即時協做更好更快）

 

好馬配好鞍，好船配好帆

　　一我的擁有了一個好的「武器」，同時也擁有一個無缺的團隊，能夠這樣還不夠，咱們我的也得增強本身的其餘裝備，就像主題說的同樣，好馬配好鞍，好船配好帆。沒有人會嫌棄本身變得更好更優秀，下面就給你們強烈的推薦我額外的強力「裝備」。

 

-開發工具

　　Snipaste（這是一款截圖工具，小巧卻功能強大，它不只能夠快速的截圖，還能夠集成標註和貼圖功能，讓截圖能夠實時固定在咱們的可視區域，強烈推薦！！！）

　　Microsoft To Do（這是微軟的一個我的任務、資料分享工具，能夠實時的安排本身的工做進程、也能夠分享本身的技術心得給小夥伴）

　　WinSCP（這是一個 Windows 環境下使用的 SSH 的開源圖形化 SFTP 客戶端。同時支持 SCP 協議。它的主要功能是在本地與遠程計算機間安全地複製文件，而且能夠直接編輯文件。）

　　spy-debugger（微信調試，各類WebView樣式調試、手機瀏覽器的頁面真機調試。便捷的遠程調試手機頁面、抓包工具，支持：HTTP/HTTPS，無需USB鏈接設備）