Understand working of Online VS code for github repos.

I am always surprised to see how modifying the link from "github" to "github1s" or "github.dev" allows me to view a repository in Visual Studio Code style. As a beginner web developer, I am always on the lookout for projects that can enhance my skills and knowledge. After some research and guidance from experienced professionals, I was able to understand how this feature works.

source: https://www.asme.org/topics-resources/content/the-engineering-behind-brain-research

First, the GitHub API plays a key role in allowing access to repository contents. The API provides access to publicly available repositories, and you can use it to retrieve the contents of a repository by making a GET request to the /contents endpoint. The response will include a list of objects representing the files and folders in the repository, along with their URLs, content, and encoding information. The content of each file is usually base64-encoded, so you will need to decode it using a function like atob() in order to access the raw data.

To display the contents of a repository in a Visual Studio Code-style code editor, you can use the Visual Studio Code APIs and JavaScript library. The APIs allow you to create custom editors that can interact with the underlying resource and provide features like syntax highlighting. You can find more information and examples on how to use the APIs in the documentation linked above.

This is just a basic overview of how this feature works. To implement it in your own project, you will need to delve deeper into the details and explore the available APIs and functions.

I think you like it:
Resources that might help you :
https://docs.github.com/en/rest/repos/contents?apiVersion=2022-11-28

https://microsoft.github.io/monaco-editor/

https://code.visualstudio.com/api/extension-guides/custom-editors#:~:text=Custom%20Editor%20API%20basics,interact%20with%20the%20underlying%20resource.