Update your GitHub profile
Tags: github, profile, howto, career
Published: 2022-11-22 13:30:36

As the developer community is growing, developers are connecting and collaboratively contributing to open-source projects. GitHub is a place where these projects are maintained.

With this, GitHub also provides a **profile README** feature, where you can showcase your work, interests, contributions, and other pieces of information on the GitHub profile page. It allows you to be as creative as you want to be, fun and interactive or keep it minimal, as they say '_sometimes less is more_' 🎨.

---

We are all familiar with the GitHub README markdown files. This file describes or helps in understanding the project. Similarly, we can have one for our profile to share a little bit of information about ourselves with the community.


![GitHub Profile Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u3agkih826hxym16bm00.png)
<figcaption>GitHub profile page after adding README file</figcaption>
---


####To get started, 

➡️ Create a _repository with your GitHub **username**_ _(assuming you have a GitHub [account](https://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=&cad=rja&uact=8&ved=2ahUKEwjiz_y8vL37AhVa2HMBHXEADy4QFnoECA4QAQ&url=https%3A%2F%2Fgithub.com%2Fsignup&usg=AOvVaw0a6qEmIZVdziwPUb-hFApr))_

![Repo name should be same as your GitHub username](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/11q13di0qst8v6x00thq.png)
<figcaption>Name the repository same as your GitHub username</figcaption>
<br></br>
➡️ Don't miss out to _initialize a README file_ and make it a _public repository_ (this file should be placed in the root folder). GitHub renders this README at the top of your profile page.
![Initialize repo with README file](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z7zafznl94s36em3t69t.png)
<figcaption>Make a public repository with a README file</figcaption>
<br></br>
➡️ Once you create this repository, you have a _README.md file ready with a basic template_ that GitHub provides you to start with. You can now go to your GitHub profile page (https://github.com/[userName]) to see the changes. Congratulations🎉! you just created a GitHub Profile for yourself👏

---

You can go ahead and start editing the README.md file that you just created and add your contents to it. To format the file, make use of GitHub's _Flavored Markdown_ or use HTML in this Markdown file. You can also add **images**, **emojis**, and **GIFs**, list out recent **blogs**, gitHub **stats**, **links** to connect, interactive UIs and many more to this file. You can preview the changes before committing. Once the commit is made, the changes reflect on your GitHub profile page.


_**Some useful links**_,
📝 Markdown syntax and formatting, [quick start](https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/quickstart-for-writing-on-github), [basic writing](https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax)


📈 Commonly used Endpoints for GitHub stats, 
- Use `![Github stats](https://github-readme-stats.vercel.app/api?username=[userName]&theme=gotham)` to display your GitHub account overview. 
- Use `![Top Langs](https://github-readme-stats.vercel.app/api/top-langs/?username=[userName]&layout=compact)` to list the most frequently used languages.


You can modify your stats with various query parameters available, check out [this repo](https://github.com/anuraghazra/github-readme-stats) by @anuraghazra for more details on customising UI and layouts.

![github top lang stats](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wshznzvj07l5hdv8t6rn.png)<figcaption>GitHub stats for frequency used languages</figcaption>



😇 To add emojis, check this [emoji-cheat-sheet](https://www.webfx.com/tools/emoji-cheat-sheet/) for all the codes available.<br></br>


🏞 Find any relatable GIFs from [Giphy](https://giphy.com/)<br></br>


📸 You can add images just by dragging and dropping them, or by pasting them directly into the editor which GitHub transforms. You can also use `HTML` tags to display images and specify width and height to adjust. <br></br>


🌓 Based on themes you can specify different images for light and dark modes with `picture` element and `prefers-color-scheme` media feature. <br></br>

👩‍💻 To add social media links or to list the skills, check out this [shields website](https://shields.io/). This allows customisation of badges with styles and logos of your choice.

> Example, `<img src="https://img.shields.io/badge/HTML5-red?style=for-the-badge&logo=html5&logoColor=white" alt="html5 Badge"/>`, check the image below to see how the list looks like,

![Social logos](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/oi2tjsnoenz90womaxu0.png)
<figcaption>List of skills added using Shields.io</figcaption><br></br>

🪄 Display Followers counts and other data using Shields with [social](https://shields.io/category/social) like `https://img.shields.io/github/followers/[userName]?style=social` <br></br>

🗂 You can also add a section to list out recent blog posts from any blogging platform to this file, add interactive sections like games by writing scripts with _GitHub Workflow and Actions_.<br></br>

💻 Need more options, check [devicon](https://devicon.dev/) for icons representing programming languages, designing, and development tools.<br></br>

✨ Customize your profile with any theme of your choice or keep it simple. Check out this repo from @abhisheknaiidu -  [awesome-github-profile-readme](https://github.com/abhisheknaiidu/awesome-github-profile-readme)<br></br>

> We cannot add any `CSS` or `js` with `<style>` or `<script>` tags in this Markdown README file.

I would be happy to see some helpful tips or your creative GitHub profiles in the comments below😇, [here's mine](https://github.com/ApoorvaCG). Thanks for reading!