How to embed GitHub repositories on my website?

I am working on a website and I would like to display/embed a repository from my GitHub onto my website.

I have tried using Repo.js. However, I’m not sure whether I’m using it correctly or not. The problem I am having with Repo.js is that my repository from GitHub does not load and is not being displayed on my website. I have looked at other stackoverflow questions such as “how to use repo.js” but it still did not help me.

I have heard of Gists and other similar “stuff”(sorry I don’t know the correct term). But those are mainly for embedding codes.

I have heard of the GitHub API to retrieve information of GitHub repositories but I’m still trying to find an alternative solution such as Repo.js or something similar to it.

First, open your browser developer console, and check the error message.

For instance, if you see "Cannot read property 'length' of undefined" (as in darcyclarke/Repo.js issue 45), that means:

Since the default branch is no longer master, you should add branch: "main":

<script>
    $(function() {
        $('#id').repo({
            user: 'user',
            name: 'repo-name',
            branch: 'main',
        });
    });
</script>