# IDE 環境設定(VSCode) :::info :book:這裡記錄平常在使用上的工具! ::: [TOC] ## 目前使用的介面 ![image](https://hackmd.io/_uploads/S1EIPd5g0.png) 為了看起來自己覺得舒服點??找了些讓開發介面變得美觀的套件工具 ### One Dark Pro ---- >基於 Atom 的預設 One Dark 主題,是 VS Code 下載次數最多的主題之一,採用暗色調、高對比、語法高亮化設計減少眼睛疲勞 ![image](https://hackmd.io/_uploads/rks9NcjlA.png) ### vscode-icons ---- >將檔案、資料及加上美美的圖示快速識別(主要是美美的看起來舒服?) ![image](https://raw.githubusercontent.com/vscode-icons/vscode-icons/master/images/screenshot.gif) ### Chinese (Traditional) ---- > 中文(繁體)語言套件,讓 VS Code 提供在地化的使用者介面 ### Preview on Web Server ---- > 提供在 Web 伺服器上執行的 HTML 的預覽。當您儲存檔案時,此擴充功能會自動重新載入瀏覽器或側面板(即時預覽功能) ![image](https://github.com/YuichiNukiyama/vscode-preview-server/raw/master/images/feature.gif) ### Rainbow CSV ---- > 對所有「純文字」和「.csv」檔案執行表格自動偵測演算法,並加入顏色增加對比度 ![image](https://i.imgur.com/ryjBI1R.png) ### Python ---- 這個套件主要方便自己確認運行環境版本以及透過自動完成、程式碼導覽、語法檢查等編輯程式碼,另外有提供測試(Python 調試器)、格式化、重構、變數瀏覽器、測試瀏覽器 <img src="https://raw.githubusercontent.com/microsoft/vscode-python/main/images/InterpreterSelectionZoom.gif" alt="HTTP-GO" width="250px" heigh="200px"> ![image](https://raw.githubusercontent.com/microsoft/vscode-python/main/images/ConfigureTests.gif) ### Jupyter ---- > Jupyter 套件是一個在開發 python 非常方便測試和驗證的工具,該套件可以整合進 vscode 開發環境 ![image](https://github.com/Microsoft/vscode-jupyter/raw/HEAD/images/Jupyter%20README/notebookui.png) ### Git Extension Pack ---- 擴充包包含以下實用的 Git 工具: #### GitLens > 直覺的 Git 紀錄,一目暸然當前的版本狀態 ![image](https://raw.githubusercontent.com/gitkraken/vscode-gitlens/main/images/docs/current-line-blame.png) ![image](https://raw.githubusercontent.com/gitkraken/vscode-gitlens/main/images/docs/status-bar.png) ![image](https://hackmd.io/_uploads/r1eFbojx0.png) > 查閱歷史修改紀錄中向後和向前導航 ![image](https://raw.githubusercontent.com/gitkraken/vscode-gitlens/main/images/docs/revision-navigation.gif) > 詳細資訊視圖,可以方便、輕鬆地存取提交圖 ![image](https://hackmd.io/_uploads/r1TVF3il0.png) ### Git Graph ---- > 想要簡單一點的顯示方式也可以選擇這個套件 ![image](https://hackmd.io/_uploads/By9AC3oeR.png) #### Git History > 檢視 git 日誌、檔案或行歷史記錄 ![image](https://raw.githubusercontent.com/DonJayamanne/gitHistoryVSCode/main/images/fileHistoryCommandv3.gif) #### Project Manager > 可定義自己的專案(也稱為收藏夾),或選擇自動偵測Git、Mercurial或SVN儲存庫、VSCode資料夾或任何其他資料夾,可以儲存資料夾專案並給予所屬標籤 ![image](https://hackmd.io/_uploads/SyAEC3ilR.png) ### AWS Toolkit ---- > AWS 的工具包裡面有多個AWS服務套件,主要希望使用 AWS Code Whisperer 透過AI程式碼撰寫發想 ![image](https://d2908q01vomqb2.cloudfront.net/7719a1c782a1ba91c031a682a0a2f8658209adbf/2023/05/27/s3-well-defined-comment.gif) > AWS Code Whisperer 還提供了安全掃描,可以自動檢查程式碼是否存在風險 ![image](https://docs.aws.amazon.com/images/codewhisperer/latest/userguide/images/security-scan-vscode-python.gif) ### 終端機(oh-my-zsh) ---- ![image](https://hackmd.io/_uploads/B1j4pToxR.png) > 漂漂的終端機美化可以參考菜小鬼這篇安裝oh-my-zsh[終端機介面設定筆記](https://hackmd.io/@e9gZC-1CQNOzcD2pMY6apA/HyCaKdKI6)