如何轻松阅读 GitHub 上的项目源码

前言

" Hackers, likewise, can learn to program by looking at good programs -- not just at what they do, but at the source code. "--- Paul Graham

阅读优秀项目的源码是提高编程能力的一个有效有手段。 因此,有着众多开源项目的 GitHub 是一个不可多得的学习宝库。 那么,问题来了,如何方便阅读这些源码? 下面以 wordPress 项目为例,介绍 3 种方式

  • 下载源码到本地用 IDE 阅读
  • 直接用 GitHub 的代码浏览功能
  • 使用 coding.net 的 CodeInsight 来查看

下载源码到本地用 IDE 阅读

  • 首先下载源码,如下图所示可以选择 clone 到桌面和下载 zip 文件两种方式
图片
图片
  • 用本地 IDE 打开

代码的阅读不同于普通文本,需要高亮,套转到定义,文档结构树等辅助手段才能方便的阅读。普通的文本编辑器或阅读器根本无法满足需求。因此,用 IDE 打开最为方便。

这是最直接的一种方式,而且也可边看边运行代码。

但如果就只是浏览代码来说还是过于繁琐

首先,你得装个 IDE

再者,就我个人来说我不太喜欢自己的计算机上有太多不常用的项目,下载了又删很麻烦

直接用 GitHub 的代码浏览功能

点击文件 " wp-comments-post.php " 可以看到高亮的文件。 如下图所示

图片
图片

图片
图片

这样虽然操作简单,但仅有代码高亮的功能,看起来还是不太方便。

使用 coding.net 的 CodeInsight 来查看

个人比较喜欢这种方式,所以重点介绍

  • 注册一个 coding.net 账号

  • 选择导航栏上的 “ + ” ,点击创建项目


    图片
    图片
  • 输入项目名,描述,以及 GitHub 上 WordPress 的 “HTTPS clone URL”,点击“创建”

    图片
    图片

  • 创建项目后会自动跳到项目首页,依次点击左侧导航栏的“代码”,再点击菜单栏上的“代码阅读”,最后点击创建新的阅读版本


    图片
    图片
  • 输入版本“master”, 然后填写备注,点击创建即可

图片
图片
  • 等待分析完毕后就可以点击去阅读代码了


    图片
    图片

CodeInsight 的 Killer Feature

  • 查看项目的文件结构(界面左侧树状图)
  • 查看当个文件的内部结构,点击索引,即可跳到文件相应位置( 右上角的 structure )
  • 同时查看多个文件,通过 tab 方便切换


    图片
    图片
  • 将鼠标放到相应函数上,即可显示该函数的定义。
  • 点击函数,可以显示函数内部代码


    图片
    图片

当然,这个新上线的功能的槽点也很多,支持的语言太少,Java, C/C++等主流语言没有支持。点击查看函数内部实现时,比较卡。

coding 团队说他们以后会陆续支持这些语言,并且改进性能问题。那我就坐等升级更新啦

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,342评论 25 709
  • 落日长河游, 云霞忘忧愁。 悲喜淡笑间, 功名付水流。
    宗林的李阅读 2,854评论 8 5
  • 之前在朋友圈发了《你好,旧时光》的简评,好多人追我要读后感。其实读后感这种东西和很多事一样,都需是“一鼓作气,再而...
    白露微霜阅读 3,892评论 0 50
  • 人之初,性本善。我们一生下来,都是一张没有涂鸦的白纸,随着时间的推移,我们都一点一点的成熟,接触的人越来越多,牵扯...
    小花花_阅读 2,118评论 0 1