Skip to content

code-navigation

Subscribe to all “code-navigation” posts via RSS or follow GitHub Changelog on Twitter to stay updated on everything we ship.

~ cd github-changelog
~/github-changelog|main git log main
showing all changes successfully

A total redesign of GitHub’s code search and navigation was released to all logged in GitHub users in May. Starting today, the new redesigned code navigation experience, including a file tree and symbols pane, will be available to anyone browsing anonymously on GitHub.com. To access the new code search experience, and make full use of the symbol navigation, create an account or log in to GitHub.com.

See more

At GitHub Universe last year, we announced a total redesign of GitHub's code search and navigation experience, powered by our all-new code search engine that we built from scratch. And in February, we announced our public beta.

Today, we are rolling out this feature to all GitHub users. Thanks to the members of the beta community for your excellent feedback and engagement throughout the beta!

Screenshot of code search results

Check out our blog post to learn more about how GitHub's new code search and code view can help you search, navigate, and understand your code. And if you have feedback, please share it with us in our feedback discussion.

See more

Reading and understanding code is an absolutely critical task for software developers. Research suggests developers spend far more time reading code than writing it. Reviewing a pull request, planning a new feature, researching a system’s architecture, or determining how to fix a bug are all activities that rely on finding critical information scattered across the codebase.

That’s why we’ve built the new code search and code view—to help developers search, navigate, and understand their code, their team’s code, and the world’s open source code.

At GitHub Universe in November we announced the beta waitlist for the new code search and code view. Today we’re removing that waitlist. Now any user can access the new search and code viewing experience using this link, or via the feature preview menu. To access the feature preview menu, click your avatar at the top-right of a GitHub page and select Feature preview. Then select the beta and click the Enable button.

mockup screenshot of new code view and code search features

This beta brings three powerful new capabilities to GitHub.com. First, an entirely new search interface, allowing you to construct powerful queries with suggestions, completions, and the ability to slice and dice your results.

The second capability is our entirely new code search engine, capable of searching and even understanding code. It delivers more relevant results with incredible speed. Curious about how it works? Read about the groundbreaking technology behind the new code search in the GitHub blog earlier this month.

The third capability is a redesigned code view. The new view integrates search, browsing, and code navigation, allowing developers to rapidly traverse their code to find answers.

This is a big step forward for code search and navigation at GitHub, but we’re far from done. Check it out yourself, and share your feedback with us here.

 

See more

You can now view the content of a package with the updated code explorer directly on the npmjs.com portal. We have improved the reliability, performance and have now made this feature available for free. You no more need to download a package to view its content. With this feature, you can easily scrutinise packages to make sure it is safe for use in your application. The code explorer provides syntax highlighting for .js, .ts, .md, .json and other commonly used file types in npm packages. You can also view the content of any previous version of a package.

Start by exploring the npm package.

See more

GitHub's code navigation features jump to definition and find all references are now available for all Rust projects on GitHub.

When you view an Rust file on github.com, you can click on the name of a function, module, or macro to see its definition and its references within that repository. We use the tree-sitter library to find definitions and call sites in your code.

Learn more about code navigation for Rust and other languages in the GitHub documentation: Navigating code on GitHub.

Also, check out the tree-sitter library to learn how support for different languages is implemented.

See more

Cross-repo code navigation is now available for all Python repositories. When showing the definition of a function or method, we now include definitions from other repositories, and from the Python standard library.

Cross-repo code navigation is powered by the stack graphs framework and by the Dependency Graph. You can read about how we use stack graphs for code navigation and visit the stack-graphs repo to learn more. You can also read more about code navigation for Python and other languages in our documentation.

See more

Understanding code is one of the most important parts of software development. Developers need to be able to quickly search, navigate, and understand their code to do their best work. That’s why we have dramatically upgraded the code search and browsing experience on GitHub with an all-new code search and code view beta that we’re excited to announce today!

You can access the new features by joining the waitlist.

A better way to search code

We’ve developed a new code search engine at GitHub completely from scratch, capable of finding relevant results with incredible speed. The all-new code search engine supports powerful features, like regular expressions, Boolean expressions, qualifiers, symbol search, and more!

We’ve also totally redesigned the search input, adding powerful capabilities like suggestions and completions as you type.

Screenshot of our redesigned search input

And the new search results UI allows you to slice and dice your results.

Screenshot of the search results page

These improvements replace the 2021 technology preview for GitHub code search at cs.github.com.

The all-new code browsing experience

This is the revamped code viewing experience for GitHub repositories. This experience has several new features including a tree pane for browsing files, symbol search, fuzzy search for files, sticky code headers, and much more! We’ve designed this code viewing experience to provide a generational jump in code browsing and viewing on GitHub.

Screenshot of the redesigned code browser

Starting with the new tree pane on the left, you can explore repository folders and files without changing pages or losing context. You can also search files within the repository, making it easier than ever to find the right file.

Screenshot of left tree pane

Moving on to the right-side symbols pane, you can simply click on a symbol in code, such as a function name, to view its definition and references across files.

Screenshot of symbols pane

In addition to symbol navigation, we re-vamped find-in-file and bound it to CMD/CTRL+F to be even better than before.

Along with the overhauled code view, we updated the blame view. You can toggle the blame view from the code view to keep context and view a file’s history.

Lastly, we reworked the file editing experience! Now you can edit a file without losing context, and we’ve made it easy to open a file in github.dev or GitHub Desktop.

There are so many features that couldn’t be listed here and we can’t wait for you to discover them! Over the next weeks we’ll ship many improvements that focus on accessibility and integrating feedback from the community.

Join the beta waitlist

We are eager for you to try the new code search and code view beta! Join the waitlist to get access.

This project is a major update to GitHub’s user experience that was made possible by the feedback you provided. Help make the experience even better by sharing your latest feedback here.

See more

GitHub's code navigation features "jump to definition" and "find all references" are now available for all Elixir projects on GitHub.

When you view an Elixir file on github.com, you can click on the name of a function, module, or macro to see its definition and its references within that repository. We use the tree-sitter library to find definitions and call sites in your code.

Special thanks to @the-mikedavis and the tree-sitter-elixir team for contributing the queries that power this system.

Learn more about code navigation for Elixir and other languages in the GitHub documentation: Navigating code on GitHub.

Also, check out the tree-sitter library to learn how support for different languages is implemented.

See more