歡迎光臨
每天分享高質量文章

剛開始學程式設計?這幾款小工具能讓你事半功倍

英文:Mario Hoyos,翻譯:36氪

http://36kr.com/p/5121154.html


科技行業裡,可供人們使用的工具成百上千,你要怎麼知道用哪一種上手最合適呢?


拿最近剛進入程式設計這行的人來說吧,大量的工具資訊堆砌過來其實毫無益處,反而會無從下手。我發現在自己的開發過程中,很多安裝的擴充套件工具不僅沒有真正起到助益作用,反而常常妨礙了正常的開發工作。


我不是專家,不過隨著時間的推移,我還是編製了一份工具清單,這些工具已經證明對我非常有用。如果你剛剛開始學習怎麼程式設計的話,這個清單能給你提供一些指導。如果你是個經驗豐富的開發人員,也希望你能從中學到一些新的東西。


我將把這篇文章分為Chrome擴充套件程式和VS程式碼擴充套件擴充套件程式兩部分。我知道還有其他的瀏覽器和文字編輯器,但是我想你當然只能在你能找到的工具裡選擇,所以還是別因為個人喜好而引起一場宗教般的爭論。


Chrome擴充套件程式



現在設我是一位web開發人員,以Chrome為陣地。下麵是一些能讓我少花點時間的工具:

  • WhatFont —— 名字就說明瞭一切。這是找出你最喜歡網站使用的字型的簡單方法,這樣你就可以為己所用了。

  • Pesticide—— 修改CSS的絕佳程式。當我試著學習匣子模型的時候,它簡直就是救命稻草般的存在。

  • Colorzilla ——用於複製確切顏色的一個網站,用它可以將顏色直接複製到剪貼簿上,這樣你就沒必要花太多時間獲得正確的RGBA組合了。

  • CSS Peeper——檢視網站使用的顏色時非常方便。在你一開始山寨你認為酷的網站的時候很管用。這個程式能讓你檢視它們的幕後的色彩方案。

  • Wappalyzer ——想要獲悉你在網站上看到的是什麼技術,這個程式很有用。想知道某網站使用什麼樣的框架或者它承載了什麼服務?這個照樣管用。

  • React Dev Tools——一款用於除錯應用程式的工具。有一點要提一下,它只有在你編寫React程式時才有用。

  • Redux Dev Tools——一款用於除錯應用程式的工具。有一點要提一下,它只有在你編寫Redux程式時才有用。

  • JSON Formatter ——讓JSON在瀏覽器中看起來更一目瞭然的不二之選。也許麻煩的JSON讓你苦不堪言,不過只要用了這個軟體,找到你要找的東西,所花費的時間會大幅縮短。

  • Vimeo Repeat and Speed ——加速Vimeo影片的絕佳工具。如果你像大多數的web開發人員一樣觀看影片教程,你就會知道用1.25倍的常規回放速度觀看它們是多麼的方便。本程式同時也有適用於YouTube的版本。


VS Code擴充套件程式



Visual Studio Code是我寫程式碼時的不二之選。


每個人都有他自己喜歡的文字編輯器,我也不例外。不過,我還是想把這些擴充套件程式介紹給你,而它們對你所使用的大多數編輯器都適用。看看我最喜歡的擴充套件程式有哪些:

  • Auto Rename Tag ——自動重新命名成對的HTML標記。假如你建立了一個

    標記。現在你想更改它。有了這個軟體,你只需要更改一個就行,另一個會自動修改。從理論上來說,使用這個軟體可以把你的工作效率提升一倍。

  • HTML CSS Support ——HTML檔案的CSS支援工具。該工具在獲得一些簡潔的語法高亮顯示和程式碼建議方面非常有用。

  • HTML Snippets ——這一工具在程式碼分段方面非常有用,可以為你節省大量的時間。它能跟Emmet配對,這樣一來你甚至都不用再真正鍵入HTML了。

  • Babel ES6/ES7 ——JavaScript Babel的輔助工具。如果你用的是Babel,這個工具可以讓你更容易區分程式碼。如果你喜歡JavaScript,那務必也不要錯過這款軟體。

  • Bracket Pair Colorizer ——色彩視覺化工具。如果你沒有準確地括號,那這個工具對於發現因此導致的許多常見漏洞十分方便。

  • ESLint ——你在編寫程式碼的時候,利用這個軟體可以輕易獲取有關漏洞的提示,而且在編碼過程中,它還可以幫助你養成良好的編碼習慣。

  • Guides ——這一工具可以被用來新增額外的指導行程式碼。這是另一個視覺提示,以確保你正確地括號了。

  • JavaScript Console Utils ——使控制檯日誌記錄變得更為簡單可行。如果你像大多數開發人員一樣,你會發現自己需要在除錯流中登入到控制檯(我知道我們應該使用除錯器)。這個實用的程式使得建立有用的console.log()陳述句變得易如反掌。

  • Code Spell Checker ——這一工具正如其名,是拼寫檢查程式。漏洞的的另一個常見來源是變數或函式名。這一拼寫檢查工具可以查詢不常見的單詞,而且還可以把我們用JavaScript編寫的東西進行有效的審核。

  • Git Lens ——可以讓我們對某檔案何時、以及由何人進行更改變得一目瞭然。當程式碼被破壞時,我們就能找到該負責任的人,而不是讓你當替罪羊了。

  • Path Intellisense ——檔案路徑自動完成程式。這樣一來從其他檔案中匯入重要的東西就非常方便了。這一工具使檔案導航變得輕而易舉。

  • Prettier ——自動程式碼格式化程式。忘掉那些你不得不手動縮排程式碼的日子吧,有了這個工具,事情就變得簡單多啦。這個程式會比你自己做得更快更好。對這個程式我是鼎力推薦的。

  • VSCode-Icons ——將圖示新增到檔案譜中。如果檔案結構非常不科學,你的眼睛想罷工的話,這個程式可能會有所幫助。它對於你正在製作的任何檔案都能提供有用的圖示輔助,能使你更為輕易地區分看到的內容。


總結


你肯定也有自己中意的工具,這些工具對你的開發工作來說是必不可少的。也希望我上面提到的一些工具能夠提高你的工作效率。


但是千萬不要落入貪多不爛的陷阱,因為它可能耗費很多時間。


希望你能在評論區留下你最喜歡的工具,這樣我們就可以共同進步了。


●編號322,輸入編號直達本文

●輸入m獲取文章目錄

推薦↓↓↓

Python程式設計

更多推薦18個技術類微信公眾號

涵蓋:程式人生、演演算法與資料結構、駭客技術與網路安全、大資料技術、前端開發、Java、Python、Web開發、安卓開發、iOS開發、C/C++、.NET、Linux、資料庫、運維等。

贊(0)

分享創造快樂