8個酷炫的GitHub技巧,讓你看起來像大佬一樣!

前端小智發表於2022-06-01

有夢想,有乾貨,微信搜尋 【大遷世界】 關注這個在凌晨還在刷碗的刷碗智。

本文 GitHub https://github.com/qq449245884/xiaozhi 已收錄,有一線大廠面試完整考點、資料以及我的系列文章。

作為一名開發者,大部分都用過 GitHub。但你可能不知道,GitHub有很多隱藏的功能可以幫助我們更好地使用它。

1. 使用 "t" 鍵來快速搜尋檔案

這是一個很酷的功能,只有少數人知道。當你想檢視一個檔案的內容時,你可以按 "T"鍵,然後輸入檔名,就可以直接跳到目標檔案。

步驟

  1. 開啟 https://github.com/lodash/lodash
  2. T
  3. 輸入 add.test.js(任何你想搜尋的檔名)。
  4. 點選跳轉,檢視檔案內容

2. 用線上 "VSCode"編輯器檢視程式碼的3種方法

儘管使用 "T" 鍵可以讓我們快速搜尋檔案,但當你想檢視整個專案程式碼時,它就會變得低效。

這裡分享三種線上檢視程式碼的方法,就像在VSCode編輯器中一樣。第三種是我最喜歡的方式,我相信你會喜歡它。

 2.1. 方法1:使用"."快捷鍵

  1. 開啟專案 https://github.com/vuejs/vue
  2. 鍵盤點選 '.' 鍵
  3. 然後頁面會被重定向到 https://github.dev/vuejs/vue

2.2. 方法2:使用 "github1s.com"

當你在GitHub上看到你喜歡的專案時,你需要把 "github "改為 "github1s",以達到與方法1相同的效果!

  1. 開啟專案 https://github.com/vuejs/vue
  2. https://github.com/vuejs/vue 修改為 https://github1s.com/vuejs/vue

2.3. 方法3:使用 "gitpod.com/#xxx"

第三種方式很神奇,你甚至可以直接線上執行Node.js程式碼,我太喜歡了。它非常容易使用,你只需要在GitHub連結前加上gitpod.com/#。

  1. 開啟專案 https://github.com/qianlongo/... (
  2. https://github.com/qianlongo/... 前加入gitpod.com/#。

3. 將指定程式碼行分享給別人

有時你指定某行程式碼,並將它的位置分享給別人,如下所示:

image.png

怎麼做呢?

步驟:

  1. 開啟專案:
    Open https://github.com/qianlongo/...
  2. 點選左邊的行號
  3. 複製連結(https://github.com/qianlongo/...

我相信你一定注意到我們的連結後面有 "L8"。是的,沒錯,你可以通過修改 "L "+行號連結到你想要的程式碼。

4. 將指定多行程式碼分享給別人

既然我們可以連結到單行程式碼,那麼我們可以連結到多行程式碼。

步驟:

  1. 開啟專案:
    Open https://github.com/qianlongo/...
  2. 按住 "shift "鍵,點選左邊的行號。
  3. 複製連結(https://github.com/qianlongo/...

5. 跳到函式定義的地方

如何快速連結到定義函式的地方?我向你推薦一個chrome外掛,名字叫sourcegraph
當該外掛安裝後,當滑鼠放在使用該功能的地方時,會出現一個按鈕。點選可以連結到它被定義的地方。

image.png

6. 檢視快捷鍵列表

GitHub提供了很多快捷鍵來幫助我們閱讀程式碼,但記住它們並不是一件容易的事情,幸運的是你可以用 "Shift "+""來調出快捷鍵列表。

image.png

作者:fatfish 譯者:前端小智 來源:medium

編輯中可能存在的bug沒法實時知道,事後為了解決這些bug,花了大量的時間進行log 除錯,這邊順便給大家推薦一個好用的BUG監控工具 Fundebug

原文:https://javascript.plnenglish...

交流

有夢想,有乾貨,微信搜尋 【大遷世界】 關注這個在凌晨還在刷碗的刷碗智。

本文 GitHub https://github.com/qq449245884/xiaozhi 已收錄,有一線大廠面試完整考點、資料以及我的系列文章。

相關文章