Displaying contributors on footer of homepage

[DNA5769]

Fixes #9

I first created a separate section for Contributors near the footer

<!-- Contributors -->
<section class="page-section bg-light" id="contributors">
    <div class="container">
        <div class="text-center">
            <h2 class="section-heading text-uppercase">Contributors</h2>
        </div>
        <div class="row flex mt-5">
            <div class="col-12 text-center contributors__contributor-list">
                <h3 class="section-subheading text-muted contributors__error-message">List of contributors in currently unavailable. Please refresh after some time to view them.</h3>
            </div>
        </div>
    </div>
</section>

I then wrote JS code for getting contributors from Github API and then displayed them in the frontend

<script>
    // Code to populate contributors
    document.addEventListener("DOMContentLoaded", () => {
        fetch('https://api.github.com/repos/ContriHUB/Sheher/contributors?per_page=100')
            .then(res => res.json())
            .then(data => {
                if (Object.prototype.toString.call(data) === '[object Array]')
                {
                    for (let i = 0; i < data.length; ++i)
                        document.querySelector('.contributors__contributor-list').innerHTML += `<a href="${data[i].html_url}" target="_blank"><img class="contributors__contributor--image" src="${data[i].avatar_url}"></a>`;
                }
                else // Handling API Call Limit Exceeded error
                    document.querySelector('.contributors__error-message').style.display = "block";
            })
            .catch(err => { // Handling other errors
                document.querySelector('.contributors__error-message').style.display = "block";
            });
    });
</script>

[CyrilMishra]

Add this to your comment for the fixes, fixes # replace with the issue no like for this it is 9.

[DNA5769]

Add this to your comment for the fixes, fixes # replace with the issue no like for this it is 9.

Done Sir

[DNA5769]

Sir I have changed my logic a bit.

Previously I hit the Github API from the server and used server-side rendering to render the contributors.

However while testing I realised that the API has a very low rate limit, so since the call is being made by the server, the list of contributors won't be accessable for most users.

So that's why I decided it would be better to call the API and render from the frontend, so that the API rate limit won't be much of an issue.