Devcover - Easiest way to generate a developer portfolio
Tags: productivity, portfolio, react, nextjs
Published: 2021-03-08 14:22:09

Building a developer portfolio can be a difficult task, we have to think of a good design, show our best projects, our last posts blogs, talk about ourselves, offer contact details and then write the code, but at least in my case, this was very complicated to do because I didn't have enough time to dedicate it or I simply had other side projects that I was working on, leaving aside the creation of my portfolio. That is why I decided to create a tool that does all this for you with just your [Github](https://github.com) username.

[Github Repository](https://github.com/jrgarciadev/dev-cover) 

[Product Hunt Launch](https://www.producthunt.com/posts/devcover)


## Inspiration

I was thinking about how I could help the developer community, so the first thing I did was explore my experience as a developer and make a list of projects that could save me time. One of the items on the list was my portfolio, It was there when I realized that as developers we have what it takes to build a portfolio with just our **username** since we have enough information on platforms like [Github](https://github.com), [Hashnode](https://hashnode.com) and [Devto](https://dev.to) to show our projects, talk about us, show our latest blogs and offer contact details. But I had a problem, how do I get developers to publish their portfolios in their own domains? One word  [Vercel](https://vercel.com) 

## Video Demo

{% vimeo 508521951 %}

## Features

Creating your portfolio with [Devcover](https://www.producthunt.com/posts/devcover), you are going to get:

- Good designed and customizable portfolio
- Google Analytics support to track user events
- SEO friendly implemented with your data
- Mobile friendly portfolio
- High-performance portfolio
- Your latest [Devto](https://dev.to) and [Hashnode](https://hashnode.com) blogs sorted by reactions count and publish date
- Your best [Github](https://github.com) projects sorted by stars count and forks count
- About section from your  [Github](https://github.com) **README.md**
- Possibility of placing your email so that they contact you
- Availability to be hired
- Fully customizable
- Preview Mode
- And much more...


## Next features
- Edit and add new social networks to contact
- API for fetching developer data
- Add theme templates
- Time to re-fetch data ex: every day at 24hrs

If you want to know more about project implementations and how works it here the repository:

[Devcover Repository](https://github.com/jrgarciadev/dev-cover)

Is open to receive contributions   🙋‍♂️


## Usage Process
Create your portfolio with [Devcover](https://www.producthunt.com/posts/devcover) is quite straightforward. In just a few clicks you can deploy your own portfolio.

1 . First we have to open [Devcover](https://www.producthunt.com/posts/devcover) website and write our Hasnode or Github username, press **Enter** or the submit button and wait while generating your portfolio it takes not much than 1-2 minutes

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1612487987868/n4ay2GoE8.png)

2 . If you want to customize your portfolio you can press the edit/delete button for the portfolio's sections also open the customizer and change your name, email, your preferred colour, your page title even you can set your Google Analytics code to see users behaviour on your portfolio, I created a set of events to track as that social network link clicked, scroll events, **Show More** button clicked and blog or project clicked.

![Screenshot_2021-02-04 Junior García Web Mobile Developer.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1612488615333/RkSCakiCX.png)

3 . The when you are ready, just click on **Deploy on Vercel** button

![Screenshot_2021-02-04 Junior García Web Mobile Developer(1).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1612488889182/628KRNq-y.png)

4 . You will see a screen like this, write the name of your project that you prefer (I assumed that you already have a Vercel account, but if you don't you can create one [here](https://vercel.com/))

![Screen Shot 2021-02-04 at 22.35.57.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1612488961676/DjnT8TBa4.png)


5 . Then choose your preferred Git provider to save your portfolio project, basically what this does is clone the [Decover](https://github.com/jrgarciadev/dev-cover) and save it into your Git provider as a new project.

![Screen Shot 2021-02-04 at 22.43.22.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1612489406934/eG4GymTA5.png)

6 . Choose a project name or leave the default name
![Screen Shot 2021-02-04 at 22.43.59.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1612489446033/aAKE5aKVe.png)

7 . Then you must put your Github username in the **NEXT_PUBLIC_USERNAME** value

![Screen Shot 2021-02-04 at 22.45.39.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1612489774100/M6IXQfyuS.png)

and VOILA! you have your portfolio deployed on your own domain 🥳🥳

![Screen Shot 2021-02-04 at 22.49.43.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1612489954847/c4ye5geUE.png)


## Deploy your own Portfolio on Vercel

If you want to customize your portfolio colours, name, bio a put your Google Analytics code, I suggest you create your portfolio from [Devcover](https://www.producthunt.com/posts/devcover) website.

If you prefer to go faster and accept the default parameters you can click on the following button and the only thing you have to do is put your [Github](https://github.com) username in the **NEXT_PUBLIC_USERNAME**.

[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https%3A%2F%2Fgithub.com%2Fjrgarciadev%2Fdev-cover&env=NEXT_PUBLIC_USERNAME&project-name=my-awesome-portfolio&repository-name=my-awesome-portfolio&envDescription=&envDescription=Enter%20your%20Github%20or%20Hashnode%20username%20.&demo-title=APM%20Story&A%20statically%20generated%portfolio%created%20using%20Devcover)


Feel free to ask in the comments or mentions me on my [Twitter](https://twitter.com/jrgarciadev).

#### I hope this helps you and I would like to see your portfolio results! 👋