Having a portfolio is important, there is no better proof of one's ability than actual evidence of their work. A quick glance at that your portfolio can tell a lot about you.
My web-page was viewed 90% of the time when added as part of my resume, so there is clear potential to make a good first impression.
Why GitHub Pages?
A big plus is that the cost of hosting is a whopping £0!!! Also, the nicely readable domain github.io helps recruiters input that address. (Provided you don't have an obscure GitHub username that becomes the sub-domain).
I also felt that having just GitHub repositories as a portfolio, with its simple design, would not help me to stand out to potential employers or, at the very least, get the attention of recruitment agencies.
Other solutions would offer me the design flexibility but at the same time a lot of functionality I did not need.
Creating a full blown web-page felt like an overkill. Even though I created a CMS solely for this purpose, by the time I was half-done with it I grew demotivated in continuing.
I thought of using GitHub pages for this - it issues a sub-domain for each user, making it feel more professional, however, their templates felt too bleak and did not really fit my use case.
I needed a one-stop solution that would include all of my social media and dynamically link to a blog and projects.
How can it be done?
In the age of API it is quite easy to make use of things, really avoiding the need of a powerful backend of your own (provided we do not need authentication).
There is no need to re-invent the wheel, Dev.to offers a straight forward API for getting all the articles of a user. A call to https://dev.to/api/articles?username=equalcoding gives all the information necessary to reference and link user's articles at Dev.to
GitHub offers similar functionality for repositories on this endpoint https://api.github.com/users/equalcoding/repos
Just with these two API calls above we have the potential to create a simple landing page for a portfolio that will include a blog and a reference to the resources at GitHub and Dev.to.
GitHub Pages uses Jekyll that allows to create static pages. By using some JavaScript to make http calls these pages can become somewhat dynamic.
How can you do it?
Create a new git repository with your username prepended to .github.io, e.g., equalcoding.github.io. This will generate the page at that exact URL.
After creating a new git repository, if you go to settings you will find a section about GitHub Pages, where you will be able to create your GitHub page.
When creating GitHub Pages GitHub will ask you to choose a template and, once that is done, it will generate an index.md file. This file can be replaced with a index.html file if you wish to use html in your project (you will have to if you want to make the API calls).
This can be used as the basis for the page, from here you can implement your own css or js, or even external .css and .js libraries.
In my project @ equalcoding.github.io (repo) API queries to Dev.to and GitHub are used to display blog posts and GitHub repositories. Every time I add anything to Dev.to, it will automatically be displayed in the web-page and the same will happen when creating a new GitHub repository.
You are more than welcome to clone or fork my project - there is configuration in the main.js file that allows you to point everything to your own accounts. The instructions with configuration description can be found at the bottom of the repository page.
My page is made to be very minimalist and simple, as that appeals to me and I believe that it works best for 'quick glance' situations. However, there are many other templates available for every taste at https://jamstackthemes.dev/ssg/jekyll/. Some also include links to their git repos. Or have a shot at making your own - here is a good resource on how to get Jekyll running locally to get you started with the development.
Top comments (0)