You are signed in. Close

You are signed out. Close

Thank you. Your subscription has started. Close

Thank you. You will get an email when a new comic comes out. Close

We could not confirm your payment. If you paid, use the link "Sign in" at the bottom of the page. Close

Something went wrong on our side. Please try again in a moment. Close

Previous episode Git commit: how a snapshot of the whole project takes so little space

How Git keeps every version of your project without filling your disk

The Git staging area: why you pick before you commit

Git makes you type git add before every commit, and it is not a wasted step: it lets one commit keep the work that is ready and leave the half-done rest out.

  1. 1 Today your folder holds two changes: the score fix in game.js is ready, and the night sky you started in index.html is half done. You want to keep the fix and leave the sky out.youKeep the fix,not the sky!frog-gameindex.htmlhalf skygame.jsscore fixfrog.png

    Today your folder holds two changes: the score fix in game.js is ready, and the night sky you started in index.html is half done. You want to keep the fix and leave the sky out.

  2. 2 Here is the trick: a commit is not taken from your folder. Between the folder and the repository, Git keeps the staging area, which holds the next snapshot file by file, and a commit takes exactly what is there.frog-gameindex.htmlgame.jsfrog.pngstaging areaindex.htmlgame.jsfrog.pnggit addrepositorygit commit

    Here is the trick: a commit is not taken from your folder. Between the folder and the repository, Git keeps the staging area, which holds the next snapshot file by file, and a commit takes exactly what is there.

  3. 3 So you run git add on game.js alone, and the new game.js is copied into the staging area. The index.html there is still the one from the last commit, with no sky.frog-gameindex.htmlhalf skygame.jsscore fixfrog.pngstaging areaindex.htmlno skygame.jsscore fixfrog.pnggit add

    So you run git add on game.js alone, and the new game.js is copied into the staging area. The index.html there is still the one from the last commit, with no sky.

  4. 4 Then git commit takes the staging area as it is: the score fix goes in, and the half-made sky stays in your folder, still yours to finish.frog-gameindex.htmlhalf skygame.jsscore fixfrog.pngstaging areaindex.htmlno skygame.jsscore fixfrog.pngrepositorygit commitFix the scorescore fix,no sky

    Then git commit takes the staging area as it is: the score fix goes in, and the half-made sky stays in your folder, still yours to finish.

  5. 5 Commit after commit, you pick what goes in. Five commits wait in the repository now, and so far nothing you have seen tells Git which one came first.repositoryFirst riverHigher jumpsMoving logsSound onFix the score?

    Commit after commit, you pick what goes in. Five commits wait in the repository now, and so far nothing you have seen tells Git which one came first.

  6. Quick check

    You change a file and run git add. Then you change the same file again, and you commit.Which versionof the file doesthe commit keep?

    You change a file and run git add. Then you change the same file again, and you commit.

    Show the answer

    The one from git add. The staging area holds the file as it was when you added it, and the later change stays in your folder until you add it again.

  7. Go further

    The real names around the staging area.indexGit's other namefor the staging areagit statusshows which changes arein the staging area, andwhich are only inyour folder

    The real names around the staging area.

Next episode Git history: how each commit remembers the one before

Share this comic

More comics