DEV Community

Cover image for Quick Tips & Resources To Improve Your Github ReadMe

Quick Tips & Resources To Improve Your Github ReadMe

Michael Gee on August 26, 2020

Unless you have been living under a rock for the past few months, you are probably aware that Github has a cool new feature where you can create a ...
Collapse
 
pablohs1986 profile image
Pablo Herrero • Edited

Nice tips!!! Here's mine, that I've improved with tips as great as yours from DEV:

github.com/pablohs1986

Collapse
 
michaelgee profile image
Michael Gee

Awesome! Very in-depth and visual like Wali's (the other person who commented on this post). I definitely have some catching up to do improving mine as I go.

Quick Note: I see you tried to use the nbsp; spacing in your README but doesn't show spaces. I believe this is because in mine I combine both nbsp; and actual spaces to give the spacing result.

" nbsp; "

Give that a try and let me know how it works!

Collapse
 
pablohs1986 profile image
Pablo Herrero • Edited

Heyyy, thanks for the advice, but I don’t understand... with one nbsp I show one space, that is what I want like you can see in this screenshot:
phNbsp

Where is the error???

Thread Thread
 
michaelgee profile image
Michael Gee

hmm I see. Maybe we are seeing slightly different results from different screens.

I am viewing from Chrome on a laptop.

Thread Thread
 
pablohs1986 profile image
Pablo Herrero • Edited

I don't know what's happening, man 🤔 I've checked it on a mobile phone, a tablet and a laptop with Chrome, Safari and Firefox (24" and 15") and I always see the spaces...

Here's an example to see the difference between putting an nbsp and not putting it:

spaces

Collapse
 
saberglow profile image
Wali Ullah

Awesome guide... i built mine a couple weeks ago.. check it out:
github.com/SABERGLOW

Collapse
 
deveshlashkari profile image
Devesh Lashkari

Looks clean! Any website to create that banner gif?

Collapse
 
saberglow profile image
Wali Ullah • Edited

hmm i don't think so, but here's what you can do:
1) Check my Pen on CodePen (and edit the name as you see fit)
2) Screen-record it, and make a gif.

Link to the pen: codepen.io/saberglow/details/xxVwodW

works best in "full page view"

Collapse
 
michaelgee profile image
Michael Gee

Looks great! Especially the animated images, did you create those yourself?

Collapse
 
saberglow profile image
Wali Ullah

only the title banner... the second one was taken from giphy and resized a bit

Collapse
 
thinkverse profile image
Kim Hallberg

Ooh, that spaces trick, thank you. 👍

Collapse
 
michaelgee profile image
Michael Gee

Was definitely a small pet peeve seeing that over and over again and was the initial reason why I created this post in the first place.

Hopefully, people scroll down to the end and see it 😄

Collapse
 
deveshlashkari profile image
Devesh Lashkari

Loved it. Have a look at mine :

github.com/deveshlashkari

Collapse
 
michaelgee profile image
Michael Gee

Looks great! 2020 goals are very relatable I'm right there with you.

If you'd want some feedback, you can save a lot of vertical space on your Profile by just having 2 sections for your tech stack (some of the sections only have 1 icon in them)

Tech Stack:
Icon, Icon, Icon... etc

Currently Learning:
Icon, Icon, Icons... etc

Just my opinion but let me know what you think!

Collapse
 
deveshlashkari profile image
Devesh Lashkari

Thanks for the feedback. I will surely work on them :)