This blog presents all the steps that you need to create a nice GitHub profile. There are several steps that you need to do to create your GitHub profile.
As you can see this is my GitHub profile and you can see this is basically a readme displayed on my homepage. So all you need is to create this readme file in your repo!
Step 1. Create a new repository and name it with your GitHub username.
When you use your username as the repository name, a green area shows up and tells you that this is a special repo. Mine profile already exists, that is why it shows the red words.
Step 2. Create a README.md file in that repo.
This step is the most important. First, you need to collect and download some necessary icons and some programming language’s logos.
Step 3. Design your GitHub Repo!
Background Cover & Introduction
You can download an image for your background cover and commit this to your repo and add it to the top of your profile.
you can use it —  to embed your image to your readme.
If you want to embed text then you can use [the name of your project](the link of your project)
If would like to add some Emoji, you can visit this link and copy & paste the one you want to use.
## Introduction
- 🔭 I’m currently working on 🤖 [AI Chatbot Project](https://github.com/melanieshi0120/AI_Chatbot_Project)
- 🌱 I’m currently learning AWS and GCP
- ⚡ Fun fact: I am trilingual - fluent in English 🇺🇸, Chinese 🇨🇳, and Korean 🇰🇷
- 🏋️ Workout everyday!
- 🏅 Black belt Taekwondo athlete 15 years ago
The “Connect with me” part
As you can see that there are three different logos LinkedIn, Medium, and 1000hires. So you need to download those images and commit those to your special repo. Or you can simply use the images that I uploaded to my repo.
Then you can use this [<img align=”left” alt=”LinkedIn” width=”80" src=”https://github.com/melanieshi0120/melanieshi0120/blob/master/linkedin.ico" />](Your own LinkedIn) to link your own LinkedIn.
I added my LinkedIn, Medium, and 1000hires Video. You can use simply change the links in the ( ).
### Connect with me[<img align="left" alt="LinkedIn" width="80" src="https://github.com/melanieshi0120/melanieshi0120/blob/master/linkedin.ico" />]( http://www.linkedin.com/in/melanieseok-huashi)
[<img align="left" alt="Medium" width="80" src="https://github.com/melanieshi0120/melanieshi0120/blob/master/medium.ico" />](https://melaniesoek0120.medium.com)
[<img align="left" alt="1000hires" width="80" src="https://github.com/melanieshi0120/melanieshi0120/blob/master/1000hires.ico" />](https://1000hires.com/candidates/466)
<br />
Languages and Tools
In this part, I also used a similar method to embed images and to list the programming languages and tools.
For the first nine (9), you can use this <img align=” left” alt=” Python” width=”26px” src=”https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/python/python.png" /> to embed the icons and directly use from open sources.
For the last four (4), I uploaded the icons to my repo and use the link of the icons to embed them.
### Languages and Tools<img align="left" alt="Python" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/python/python.png" />
<img align="left" alt="R" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/r/r.png" />
<img align="left" alt="Docker" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/docker/docker.png" />
<img align="left" alt="SQL" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/sql/sql.png" />
<img align="left" alt="MySQL" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/mysql/mysql.png" />
<img align="left" alt="Visual Studio Code" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/visual-studio-code/visual-studio-code.png" />
<img align="left" alt="Git" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/git/git.png" />
<img align="left" alt="GitHub" width="26px" src="https://raw.githubusercontent.com/github/explore/78df643247d429f6cc873026c0622819ad797942/topics/github/github.png" />
<img align="left" alt="Terminal" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/terminal/terminal.png" /><img align="left" alt="GCP" width="80" src="https://github.com/melanieshi0120/melanieshi0120/blob/master/images/GCP_LOG.png" />
<img align="left" alt="AWS" width="50" src="https://github.com/melanieshi0120/melanieshi0120/blob/master/images/AWS.jpeg" />
<img align="left" alt="google_analytics" width="70" src="https://github.com/melanieshi0120/melanieshi0120/blob/master/images/google_analytics.jpg" />
<img align="left" alt="google_data_studio" width="70" src="https://github.com/melanieshi0120/melanieshi0120/blob/master/images/google_data_studio.png" />
<img align="left" alt="tableau" width="70" src="https://github.com/melanieshi0120/melanieshi0120/blob/master/images/tableau.jpg" /><br />
<br />
If you are a software Engineer or Front-end Developer, you may need to show other languages and tools such as CSS3, HTML, SASS, JavaScript, React, etc.
You can just simply copy and paste the code as follows-
<img align="left" alt="Visual Studio Code" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/visual-studio-code/visual-studio-code.png" /><img align="left" alt="HTML5" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/html/html.png" /><img align="left" alt="CSS3" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/css/css.png" /><img align="left" alt="Sass" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/sass/sass.png" /><img align="left" alt="JavaScript" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/javascript/javascript.png" /><img align="left" alt="React" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/react/react.png" /><img align="left" alt="Gatsby" width="26px" src="https://raw.githubusercontent.com/github/explore/e94815998e4e0713912fed477a1f346ec04c3da2/topics/gatsby/gatsby.png" /><img align="left" alt="GraphQL" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/graphql/graphql.png" /><img align="left" alt="Node.js" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/nodejs/nodejs.png" /><img align="left" alt="Deno" width="26px" src="https://raw.githubusercontent.com/github/explore/361e2821e2dea67711cde99c9c40ed357061cf27/topics/deno/deno.png" /><img align="left" alt="SQL" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/sql/sql.png" /><img align="left" alt="MySQL" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/mysql/mysql.png" /><img align="left" alt="MongoDB" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/mongodb/mongodb.png" /><img align="left" alt="Git" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/git/git.png" /><img align="left" alt="GitHub" width="26px" src="https://raw.githubusercontent.com/github/explore/78df643247d429f6cc873026c0622819ad797942/topics/github/github.png" /><img align="left" alt="Terminal" width="26px" src="https://raw.githubusercontent.com/github/explore/80688e429a7d4ef2fca1e82350fe8e3517d3494d/topics/terminal/terminal.png" /><br />
<br />
If you change it to preview mode, you can see as follows:
Github Status
There are so many options that you can use to show your GitHub status. You can simply visit this link. There are different themes that you can choose. Here I just copy and paste the code below into my markdown content and that is it!
[](https://github.com/melanieshi0120/github-readme-stats)
If you want to use different themes and more fancy designs, you can simply copy the code below and change the username and select the theme you like!
