<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
  <channel>
    <title>tutorial | Mohammad Moshtaghi</title>
    <link>https://mhmmoshtaghi.github.io/category/tutorial/</link>
      <atom:link href="https://mhmmoshtaghi.github.io/category/tutorial/index.xml" rel="self" type="application/rss+xml" />
    <description>tutorial</description>
    <generator>Wowchemy (https://wowchemy.com)</generator><language>en-us</language><copyright>© 2023 Mohammad Moshtaghi</copyright><lastBuildDate>Mon, 06 Jan 2020 13:00:00 -0700</lastBuildDate>
    <image>
      <url>https://mhmmoshtaghi.github.io/media/logo_hu1dc8deb1865675db905a286e8af9308b_16380_300x300_fit_lanczos_3.png</url>
      <title>tutorial</title>
      <link>https://mhmmoshtaghi.github.io/category/tutorial/</link>
    </image>

    <item>
      <title>Solving the Molecube by Reduction</title>
      <link>https://mhmmoshtaghi.github.io/post/solving-the-molecube-by-reduction/</link>
      <pubDate>Mon, 06 Jan 2020 13:00:00 -0700</pubDate>
      <guid>https://mhmmoshtaghi.github.io/post/solving-the-molecube-by-reduction/</guid>
      <description>&lt;p&gt;My sister-in-law surprised me with a &lt;a href=&#34;http://www.recenttoys.com/meffert-molecube-twister-puzzle/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;Molecube&lt;/a&gt; for Christmas, which combines the logic of a Sudoku puzzle with the mechanics of a Rubik&amp;rsquo;s cube. Each ball on the Molecube is one of nine colors, and the goal is to reconfigure a shuffled Molecube so each of its faces has all nine colors on it.&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img src=&#34;http://www.recenttoys.com/wp-content/uploads/2019/11/meffert-molecube-twister-puzzle-1200x900.jpg&#34; alt=&#34;&#34; loading=&#34;lazy&#34; data-zoomable width=&#34;65%&#34; /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;p&gt;It turns out that solving the Molecube is a wonderful exercise in what computer scientists call &lt;em&gt;reduction&lt;/em&gt;, which involves transforming a problem we don&amp;rsquo;t know how to solve into one that we do, solving that version, and then translating the solution back into the original problem. In this post, I&amp;rsquo;ll give a reader-friendly primer on reduction, outline a reduction from the Molecube to the Rubik&amp;rsquo;s cube, and then wrap up by solving the Molecube with a standard Rubik&amp;rsquo;s cube algorithm.&lt;/p&gt;
&lt;p&gt;If you&amp;rsquo;re interested in solving the Molecube yourself (and perhaps you&amp;rsquo;re here looking for hints), I&amp;rsquo;ve created a &lt;a href=&#34;https://mhmmoshtaghi.github.io/files/molecube_worksheet.pdf&#34; target=&#34;_blank&#34;&gt;worksheet&lt;/a&gt; you can use and will point out when you should skip ahead in the post so as to avoid spoiling this delightful puzzle.&lt;/p&gt;
&lt;h2 id=&#34;reduction-there-and-back-again&#34;&gt;Reduction: There and Back Again&lt;/h2&gt;
&lt;p&gt;Say we have a problem $A$ that we don&amp;rsquo;t know how to solve and another problem $B$ that we do know how to solve. Said another way, we have an &amp;ldquo;algorithm&amp;rdquo; that can answer any question asked in the form of problem $B$, but we have no such algorithm for problem $A$ questions. The whole idea of reduction is to:&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;Take a problem $A$ question (which we don&amp;rsquo;t know how to answer) and &amp;ldquo;transform&amp;rdquo; it into a problem $B$ question (which we do know how to answer).&lt;/li&gt;
&lt;li&gt;Use the &amp;ldquo;algorithm&amp;rdquo; for problem $B$ questions to get an answer for our transformed problem $A$ question.&lt;/li&gt;
&lt;li&gt;Translate the algorithm&amp;rsquo;s answer back into the context of problem $A$.&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;That&amp;rsquo;s it. We use a known algorithm (for problem $B$) as our workhorse for a new and unknown problem (problem $A$), and out pop solutions for our unknown problem! This powerful technique underlies almost all of theoretical computer science, giving us a tool to relate difficult problems to one another (as opposed to treating every new problem as something totally unique). I recently heard a high-profile professor in Computer Science claim that reduction is one of only two truly new ideas our discipline has ever contributed to science (though she called this idea &amp;ldquo;hierarchy&amp;rdquo;, with the other idea being &amp;ldquo;abstraction&amp;rdquo;).&lt;/p&gt;
&lt;p&gt;A natural question to ask next would be if all problems can be tackled with reduction. Unfortunately, in practice, finding the right translation between a pair of problems (Step 1, above) can be prohibitively difficult. Reduction is easiest when the two problems seem to have an obvious relationship we can exploit, which brings us to the Molecube and the Rubik&amp;rsquo;s cube.&lt;/p&gt;
&lt;h2 id=&#34;a-sudoku-like-transformation&#34;&gt;A Sudoku-Like Transformation&lt;/h2&gt;
&lt;p&gt;It&amp;rsquo;s difficult to overstate how much of the Molecube&amp;rsquo;s solution is given away in its advertising as &amp;ldquo;Sudoku + Rubik&amp;rsquo;s cube&amp;rdquo;. My solution will treat this equation quite literally, starting with a transformation that relies on a Sudoku puzzle. I found this transformation by asking two simple questions:&lt;/p&gt;
&lt;img src=&#34;shuffled.png&#34; style=&#34;display: inline-block; width: 48%; margin-right: 2%&#34;/&gt;
&lt;img src=&#34;rubiks-cube.jpg&#34; style=&#34;display: inline-block; width: 46%; margin-left: 2%&#34;/&gt;
&lt;ol&gt;
&lt;li&gt;How are the Molecube and the Rubik&amp;rsquo;s cube similar?&lt;/li&gt;
&lt;/ol&gt;
&lt;ul&gt;
&lt;li&gt;They&amp;rsquo;re both 3x3x3 cubes, meaning they both have 6 faces, 8 corners, and 12 edges. This totals 26 balls (on the Molecube) or blocks (on the Rubik&amp;rsquo;s cube).&lt;/li&gt;
&lt;li&gt;Their physical mechanics (spinning, twisting, etc.) are identical.&lt;/li&gt;
&lt;li&gt;Their goals are, in a way, also identical: from a shuffled configuration, reach a goal configuration.&lt;/li&gt;
&lt;/ul&gt;
&lt;ol start=&#34;2&#34;&gt;
&lt;li&gt;How are the Molecube and the Rubik&amp;rsquo;s cube different?&lt;/li&gt;
&lt;/ol&gt;
&lt;ul&gt;
&lt;li&gt;Their goal configurations are different: the Molecube wants one ball of each color on each face, while the Rubik&amp;rsquo;s cube wants each face to be all the same color.&lt;/li&gt;
&lt;li&gt;There are nine colors on the Molecube, but only six on the Rubik&amp;rsquo;s cube.&lt;/li&gt;
&lt;li&gt;A block on the Rubik&amp;rsquo;s cube has 1–3 colors (one for each face it touches), while a ball on the Molecube is the same color on all &amp;ldquo;sides&amp;rdquo;.&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;The similarities hint at a solution: though the goal configurations are different, the cubes&#39; structures and mechanics are the same. So if I find a goal configuration for the Molecube, I can use the Rubik&amp;rsquo;s cube algorithm to handle all the tricky rearranging involved in actually getting there.&lt;/p&gt;
&lt;p&gt;If that&amp;rsquo;s enough of a framework for you to attempt your own solution, feel free to download the &lt;a href=&#34;https://mhmmoshtaghi.github.io/files/molecube_worksheet.pdf&#34; target=&#34;_blank&#34;&gt;worksheet&lt;/a&gt; I&amp;rsquo;ve created to help you visualize the Molecube as a Sudoku puzzle (with colors instead of numbers). You&amp;rsquo;ll want to stop reading here and come back once you&amp;rsquo;ve completed a goal configuration or if you&amp;rsquo;re stuck and need hints.&lt;/p&gt;
&lt;p&gt;Speaking of hints, the best way to unlock this tricky Sudoku-like color puzzle (getting one color on each face) is to study the Molecube&amp;rsquo;s colors and structure. I asked myself the following questions (which culminated in the table at the top of the &lt;a href=&#34;https://mhmmoshtaghi.github.io/files/molecube_worksheet.pdf&#34; target=&#34;_blank&#34;&gt;worksheet&lt;/a&gt;):&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;How does the Molecube fit nine colors on a cube with 26 balls?&lt;/li&gt;
&lt;li&gt;How are the colors distributed over the different types of balls (centers, corners, and edges)?&lt;/li&gt;
&lt;li&gt;Are there any patterns that appear when trying to place balls of a certain color so it appears on each face exactly once?&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;The answers to these questions are revealing. There are three balls of each color, with the important exception of Green, which only has two. Further, Green is the unique color that is on two corners. Red and Purple are each on three edges, and the remaining six colors (White, Black, Orange, Yellow, Light Blue, and Blue) are each on one center, one corner, and one edge. This information — after some careful thinking — reveals the patterns we need:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;As in the Rubik&amp;rsquo;s cube, centers opposite one another are always opposite one another (i.e., Black is always opposite White, Orange is always opposite Yellow, and Blue is always opposite Light Blue).&lt;/li&gt;
&lt;li&gt;The only way the two Green corners avoid being on the same face is if they&amp;rsquo;re opposite one another (e.g., upper-right-back and lower-left-front).&lt;/li&gt;
&lt;li&gt;The only way the three Red (or Purple) edges avoid being on the same face is if a Red (or Purple) appears exactly once in each &amp;ldquo;middle band&amp;rdquo; (shown below, left). So each middle band contains exactly one Red and one Purple.&lt;/li&gt;
&lt;li&gt;For any of the remaining colors, (e.g., Blue) there is a center of that color. This blocks the corner of that color from being in the same &amp;ldquo;layer&amp;rdquo;, so the corner must go in the layer opposite the center (shown below, right). Once the position of the corner is fixed, there is only one position the edge of that color can go.&lt;/li&gt;
&lt;/ul&gt;
&lt;img src=&#34;rule1.png&#34; style=&#34;display: inline-block; width: 47%; margin-right: 2%&#34;/&gt;
&lt;img src=&#34;rule2.png&#34; style=&#34;display: inline-block; width: 47%; margin-left: 2%&#34;/&gt;
&lt;p&gt;Using these rules and some trial and error, I found the solution shown below, also detailed in the &lt;a href=&#34;https://mhmmoshtaghi.github.io/files/molecube_worksheet_solved.pdf&#34; target=&#34;_blank&#34;&gt;worksheet solution&lt;/a&gt;. (An interesting aside: I don&amp;rsquo;t know if this is the only solution, but any solution works for the reduction). To relate the Molecube solution to the Rubik&amp;rsquo;s cube solution, we simply treat each 3×3 face on the Molecube as a &amp;ldquo;color&amp;rdquo; on the Rubik&amp;rsquo;s cube. (For example, the Black ball at the top-left of the White-center face becomes the Red-White-Green block on the Rubik&amp;rsquo;s cube). This completes the transformation step of the reduction.&lt;/p&gt;
&lt;img src=&#34;sudoku-soln.jpg&#34; style=&#34;display: inline-block; width: 47%; margin-right: 2%&#34;/&gt;
&lt;img src=&#34;rubiks-mapping.jpg&#34; style=&#34;display: inline-block; width: 47%; margin-left: 2%&#34;/&gt;
&lt;h2 id=&#34;rubik-ing-the-molecube&#34;&gt;Rubik-ing the Molecube&lt;/h2&gt;
&lt;p&gt;With the difficult transformation step out of the way, the rest of the reduction is easy. You can solve any shuffled Molecube just like you would a Rubik&amp;rsquo;s cube (assuming you know how to do that), but instead of aiming to have faces with all the same color, you aim to build the goal configuration we got from the transformation (above, left). To make this easier for me to visualize, I made a 3D rendering of my solution (front view on the left, back view on the right).&lt;/p&gt;
&lt;img src=&#34;featured.png&#34; style=&#34;display: inline-block; width: 47%; margin-right: 2%&#34;/&gt;
&lt;img src=&#34;solved-back.png&#34; style=&#34;display: inline-block; width: 47%; margin-left: 2%&#34;/&gt;
&lt;p&gt;I was pleasantly surprised at how much Rubik&amp;rsquo;s cube muscle memory I still had from speedcubing in junior high (though if you need a refresher, I found &lt;a href=&#34;https://hobbylark.com/puzzles/Rubik-Cube-Algorithms&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;this tutorial&lt;/a&gt; helpful). Interestingly, some of the steps in the Rubik&amp;rsquo;s cube &amp;ldquo;algorithm&amp;rdquo; are unnecessary for the Molecube. Remember the earlier observation that the Molecube&amp;rsquo;s balls are each a single color while the Rubik&amp;rsquo;s cube blocks can have 1–3 colors each? This means that the Molecube doesn&amp;rsquo;t care if its balls are rotated &amp;ldquo;in place&amp;rdquo;, though this is a problem for the Rubik&amp;rsquo;s cube (see the example below). So any steps in the Rubik&amp;rsquo;s cube algorithm that are meant to fix things like this can be skipped entirely.&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img src=&#34;https://usercontent2.hubstatic.com/14101285_f1024.jpg&#34; alt=&#34;&#34; loading=&#34;lazy&#34; data-zoomable width=&#34;90%&#34; /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;h2 id=&#34;but-does-it-work&#34;&gt;But Does It Work?&lt;/h2&gt;
&lt;p&gt;To show that the reduction approach not only works but is also reasonably fast, here&amp;rsquo;s me solving the Molecube in just under 2 minutes.&lt;/p&gt;

&lt;div style=&#34;position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;&#34;&gt;
  &lt;iframe src=&#34;https://www.youtube.com/embed/QRtTLvtXWrQ&#34; style=&#34;position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;&#34; allowfullscreen title=&#34;YouTube Video&#34;&gt;&lt;/iframe&gt;
&lt;/div&gt;

&lt;br/&gt;
&lt;p&gt;There are a &lt;em&gt;lot&lt;/em&gt; of Rubik&amp;rsquo;s cube-inspired puzzles these days (for example, the &lt;a href=&#34;http://www.recenttoys.com/meffert-ghost-cube-twister-puzzle/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;Ghost Cube&lt;/a&gt; and the &lt;a href=&#34;http://www.recenttoys.com/meffert-pyraminx-twister-puzzle/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;Pyraminx&lt;/a&gt;). But solving the Molecube by reduction makes me wonder just how many of these new puzzles share a similar relationship to the original Rubik&amp;rsquo;s cube. If these relationships exist, we&amp;rsquo;d find that these new puzzles aren&amp;rsquo;t really new at all; they&amp;rsquo;re just an old puzzle we know how to solve, but with new names and nice packaging.&lt;/p&gt;
</description>
    </item>

    <item>
      <title>Git Going With GitKraken</title>
      <link>https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/</link>
      <pubDate>Tue, 22 Jan 2019 12:40:00 -0700</pubDate>
      <guid>https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/</guid>
      <description>&lt;p&gt;Our team over at the &lt;a href=&#34;https://sops.engineering.asu.edu/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;SOPS Lab&lt;/a&gt; has been writing a lot of code lately as part of an ongoing effort to make our AmoebotSim simulator publicly available through an open source release. There&amp;rsquo;s a lot of diversity in coding/software engineering experience among our team members — from finishing a first course in C++ to completing several internships in big tech — so I&amp;rsquo;ve been spending some time thinking about how to make on-boarding easier, forming new students into conceptual thinkers and proficient programmers as quickly as possible. This tutorial on the basics of Git is meant to help with that.&lt;/p&gt;
&lt;h2 id=&#34;necessary-disclaimers&#34;&gt;Necessary Disclaimers&lt;/h2&gt;
&lt;p&gt;We have to get two things out of the way up front. First, this is not really the &amp;ldquo;accessible to anyone, technical or not&amp;rdquo; kind of post that I usually aim for. While it is meant to be simpler than the average Git tutorial, it&amp;rsquo;s still going to talk about software skills that are, by nature, technical. Speaking of other Git tutorials: yes, I do know how many Git tutorials already exist. Many of them are ones I&amp;rsquo;ve learned from and am inspired by. Some are far more &lt;a href=&#34;https://jwiegley.github.io/git-from-the-bottom-up/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;complete&lt;/a&gt;, more &lt;a href=&#34;https://chris.beams.io/posts/git-commit/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;specific&lt;/a&gt;, more &lt;a href=&#34;https://www.atlassian.com/git/tutorials&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;polished&lt;/a&gt;, and even more &lt;a href=&#34;https://www.youtube.com/watch?v=1ffBJ4sVUb4&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;craftsy&lt;/a&gt; than what I intend to do here. The point of this tutorial is to distill all that wonderful material into something that gets students (and other newcomers) acquainted with basic Git concepts and comfortable with a great Git client all in one sitting.&lt;/p&gt;
&lt;p&gt;As a last bit of housekeeping, I&amp;rsquo;d like to credit Rachel M. Carmena, whose &lt;a href=&#34;https://rachelcarmena.github.io/2018/12/12/how-to-teach-git.html&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;methodology&lt;/a&gt; I&amp;rsquo;m following quite closely.&lt;/p&gt;
&lt;h2 id=&#34;gits-view-of-the-world&#34;&gt;Git&amp;rsquo;s View of the World&lt;/h2&gt;
&lt;p&gt;Git sees a software project loosely like this:&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34; srcset=&#34;
               /post/git-going-with-gitkraken/overview1_hub13eecc48a7da159c36df9e38fb25fc7_21091_7360b822a929d24f70068d4ba74e6029.png 400w,
               /post/git-going-with-gitkraken/overview1_hub13eecc48a7da159c36df9e38fb25fc7_21091_d485b9b5f2f65f943f1826f85f9c9afd.png 760w,
               /post/git-going-with-gitkraken/overview1_hub13eecc48a7da159c36df9e38fb25fc7_21091_1200x1200_fit_lanczos_3.png 1200w&#34;
               src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/overview1_hub13eecc48a7da159c36df9e38fb25fc7_21091_7360b822a929d24f70068d4ba74e6029.png&#34;
               width=&#34;760&#34;
               height=&#34;384&#34;
               loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;p&gt;Big picture: there&amp;rsquo;s the remote server that houses the full software project and all the changes that have been made to it so far, and then there&amp;rsquo;s your computer where you implement new features and code changes. Now, Git is usually used when writing software collaboratively, so while the above picture is all that you have to worry about, the real setting is more like this:&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34; srcset=&#34;
               /post/git-going-with-gitkraken/overview2_huc8ef78e1cac3bdcd4fd7c5ce51e22d60_35358_d91519c499ddd497f2e745872d24540b.png 400w,
               /post/git-going-with-gitkraken/overview2_huc8ef78e1cac3bdcd4fd7c5ce51e22d60_35358_b38b1f73815419bd936e5845416f87e4.png 760w,
               /post/git-going-with-gitkraken/overview2_huc8ef78e1cac3bdcd4fd7c5ce51e22d60_35358_1200x1200_fit_lanczos_3.png 1200w&#34;
               src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/overview2_huc8ef78e1cac3bdcd4fd7c5ce51e22d60_35358_d91519c499ddd497f2e745872d24540b.png&#34;
               width=&#34;760&#34;
               height=&#34;326&#34;
               loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;h2 id=&#34;hold-up-whats-git&#34;&gt;Hold Up, What&amp;rsquo;s Git?&lt;/h2&gt;
&lt;p&gt;Git is just a piece of software that&amp;rsquo;s openly available for anyone to use. (Aside: it&amp;rsquo;s not a company or something that&amp;rsquo;s sold commercially, though this is often confusing because of companies/services like GitHub and GitLab). The problem Git is trying to solve, informally, is to support many people editing the same set of files concurrently while causing as few conflicts and headaches as possible. You might recognize that Google Docs and Dropbox try to solve a similar problem, but with a different strategy that makes them poorly suited for software development. Imagine for a moment that you were trying to use Google Docs for writing real code. Say you&amp;rsquo;ve been up all night working on a cool new feature, tracking down all its subtle and frustrating bugs, and now you want to compile and test it one last time to make sure it&amp;rsquo;s all good to go.&lt;/p&gt;
&lt;p&gt;But right as you go to compile, your teammate gets in there and starts writing some other code, which naturally isn&amp;rsquo;t complete yet and doesn&amp;rsquo;t build! What do you do? Do you hit them up on Slack and ask them to stop coding while you test your feature? (If so, that essentially means only one person can be working at a time). Do you just keep trying to compile over and over until you get lucky and it builds? (If problems arise in testing, you won&amp;rsquo;t be sure if it&amp;rsquo;s your code that&amp;rsquo;s causing issues or someone else&amp;rsquo;s). This is nightmarish and no one does this. (I hope).&lt;/p&gt;
&lt;p&gt;Git is an example of &lt;em&gt;distributed version control software&lt;/em&gt;, a type of software meant to make these kinds of situations much easier to handle by giving each user more control over their own version of the files and when to incorporate the changes made by other people. (For the record, there are &lt;a href=&#34;https://en.wikipedia.org/wiki/List_of_version-control_software#Distributed_model&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;other choices&lt;/a&gt; for distributed version control, but Git is by far the most popular).&lt;/p&gt;
&lt;h2 id=&#34;tools-of-the-trade&#34;&gt;Tools of the Trade&lt;/h2&gt;
&lt;p&gt;In Git, the remote repository contains the current version of the shared code. Remote repositories can be set up on any server (or even your own workstation), but most people prefer to use a service like &lt;a href=&#34;https://github.com/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;GitHub&lt;/a&gt;, &lt;a href=&#34;https://bitbucket.org/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;Bitbucket&lt;/a&gt;, or &lt;a href=&#34;https://about.gitlab.com/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;GitLab&lt;/a&gt; to host their projects for them, which makes life easier. Think of it like this: GitHub is to Git repositories as WordPress is to websites. You can certainly host your own website, but using a service like WordPress saves you the trouble of maintaining a web server yourself. Our team uses Bitbucket for our AmoebotSim project, so that&amp;rsquo;s what&amp;rsquo;ll be in the screenshots.&lt;/p&gt;
&lt;p&gt;An additional way to simplify using Git is to get a nice Git client like &lt;a href=&#34;https://www.gitkraken.com/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;GitKraken&lt;/a&gt; or &lt;a href=&#34;https://desktop.github.com/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;GitHub Desktop&lt;/a&gt; instead of interfacing with Git on the &lt;a href=&#34;https://blog.axosoft.com/gitkraken-vs-cli/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;command line&lt;/a&gt; (which many hardcore users will tell you is the only way to &lt;em&gt;really&lt;/em&gt; learn Git). Using the website analogy again, Git clients are to Git repositories like themes and rich-text editors are to websites. Could you put a stellar website together writing your own HTML, CSS, and JavaScript? Sure. Would you learn a lot more about how websites work doing it this way? Of course. But it takes a lot longer, and there&amp;rsquo;s much more room to make mistakes. In general, Git clients make understanding your repository a breeze with nice graphical representations and controls. I&amp;rsquo;ll be using GitKraken here, and I highly recommend you do too!&lt;/p&gt;
&lt;h2 id=&#34;cloning-a-repository&#34;&gt;Cloning a Repository&lt;/h2&gt;
&lt;p&gt;Getting a copy of a repository from a remote server onto your machine is called &lt;em&gt;cloning&lt;/em&gt; a repository.&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34; srcset=&#34;
               /post/git-going-with-gitkraken/featured_hu8b2ce5082bc18ebcc1bb4ed8ae5cc997_25331_bfb4883daee032c89f9563c0b177930c.png 400w,
               /post/git-going-with-gitkraken/featured_hu8b2ce5082bc18ebcc1bb4ed8ae5cc997_25331_33cc21783cc1f53b5be6f9ba6ca975f9.png 760w,
               /post/git-going-with-gitkraken/featured_hu8b2ce5082bc18ebcc1bb4ed8ae5cc997_25331_1200x1200_fit_lanczos_3.png 1200w&#34;
               src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/featured_hu8b2ce5082bc18ebcc1bb4ed8ae5cc997_25331_bfb4883daee032c89f9563c0b177930c.png&#34;
               width=&#34;760&#34;
               height=&#34;386&#34;
               loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;p&gt;Cloning makes a copy of the remote repository to your local repository. This not only includes the most recent version of the files but also the entire version history (list of changes) for every file, who made those changes, when those changes were made, and all the different &lt;em&gt;branches&lt;/em&gt; of those files that your collaborators may be working on (we&amp;rsquo;ll come back to branching in a future post). The clone operation also puts the most recent version of the files in your working directory, where you can open them up in your file system and start making changes.&lt;/p&gt;
&lt;p&gt;This is pretty easy to do with GitKraken:&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34;
           src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/cloneurl.gif&#34;
           loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;p&gt;And it&amp;rsquo;s even easier if you&amp;rsquo;ve already signed into your hosting platform (e.g., Bitbucket) in GitKraken:&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34;
           src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/clonebitbucket.gif&#34;
           loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;h2 id=&#34;making-and-submitting-changes&#34;&gt;Making and Submitting Changes&lt;/h2&gt;
&lt;p&gt;Now that the code is in my working directory, I can make my edits. From Git&amp;rsquo;s perspective, changes can either be &lt;em&gt;tracked&lt;/em&gt;, meaning Git knows about them, or &lt;em&gt;untracked&lt;/em&gt;, meaning the changes are in new files that haven&amp;rsquo;t been added to Git yet. Either way, I can add all the changes I&amp;rsquo;ve made to Git&amp;rsquo;s &lt;em&gt;staging area&lt;/em&gt; in a process called &lt;em&gt;staging&lt;/em&gt;:&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34; srcset=&#34;
               /post/git-going-with-gitkraken/overview4_hu256a8b59baa77d267bac69972f20125b_45816_d55a385144b2101df929760642d8b972.png 400w,
               /post/git-going-with-gitkraken/overview4_hu256a8b59baa77d267bac69972f20125b_45816_7a15de763dbe4ef89f778f803435d287.png 760w,
               /post/git-going-with-gitkraken/overview4_hu256a8b59baa77d267bac69972f20125b_45816_1200x1200_fit_lanczos_3.png 1200w&#34;
               src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/overview4_hu256a8b59baa77d267bac69972f20125b_45816_d55a385144b2101df929760642d8b972.png&#34;
               width=&#34;760&#34;
               height=&#34;389&#34;
               loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;p&gt;To illustrate this, I&amp;rsquo;ll be adding license and copyright information to AmoebotSim (a &lt;a href=&#34;https://choosealicense.com/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;very important&lt;/a&gt; part of going open source). I&amp;rsquo;ll be making these edits in three parts: (1) adding a LICENSE file, (2) adding a copyright notice to our main.cpp file, and (3) adding an abbreviated copyright notice to the other source files. Adding the LICENSE file will initially be an untracked change (it&amp;rsquo;s a new file), while the other changes that edit existing files will be tracked.&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34;
           src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/editstage.gif&#34;
           loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;p&gt;Now that the changes are staged, we can &lt;em&gt;commit&lt;/em&gt; them to our local repository. A commit is essentially a batch of changes with a description known as a &lt;em&gt;commit message&lt;/em&gt;. In general, a commit message should clearly and concisely describe the changes its commit contains (see &lt;a href=&#34;https://chris.beams.io/posts/git-commit/&#34; target=&#34;_blank&#34; rel=&#34;noopener&#34;&gt;this post&lt;/a&gt; for best practices). Once that message is done, we can commit, adding our changes to the version history.&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34; srcset=&#34;
               /post/git-going-with-gitkraken/overview5_huf9ac3978c316dd0c10eb7a03f5514ebe_45225_32366a24bf4432ea41a9e035508d6acc.png 400w,
               /post/git-going-with-gitkraken/overview5_huf9ac3978c316dd0c10eb7a03f5514ebe_45225_6b5c7ea27f3cac04681e14f518c79a73.png 760w,
               /post/git-going-with-gitkraken/overview5_huf9ac3978c316dd0c10eb7a03f5514ebe_45225_1200x1200_fit_lanczos_3.png 1200w&#34;
               src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/overview5_huf9ac3978c316dd0c10eb7a03f5514ebe_45225_32366a24bf4432ea41a9e035508d6acc.png&#34;
               width=&#34;760&#34;
               height=&#34;386&#34;
               loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;p&gt;This is, per usual, easy to do and visualize in GitKraken:&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34;
           src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/commit.gif&#34;
           loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;p&gt;But committing only puts our changes in the local repository (shown by the little computer icon in GitKraken), not the remote repository where everyone else can see them (shown by the profile picture of the repository owner). Updating the remote repository with new commits from our local repository is called &lt;em&gt;pushing&lt;/em&gt;.&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34; srcset=&#34;
               /post/git-going-with-gitkraken/overview6_hu3a415b6ddcf0e96dab0cfcc3331ab0d8_45316_b901406f732b82d5e85c7cf0f75a9324.png 400w,
               /post/git-going-with-gitkraken/overview6_hu3a415b6ddcf0e96dab0cfcc3331ab0d8_45316_798e0c2aae30b63f381e0ecfb14ff091.png 760w,
               /post/git-going-with-gitkraken/overview6_hu3a415b6ddcf0e96dab0cfcc3331ab0d8_45316_1200x1200_fit_lanczos_3.png 1200w&#34;
               src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/overview6_hu3a415b6ddcf0e96dab0cfcc3331ab0d8_45316_b901406f732b82d5e85c7cf0f75a9324.png&#34;
               width=&#34;760&#34;
               height=&#34;387&#34;
               loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34;
           src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/push.gif&#34;
           loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;p&gt;Once commits have been pushed, they&amp;rsquo;re out there for other repository members to see and use. Be sure that your code builds and is bug-free before you commit and push; otherwise, you&amp;rsquo;ll break everyone else&amp;rsquo;s builds and get a lot of angry messages asking you to fix your issues quickly! (There are ways to mitigate these kinds of problems, like branch/fork-based workflows with approval processes, but I&amp;rsquo;m saving those more advanced topics for a future post).&lt;/p&gt;
&lt;h2 id=&#34;getting-other-peoples-changes&#34;&gt;Getting Other People&amp;rsquo;s Changes&lt;/h2&gt;
&lt;p&gt;Say that you were offline for a couple hours (or days…) and are just returning to your project. Your teammates may have committed and pushed code while you were away, and you want to get all their changes. Git gives you two ways to do this: &lt;em&gt;fetch&lt;/em&gt; and &lt;em&gt;pull&lt;/em&gt;.&lt;/p&gt;
&lt;p&gt;Fetching retrieves all the new updates (commits, files, etc.) from the remote repository and copies them to your local repository. These new updates exist separately from the rest of your work, allowing you to look into them independently from any changes you&amp;rsquo;ve made locally. If you want your team&amp;rsquo;s updates to be integrated with your local changes, you&amp;rsquo;ll need to &lt;em&gt;merge&lt;/em&gt; them in.&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34; srcset=&#34;
               /post/git-going-with-gitkraken/overview7_huac5dddf64e5f42c1357b0a6fce4de759_25204_e9c0671a88849a00d6207fcf96c624ee.png 400w,
               /post/git-going-with-gitkraken/overview7_huac5dddf64e5f42c1357b0a6fce4de759_25204_4e9a143f269b6651d98aab62d3085948.png 760w,
               /post/git-going-with-gitkraken/overview7_huac5dddf64e5f42c1357b0a6fce4de759_25204_1200x1200_fit_lanczos_3.png 1200w&#34;
               src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/overview7_huac5dddf64e5f42c1357b0a6fce4de759_25204_e9c0671a88849a00d6207fcf96c624ee.png&#34;
               width=&#34;760&#34;
               height=&#34;386&#34;
               loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;p&gt;This can potentially cause &lt;em&gt;merge conflicts&lt;/em&gt; if both you and your teammates&#39; commits changed the same lines of code. (Although, to be honest, Git can get confused and think all kinds of things are &amp;ldquo;conflicts&amp;rdquo; even when they&amp;rsquo;re not, so watch out for that). Thankfully, GitKraken has a slick tool for helping you fix your merge conflicts (this was, by far, the #1 reason our team recently switched to GitKraken from Sourcetree):&lt;/p&gt;

&lt;div style=&#34;position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;&#34;&gt;
  &lt;iframe src=&#34;https://www.youtube.com/embed/R1iWJNyRpQE&#34; style=&#34;position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;&#34; allowfullscreen title=&#34;YouTube Video&#34;&gt;&lt;/iframe&gt;
&lt;/div&gt;

&lt;br/&gt;
&lt;p&gt;Pulling simply combines fetching and merging into one step. It retrieves all the new updates from the remote repository and automatically tries to merge them into your local repository, possibly triggering merge conflicts for you to resolve along the way.&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34; srcset=&#34;
               /post/git-going-with-gitkraken/overview8_hubd69aaa45d75cd156217dc1d4527d004_25115_e017a8286fecac1023bf59a73998c9af.png 400w,
               /post/git-going-with-gitkraken/overview8_hubd69aaa45d75cd156217dc1d4527d004_25115_81a9a5c9f5696502450ba90476d9783c.png 760w,
               /post/git-going-with-gitkraken/overview8_hubd69aaa45d75cd156217dc1d4527d004_25115_1200x1200_fit_lanczos_3.png 1200w&#34;
               src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/overview8_hubd69aaa45d75cd156217dc1d4527d004_25115_e017a8286fecac1023bf59a73998c9af.png&#34;
               width=&#34;760&#34;
               height=&#34;387&#34;
               loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;p&gt;In GitKraken, both fetching and pulling can be performed using the top toolbar. The following example shows a pull, though you can see for a brief moment how it first fetches the new commit before merging it in.&lt;/p&gt;














&lt;figure  &gt;
  &lt;div class=&#34;d-flex justify-content-center&#34;&gt;
    &lt;div class=&#34;w-100&#34; &gt;&lt;img alt=&#34;&#34;
           src=&#34;https://mhmmoshtaghi.github.io/post/git-going-with-gitkraken/pull.gif&#34;
           loading=&#34;lazy&#34; data-zoomable /&gt;&lt;/div&gt;
  &lt;/div&gt;&lt;/figure&gt;
&lt;h2 id=&#34;git-out-there&#34;&gt;Git Out There&lt;/h2&gt;
&lt;p&gt;I&amp;rsquo;ve covered the rudimentary operations of Git and how to do them in GitKraken, but there&amp;rsquo;s much more to learn! In a future post I hope to cover branch/fork-based workflows, pull requests, and rebasing, all of which can play a role in using Git for larger projects.&lt;/p&gt;
&lt;p&gt;As always, I welcome your feedback and questions. Happy coding!&lt;/p&gt;
</description>
    </item>

  </channel>
</rss>
