Coder Social home page Coder Social logo

pcottle / learngitbranching Goto Github PK

View Code? Open in Web Editor NEW
29.7K 29.7K 5.7K 30.36 MB

An interactive git visualization and tutorial. Aspiring students of git can use this app to educate and challenge themselves towards mastery of git!

Home Page: https://pcottle.github.io/learnGitBranching/

License: MIT License

JavaScript 98.34% CSS 1.03% HTML 0.57% Shell 0.01% Dockerfile 0.01% Makefile 0.04%

learngitbranching's People

Contributors

0xk3rn3lp4n1c avatar ahonorat avatar alexandear avatar alexeiberkov avatar aschrab avatar bcbcarl avatar birdalicious avatar casillas-m avatar coyl avatar dependabot[bot] avatar donkirkby avatar eatdrinksleepcode avatar flyingbot91 avatar hong4rc avatar juhokang avatar krzysiekwie avatar lroellin avatar maxoliverbr avatar nlehuby avatar olsza avatar panaeon avatar pcottle avatar shardanasoft avatar spatrol avatar sunshowers avatar twmht avatar ulyssear avatar vinothmdev avatar waldyrious avatar yoursenseicreeper avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

learngitbranching's Issues

Rebase level 2's solution uses commands not previously discussed

The level "Branch Spaghetti" has a solution that uses interactive rebase, a mode not discussed in the lessons up to that point. A newcomer to git will be absolutely unable to solve that level. (And even experienced git users will be unable to solve it... interactive rebase is just not used very often.)

Not working in Opera (12.14.1738/x64)

I was just pointed to this awesome project by a friend. Sadly, it does not work in Opera (12.14.1738/x64).

More specifically, it does not come up with the introductory windows that one gets in other browsers. No clues as to the cause - it just seems to hang on the "help" command.
It was subsequently a bit annoying to discover that Firefox doesn't work either, nor does IE.

Thank you for the anticipated resolution.

'edit dialog' cannot test individual dialogs nor the entire view

Windows 7 - Chrome Windows 7, Chrome 24.0.1312.57 m

To reproduce:

  • build level
  • edit dialog
  • Add a ModalAlert with anything, click confirm.
  • Click 'Test' on the newly created view. Nothing happens, error in console
  • Click 'Test Entire View'. Nothing happens, error in console

Both 'Test' buttons yield "Uncaught TypeError: undefined is not a function" in error console

intro6.

Page with "git revert HEAD".
After click the "git revert HEAD" button on the image we are look C2'( C1' needed )

Typo in level intro 5

Part of the help text for the level intro 5 is "With resetting, you can push out your changes to share with others."

Shouldn't that be "With reverting, you can push out your changes to share with others."?

Command with incorrect params is counted for final number of steps

intro5
type the following:
git reset HEAD~1
git checkout pushed
git revert (fails with error)
git revert HEAD

But in the "end screen" you'll get the message that you used 4 commands "You solved the level in 4 command(s); our solution uses 3."

What is interesting that if you use incorrect command name like "git checkout11 pushed" it fails with error but isn't counted.

Internationalization

Kudos for the great app !

I'd like to translate it to French. Could you tell me how you'd like me to do it ? (markdowns could be a map of intl_id → vectors with current vector strings for "en_US", but what about the rest of the app ?)

Cheers,

B.

Firefox 19.0 - CSS Problem

There is a big problem with the CSS in Firefox 19.0 (Mac)

As you can see in the screenshot everything is mixed up.
Screen Shot 2013-02-22 at 12 16 28

I am not that good of an CSS Developer, otherwise I would help.

Bug in level rebasing1

Just typing

git reset another

in the master branch wil instantly 'solve' the problem, without getting the same tree as the target.

This doesn't seem to be a valid solution.

Git does not store deltas.

Git stores snapshots, not deltas. If a file has changed twice, there will be two copies of it in the repository.

However, Git does re-use files that haven't changed between commits, keeping repositories small.

With this in mind, your intro is lying to people.

Show a command documentation alongside the console text

It would be great to have a "documentation" feature that would give a brief overview of the results of each command (eg. a popup window with trees that shows what git rebase master bug_fix would do) or git help rebase could show a little window with the illustration.

Simpler solution to Juggling Commits 2 not recognized

This 3-command sequence achieves the desired outcome

git rebase newImage master # checkout and fast-forward master
git commit --amend
git cherry-pick caption

This 4-command sequence also achieves the same thing

git checkout master
git reset --hard newImage
git commit --amend
git cherry-pick caption

Neither of the above are recognized. The expected solution seems to be

git checkout master
git cherry-pick newImage # identical except for the date
git commit --amend
git cherry-pick caption

although this also works

git rebase newImage master
git commit --amend
git commit --amend  # yes, twice
git cherry-pick caption

Typo in intro5

"That's because this new commit C1' introduces changes -- it just happens to introduce changes that exactly reverses the commit of C1."

Should be C2' and C2.

intro5 state problems when moving back & forth in hint

First off, nice project! Very fun to play around with.

I was able to create some minor problems in Chrome with the introduction to intro5. Others levels may be susceptible to the same issue. The issue is going back and forward, causing the the graphs to no longer line up with the descriptions:

1.) Click "git reset head~1"
2.) Click next
3.) Click back

both the reset and revert panels are all missing a commit, and no longer line up with the commits mentioned in the text.

i18n support

Is possible to translate learnGitBranching into other language? Because some beginner may not good at English.

Thanks for your great job!

Restart level with new command-count/undo does not reset command count

I just discovered the "undo" command, but it does not reset the command-count but restarts the level.

There should be a way to restart a level (without showing the level-hint) from the commandline and resetting the counter.

EDIT: Ooops seems to be my mistake. Now it did.
But the desire for a "full reset/undo" is still there.

git checkout <ref> -b <name>

This correctly branches from C0:
git checkout -b test C0

This always branches from HEAD:
git checkout C0 -b test

Scroll bar in command window doesn't work in Chromium

I'm currently running Version 26.0.1404.0 (180391) of Chromium. In the command window, after you have entered enough commands a scroll bar will appear. I am unable to interact with the scroll bar and the mouse scroll wheel doesn't scroll the window either.

image

Typos in level dialogs

I noticed a couple of typos as I was going through the levels. I'll post a pull request with the details.
Thanks for the cool tutorial.

User misspeling commands contributes to total

When either a branch name or a command is misspelt, it contributes towards the total. This is quite annoying because the message about whittling down the number of commands still shows up despite the number of valid commands entered being on par with the solution.

Extra space in entered command

I tried to delete my branch bugfix

$git branch -D bugfix

but after pressing enter, I got following message at terminal ( extra space between bugfix with error message)

$git branch -D bug fix unknown ref bug

Problem with cherry-pick level mixed1

Hello, I have a problem with using cherry-pick (ignore if my solution is wrong), but when I do cherry-pick in this level, it "freezes", not sure if it's a problem with chrome tho.

Google Chrome: Version 25.0.1364.97 m

As you can see from the image, the second command does not run due to the cherry-pick being stuck

Learn Git Branching

Console:

Should be empty:
Array[1]
0: TypeError
message: "Cannot call method 'highlightTo' of undefined"
stack: "TypeError: Cannot call method 'highlightTo' of undefined↵From previous event:↵"
proto: Error
length: 1
proto: Array[0]
bundle.min.eac15d86.js:1
Uncaught TypeError: Cannot call method 'highlightTo' of undefined bundle.min.eac15d86.js:1

failure to represent genuine use

I've worked through the tutorials a little, as far as the rebase one. I'm entirely new to git having only used it previously to download an entire codebase (or two) and most recently - 2 weeks ago - started using it via a Netbeans plugin.

The problem I'm having is understanding what the processes are doing to the code that one is trying to version - the tutorial appears to miss out the fact that one is operating on a codebase and the point is to provide versioning on that codebase (I assume).

For example in the first lesson one performs 2 commits, OK. But what happens when one does that and why would one perform a commit. Presumably the reason to commit is to record a new "checkpoint" for the code that one can go back to or share? So there's a step of changing the code between the 2 commits isn't there? IMO you need some way to show that there is an intermediate step of writing code.

Then when branching I guess that you get multiple versions of a file and these get merged somehow to produce a master version in the master branch, but none of this detail of the files is shown.

Apologies if this is all wrong thinking, like I say I'm a newb on git but this is the part of the tutorials that seems most lacking to me. They definitely have some value for me but as I'm mainly trying to understand git WRT code versions it is lacking, as I've said.

Thanks.

grunt build failing

Hi, awesome project! I'd like to add some more shortcuts but I can't seem to build the project. I ran npm install and then npm install grunt -g but I'm getting this error when trying to build:

[lkysow@Lukes-Macbook learnGitBranching (master)]$ grunt build
Loading "shell.js" tasks and helpers...ERROR
>> TypeError: Cannot read property '_' of undefined
<WARN> Task "shell" not found. Use --force to continue. </WARN>

Aborted due to warnings.

And when run with --force:

lkysow@Lukes-Macbook learnGitBranching (master)]$ grunt  build --force
Loading "shell.js" tasks and helpers...ERROR
>> TypeError: Cannot read property '_' of undefined
<WARN> Task "shell" not found. Used --force, continuing. </WARN>

Done, but with warnings.

If you think the issue I'm seeing is something peculiar to my environment then no worries, I'll continue trying to debug it myself.

Add an undo button

Sometimes you want to try different stuff and simply undo the last command and try another one, it would be great if there was at least an undo button, and preferably an undo stack!

'define name' breaks the builder

Windows 7, Chrome 24.0.1312.57 m

To reproduce:

  • build level
  • define name

This just hangs without displaying a dialog -- the green up/down arrow is displayed beside the command. Further commands do nothing. "Uncaught Error: woah we dont support that method yet" is display in console after typing define name.

Trace:

Uncaught Error: woah we dont support that method yet bundle.min.16cb085d.js:1
v.extend.processLevelBuilderCommand bundle.min.16cb085d.js:1
a.trigger bundle.min.16cb085d.js:1
f.Model.extend.processCommand bundle.min.16cb085d.js:1
f.Model.extend.popAndProcess bundle.min.16cb085d.js:1
f.Model.extend.sipFromBuffer bundle.min.16cb085d.js:1
(anonymous function) bundle.min.16cb085d.js:1

Moving Around in Git -- Level Request (relative refs)

In the level where you introduce reset and revert there really isn't any explanation for why we type HEAD or HEAD~1. This doesn't really help a user learn what those mean and why that is the command one needs to use.

Helper command bar

There should be a command bar at the bottom that includes basic helper commands -- undo, help, reset, and maybe the demo!

Modal windows cannot be dismissed on smaller screens

When using the site on smaller screen resolutions (in this case 1366x768) modal windows (such as the first Alert dialog - pictured below) cannot be dismissed as the button at the bottom of the dialog is not visible, and browser scroll bars do not work (in this case for Google Chrome 24.0.1312.57), and the red Mac OS X style button in the top left of the dialog does not work either.

The ability to either dimiss the modal window using the red button, or use the browser scroll bars should be enabled when such a window appears.

CapturFiles_24

git-flow

This is a very nice tutorial. Any plans for doing one for git-flow?

Level 2 branching does not complete if errors are made

If you make an error or typo on level-2 branching and still complete the proper steps the goal does not complete, you must start over from scratch by re-refreshing the browser.

Reproduce.

git branch bugfix git branch bugFix git checkout bugFix

Doesn't work in IE

The windows buttons are positioned vertically (did you forget to add float:left and set their width properly?)

The first console window rarely loads its contents.

I also see this in the console:
SCRIPT438: Object doesn't support property or method 'getEvents'
bundle.min.16cb085d.js, line 1 character 249445

P.S. Debugging half-meg of minified JS is totally cool.

show command not recognized

Executing just 'show' gives the error:
The command "show" isn't supported, sorry!

I was expecting help to see the available show commands (like 'show solution'). To take this even further, an overview of the available commands would be useful (help doesn't help here ;) ). Nice catch on 'ls' btw!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.