Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Storing Images and Demos in your Repo

Storing Images and Demos in your Repo

In this quick walkthough you'll learn how to create a separate branch in your repo to house your screenshots and demo gifs for use in your master's readme.

How to

1. Clone a fresh copy of your repo

In order to prevent any loss of work it is best to clone the repo in a separate location to complete this task.

2. Create a new branch

Create a new branch in your repo by using git checkout --orphan assets

This will create and switch you to a new branch called "assets". The --orphan flag creates a new branch but without any prior commits. However it does still keep the working tree and index.

3. Remove files from the working tree

git rm -rf .

THIS WILL DELETE ALL FILES THAT THE WORKING TREE RECOGNIZES Any files that were not added to the tree will remain left behind in the folder.

We remove all files from the working tree since we do not want anything but our screenshots and images in this branch.

You can also check what branch you are on anytime by using git branch. The branch with the * next to it is the current branch.

4. Add your images and screenshots and commit the change

git add screenshot.png demo.gif logo.png

git commit -m "Added Assets"

4. Finally push your changes

git push origin assets

Use the images in your README

You can now use ![Demo Animation](../assets/demo.gif?raw=true) in your README to have the gif display on your master's readme.

@vitutc

This comment has been minimized.

Copy link

commented Feb 22, 2018

Nice! Thank you for this!

@hdorgeval

This comment has been minimized.

Copy link

commented Jun 21, 2018

Thank you! works perfectly on my repo hdorgeval/stargate with a 40 Mb animated gif.

@NewEXE

This comment has been minimized.

Copy link

commented Jul 1, 2018

@hughesd22

This comment has been minimized.

Copy link

commented Oct 10, 2018

Fantastic! Just used this to include 12 animated GIFs in my repo's README ranging from 7MB - 95MB. (Note that max file size for GitHub is 100MB, so be careful not to exceed this or you won't be able to push to repo).

@omarichatman

This comment has been minimized.

Copy link

commented Jan 2, 2019

Just curious. Why do we need to clone the repo? Can we not just create a assests branch in the master and continue the steps?

@zemogle

This comment has been minimized.

Copy link

commented Jan 3, 2019

I think the clone in step 1 is so you have a backup copy in case something goes wrong in step 3 (where you remove all your files).

@lionants02

This comment has been minimized.

Copy link

commented Mar 10, 2019

Thank you very much.

@benjaminbutton13659

This comment has been minimized.

Copy link

commented Apr 21, 2019

For me the checkout --orphan asserts did not work on its own. I also had to use git branch assets afterwards, so the branch would be listed be the command git branch. After that change everything else worked fine. Great tutorial!

@Anaxilaus

This comment has been minimized.

Copy link

commented Jun 7, 2019

Benjamin,

checkout --orphan branchName doesn't create a new branch unless you commit, because branches i.e heads are just pointers which point at commit hashes and an orphan branch doesn't have any commits to start with.

@henngelm

This comment has been minimized.

Copy link

commented Sep 4, 2019

Perfect. thx!.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.