DEV Community

Michael Willian Santos
Michael Willian Santos

Posted on

How I Built My Portfolio

Hello, everyone :)
Link: Github
Site: Website


I have been using Next.js for a while. And my portfolio on Github was very outdated. For this motive, I have creating a new other using Next.JS. By far the most annoying thing to resolve was the problem of exporting the application to work with the Github Pages. There are not that many of tutorial or example, that explains in a clear way.

Then, if you guys want to, check out the source code of the website :)


Features

Things that I was seeking on have in my portfolio:

  • Clear and simple
  • Shows up my project that I have on Behance
  • Shows up the projects on my Github
  • Be the host of some project's documentation

Behance

I don't want to have any time that I publish a new project on Behance, go on my portfolio then edit some sort of file or anything like this to display the info of this project.

Then, I have use the Puppeteer to scrape my projects on Behance, grab the pictures and some statics, and generate a json file.

With the Github Actions, I will automate this process using some sort of CRON time.


Github

Using the Github's API, I could get my project list that it's mine (not forked).
I have created some sort of 'To-Do' for this website, in which is getting the list of open issues from the Github repo. and displaying on Website.


Github Project's Documentation

Every project of mine that have on his description from the Github repository, the keyword '#docs'. It will be available on Website to see the documentation.
With the Github's API, I can went into this repositories, look at if it haves a folder named 'docs', then it will render on the website, using React Markdown.


Well, for while is it :)

Top comments (2)

Collapse
 
dance2die profile image
Sung M. Kim

Looks pleasing, Michael.

Material theme by chance?

Collapse
 
daxsoft profile image
Michael Willian Santos

Yes, it is :)