前端程序員的必備工具清單(MacOS)

作者: Calpa Liu
字數:1161
出版:2017 年 10 月 2 日
分類: MacOS
工欲善其事,必先利其器。一套完善的工具可以幫助我們事半功倍。而作為前端程序員的我,也是花了點時間為自己配置了一套工具。如果你也是使用 MacOS 作為你的開發系統的話,那麼你可以看一下這篇文章。

日常

Alfred 3

Alfred 3

Alfred Search
Alfred Search

Alfred 是一個強大的效率工具,而且它更加是一個全面的自動化工具平台。你可以從下圖感受一下:

Alfred 的功能
Alfred 的功能

你只要在 Alfred 的輸入框,寫下你想要的東西前幾個字,它便會顯示你所希望的命令。不過最強大的是可以和 MacOS 內置的全文搜尋一起用,也就是你輸入in 命令,它就可以全局全文搜尋。

全局搜尋
全局搜尋

另外,它也可以記錄你所 Copy 過的歷史,如果你使用 Emacs 的 Kill Ring 的話,他就會自動記錄代碼。我工作的時候就經常應用到 Alfred,因為有很多代碼都需要刪除,然後幾個小時後就有人跟你說那個代碼需要還原。

Clipboard 歷史記錄
Clipboard 歷史記錄

另外,它的 Powerpack 和 Workflows 提供 Alfred 一個升級的可能性(腦洞),讓你可以寫出自己的代碼,並快捷執行。

Aria2GUI

下載神器,網上有很多不同的前端界面,例如 Yet Another Aria2 Web FrontEnd

Yet Another Aria2 Web FrontEnd
Yet Another Aria2 Web FrontEnd

ImageOptim

ImageOptim

ImageOptim 界面
ImageOptim 界面

沒有經過優化或壓縮的圖片,直接上傳到伺服器或讓其他用戶下載的話,需要的時間都會很長,所以我的圖片大多都會經過 ImageOptim 優化一下。ImageOptim 是一個開源,免費的無損圖片優化工具。

Moom

Moom

Mac 本身沒有提供類似 Windows 上面移動,放大視窗的功能,因此會經常看到有些人的電腦很多個視窗重疊了。

Align Left
Align Left

TotalSpace2

TotalSpaces2

TotalSpaces2
TotalSpaces2

一個超好用的 Mac 桌面空間管理工具,包含以下六大功能:

  1. 可以上下左右放置桌面佈局,而不是只有默認的向左向右

    上下左右的桌面佈局
    上下左右的桌面佈局

  2. 觸控板可以跳轉上下左右的桌面格子

    觸控跳轉格子
    觸控跳轉格子

  3. 桌面格子可以設置默認的應用

    設置默認應用
    設置默認應用

  4. 全面的桌面概覽

    全面的桌面概覽
    全面的桌面概覽

  5. 更加炫酷的桌面跳轉效果

    跳轉效果
    跳轉效果

  6. 屏幕的四個角落可以觸發各自的動作

    屏幕角落觸發動作
    屏幕角落觸發動作

應用場景:

當只有一個屏幕,又要同時運行多個佔用全屏的應用,你可能需要切來切去。透過使用 TotalSpaces2,你就可以輕鬆切換屏幕,比如說下面看伺服器狀態,上面看代碼區域。

另外,你也可以設置 Terminal 應用在下方屏幕格子,編輯器在上方屏幕格子。

Eagle

Eagle 鏈接

Eagle
Eagle

Eagle 是一個專門為設計師而打造的圖片收藏及管理工具。雖然我不是設計師,但是我有收藏大量的圖片,尤其是二次元動畫的截圖。對於這麼多的圖片,我曾經都很苦惱,因為截圖之後無法再次調用。幸好有這個工具,我就可以輕鬆地收藏網頁圖片,或者截屏到 Eagle。之後可以打上標籤,或者人物的台詞。

感覺圖片太多,需要找個工具管理圖片 www
感覺圖片太多,需要找個工具管理圖片 www

Coding

oh-my-zsh

oh-my-zsh 鏈接

oh-my-zsh
oh-my-zsh

為什麼你的 Terminal 使用上來那麼不一樣?是的,oh-my-zsh 背後的社區驅動著我(逃。

有時間可以說說到底為什麼 oh-my-zsh 那麼強大,以及它的配件。

Solarized 配色方案

Solarized 配色方案 鏈接

兩種配色方案
兩種配色方案

清晰易見
清晰易見

包含的顏色
包含的顏色

SourceTree

SourceTree 鏈接

SourceTree 界面
SourceTree 界面

以前沒有習慣命令行的時候,我是用 SourceTree 來看 Git 歷史的。雖然我現在喜歡使用命令行來操作 Git,但是比較複雜的 Git 操作還是需要專門的工具的,例如 SourceTree 就是一個不錯的選擇。

高能區域(編輯器)

無論是什麼神的編輯器,還是編輯器的神,取其精華去其糟粕才是最好的。

Atom

Atom

Atom
Atom

Atom 是一個基於 Electron 的現代開源文本編輯器,你可以直接黑掉它的核心,甚至改得完全不一樣。你可以使用 HTML,CSS/Less 及 JavaScript 修改 Atom 的功能,它的功能包括但不限於:

  1. 支持跨平台

  2. 內置的 Package 管理系統

    你可以在 Atom 直接搜尋 Package,並且安裝 Package。

  3. 自動補全

  4. 瀏覽檔案系統

  5. 全局搜尋

編輯器 with Git Diff
編輯器 with Git Diff

Atom 設置面板
Atom 設置面板

內置的 Package 管理系統
內置的 Package 管理系統

Emacs

Emacs = Escape + Meta + Alt + Control + Shift

Emacs Hello World
Emacs Hello World

其實我是蠻喜歡 Emacs 的思想,以及它的按鍵。因為寫代碼就好像輸入打遊戲需要的特殊命令,一種寫代碼就是玩遊戲的概念。我養成盲打的習慣,好像也是因為 Emacs 而開始的。

Vim

如果我要簡單的 Git Commit,我就可以直接寫 Git Commit 記錄,然後輸入:wq,並不需要那麼複雜的工具。

瀏覽器

  1. Google Chrome

這個是個必需品吧。

  1. Postman

一個超級好用的 HTTP 請求工具,誰用誰知道。

相關文章

  1. 《神兵利器 — HHKB Pro 2 開箱文》
MacOS
關於 Calpa

Calpa 擅長使用 TypeScriptReact.jsVue.js 建立 Responsive Website。

他積極參與開源社區,曾在 2019 年的香港開源大會上擔任講者,提供工作經驗和見解。此外,他也在 GitHub 上公開分享個人博客程式碼,已獲得超過 300 顆星星和 60 個分支的支持。

他熱愛學習新技術,並樂意分享經驗。他相信,唯有不斷學習才能跟上快速演變的技術環境。

熱門文章

最新文章

圖片管理中心
管理圖片資源
IP 查詢
快速查詢和定位 IP 地址的地理位置和相關信息
Python 運行器
無需後端、無需登入,只需打開瀏覽器即可運行 Python 代碼(由 Pyodide 提供支持)
封面圖生成器
自動創建適合各種平台的文章封面圖
原作(青山剛昌)產生器
一鍵創建原作(青山剛昌)的封面圖
日本色彩
探索和使用傳統日本色彩
部落格內容洞察儀表板
以視覺化儀表板方式追蹤文章成效、分享熱度與分類分布,協助創作者掌握內容表現。
蒙特卡羅估算 π
使用蒙特卡羅方法演示 π 值的估算過程
LLM
使用 LLM 模型進行聊天
活動圖生成器
一鍵創建活動的封面圖
Wagmi Card
一鍵創建 Wagmi 的封面圖
Facebook Quote
Facebook Quote
Music Macro Language (MML) Studio
用程式語法編寫旋律,用音符構築想像
Blurhash
一鍵創建 Blurhash
文字分類器
使用 MediaPipe TextClassifier 分類文字
前端工程師免費工具資源
前端工程師免費工具資源
後端工程師免費工具資源
後端工程師免費工具資源
全端工程師免費工具資源
全端工程師免費工具資源
Web3 工程師免費工具資源
Web3 工程師免費工具資源
紫微斗數排盤系統|結合 AI 的命盤性格與事業財務分析生成器
紫微斗數排盤工具,輸入生日與時辰,自動生成完整命盤分析提示(Prompt)。結合最專業紫微理論與 AI 助力,助你深入解析性格、事業、財務與人際課題。免費使用,適合命理師及紫微愛好者。
PixAI Prompt 組合器|快速打造可用於 AI 繪圖的語言拼圖
使用 PixAI 卻不會寫 prompt?這個工具幫你一鍵組裝角色、表情、風格語彙,輸出高品質繪圖提示語句(Prompt),可直接貼入 PixAI 使用。適合插畫師、創作者、AI 新手與 VTuber 角色開發者。