Render graph locally

[troflog]

Hello
Is it possible to render this locally. So when I am teaching git, people can see how the repo changes in real time.

[HarshKapadia2]

Hello,

Thank you for reaching out!

Yes, it is possible to just clone the project and work with it locally. (Instructions)

The online version is the same as what they will have locally.

The project is not real-time though, meaning that every time the repository changes, the user has to manually select the .git directory again to see the changes. So if the users will have an internet connection, it would be better to save them the hassle of setting up the project locally and just using the hosted version that I have provided.

Please let me know if I can help you in any way!

Thank you!

[troflog]

Is it possible to change the app such that i reads a local file (in the same directory as index.html). When running the app locally i just have to copy new version of .git to there and refresh the page.

[HarshKapadia2]

Hello, sorry for the delay in replying. I started implementing a solution, but realise that it would take some time.

My only questions is: Is it possible to change the code in such a way, when running locally I can update the gitgraph when I do a commit?

Technically there IS a way, but I'm not sure it is going to be very straightforward. One would need a server on their local machine that would watch for changes in a particular .git directory using something like Chokidar. On detecting a change, a Socket to the React front end can be used to send all the blobs to the front end to trigger it to re-render the page using the new blobs. This requires creating a server and making changes to the front end to open a socket to the server and on receiving data from the server, calling a state changing function in React which would cause a re-render.

Is it possible to change the app such that i reads a local file (in the same directory as index.html). When running the app locally i just have to copy new version of .git to there and refresh the page.

I think what you're suggesting is unnecessarily complicated. With how the site works currently, you literally just have to select the .git directory again to see the changes. It takes less than two seconds to re-render for a small repository. I think the current implementation is very suitable for teaching. I have used it multiple times in my talks on Git internals. (Here is a video.)

[HarshKapadia2]

Hi @troflog , are there any updates on what you decided to do? Thank you!

[troflog]

Hello
I solved it by making a python program which renders live my changes to the repo. I did not mention why I needed a local version. The problem is that I have to run git inside a private AWS subnet, and it is a lot of steps to get the .git repo out of there and into your website.
It works, but do not make nearly as nice plot as your React-app do.

I need to learn myself some React one day, so that I can build such nice looking plots.

[HarshKapadia2]

Hi!

Oh. You could've compiled the app inside the subnet and used a VNC screen to view the output or something like that.

I'm glad that you found a solution though. I would be interested in having a look at your Python program, if you can share it! I bet I could learn a few things from it!

Good luck with your teaching! Let me know if I can be of any help!

Thank you!