DEV Community

Erick Quinteros
Erick Quinteros

Posted on

GitHub

#git #versiones #distribuido #github

¿Qué problema resuelve Git?

Imagina que tienes un archivo:
main.py
Hoy funciona.
Mañana haces cambios.
Pasado mañana algo deja de funcionar.
Sin Git:

  • No sabes qué cambió.
  • No sabes cuándo cambió.
  • No sabes quién lo cambió.
  • No puedes volver fácilmente atrás. Git resuelve eso. Piensa en Git como una máquina del tiempo para tu código. --- ## Conceptos fundamentales ### Repositorio Un repositorio es el proyecto completo. Ejemplo: repositorio_proyecto Contiene: 
README.md
src/
test/
docs/
scripts/
Enter fullscreen mode Exit fullscreen mode

Git almacena el historial de todos esos archivos.

Commit

Un commit es una fotografía del proyecto.
Ejemplo:

Commit #1
    README creado
Enter fullscreen mode Exit fullscreen mode

Luego:

Commit #2
    Terraform inicial
Enter fullscreen mode Exit fullscreen mode

Luego:

Commit #3
    Bucket S3 agregado
Enter fullscreen mode Exit fullscreen mode

Cada commit permite regresar a ese estado.
Piensa en ellos como puntos de guardado de un videojuego.

Branch

Una branch (rama) es una línea de trabajo independiente.
Ejemplo:
main
contiene v1 estable
Quieres agregar S3
Creas:
feature/s3-bucket
Trabajas ahí. Si algo sale mal:
main
permanece intacto.

¿Por qué no trabajar directamente sobre main?

Porque main debe ser siempre estable.
Regla profesional:
Nunca desarrollar directamente en main

## Flujo profesional
### main
Código estable.
### develop
Integración.
### feature/*
Desarrollo.
Enter fullscreen mode Exit fullscreen mode

Visualmente:

main
 │
 └── develop
        │
        ├── feature/s3
        │
        ├── feature/budget
        │
        └── feature/iam
Enter fullscreen mode Exit fullscreen mode

Crear SSH

¿Por qué?
Para evitar escribir usuario y contraseña constantemente.
Generar clave:

ssh-keygen -t ed25519 -C "correo@gmail.com"
Enter fullscreen mode Exit fullscreen mode

Resultado:

C:\Users\TuUsuario\.ssh\
Enter fullscreen mode Exit fullscreen mode

Archivos:

id_ed25519
id_ed25519.pub
Enter fullscreen mode Exit fullscreen mode

Nunca compartir id_ed25519
Sí compartir id_ed25519.pub

Agregar SSH a GitHub

Copiar:

type $env:USERPROFILE\.ssh\id_ed25519.pub
Enter fullscreen mode Exit fullscreen mode

Ir a GitHub:

Settings
↓
SSH and GPG Keys
↓
New SSH Key
Enter fullscreen mode Exit fullscreen mode

Pegar contenido.

Verificar conexión 

ssh -T git@github.com
Enter fullscreen mode Exit fullscreen mode

Respuesta esperada:

Hi usuario!
You've successfully authenticated.
Enter fullscreen mode Exit fullscreen mode

Crear repositorio

En GitHub:

repositorio_proyecto
Enter fullscreen mode Exit fullscreen mode

Opciones:
✔ Private
✔ README
✔ License

Clonar repositorio

Con GitHub Desktop:

File
↓
Clone Repository
Enter fullscreen mode Exit fullscreen mode

Seleccionar:

repositorio_proyecto
Enter fullscreen mode Exit fullscreen mode

Ubicación:
C:\Projects
Resultado:
C:\Projects\repositorio_proyecto

Abrir en VS Code

Dentro del directorio:
code .

Crear rama develop

Primera vez:

git checkout -b develop

Subir:

git push -u origin develop

¿Por qué?
Porque main será producción.
develop será integración.

Subir cambios

git push

Pull Request

GitHub:

feature/feature-branch
↓
develop
Enter fullscreen mode Exit fullscreen mode

¿Por qué?
Permite revisar antes de integrar.

Merge

Cuando la revisión es aprobada:

feature/feature-branch
↓
develop
Enter fullscreen mode Exit fullscreen mode

Posteriormente:

develop
↓
main
Enter fullscreen mode Exit fullscreen mode

Branch Protection

Configurar en GitHub:

Settings
↓
Branches
↓
Add Rule
Enter fullscreen mode Exit fullscreen mode

Para:
main
Activar:
✔ Require Pull Request
✔ Require Status Checks
✔ Require Branch Up To Date
¿Por qué?
Evita errores accidentales.

Flujo diario del proyecto

Cada vez que trabajes:

git checkout develop
git pull
Enter fullscreen mode Exit fullscreen mode

Crear nueva rama:
git checkout -b feature/nombre
Trabajar.
Guardar:

git add .
git commit -m "feat: descripcion"
Enter fullscreen mode Exit fullscreen mode

Subir git push

Crear Pull Request.
Integrar.
Eliminar rama.

Mentalidad correcta

No pienses:

Git guarda archivos
Enter fullscreen mode Exit fullscreen mode

Piensa:

Git guarda historia
Enter fullscreen mode Exit fullscreen mode

La historia del proyecto será tan valiosa como el código mismo porque permitirá entender:

  • ¿Qué se hizo?
  • ¿Cuándo se hizo?
  • ¿Por qué se hizo?
  • ¿Quién lo hizo?
  • Cómo volver atrás si algo falla.

Esa disciplina será especialmente importante.

Further Reading

Check out the other articles in this series:

  • GIT:
    GIT
    erixero profile

    GIT

    #git #versiones #distribuido
    Comments
    4 min read
  • GIT Referencia Rápida:


    GIT Referencia Rápida 



          <a href="/erixero" class="crayons-avatar  crayons-avatar--l  ">
        <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3961631%2F3bda9bbb-8de7-466f-a410-f81e413413b6.jpg" alt="erixero profile" class="crayons-avatar__image" loading="lazy" />
      </a>
    </div>
    <div>
      <div>
        <a href="/erixero" class="crayons-story__secondary fw-medium m:hidden">
          Erick Quinteros
        </a>
        <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block">
          <button id="story-author-preview-trigger-3791352" aria-controls="story-author-preview-content-3791352" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Erick Quinteros profile details">
            Erick Quinteros

          </button>
          <div
            id="story-author-preview-content-3791352"
            class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0"
            style="border-top-color: var(--card-color);"
            data-repositioning-dropdown="true"
            data-testid="profile-preview-card">
            <div class="gap-4 grid">
              <div class="-mt-4">
                <a href="/erixero" class="flex">
                  <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0">
                    <img
                      src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3961631%2F3bda9bbb-8de7-466f-a410-f81e413413b6.jpg"
                      class="crayons-avatar__image"
                      alt=""
                      loading="lazy" />
                  </span>
                  <span class="crayons-link crayons-subtitle-2 mt-5">Erick Quinteros</span>
                </a>
              </div>
              <div class="print-hidden">
                <button
                  class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100"
                  data-info='{&quot;style&quot;:&quot;full&quot;,&quot;id&quot;:3961631,&quot;className&quot;:&quot;User&quot;,&quot;name&quot;:&quot;Erick Quinteros&quot;}'>
                  Follow
                </button>
              </div>
              <div
                class="author-preview-metadata-container"
                data-author-id="3961631"></div>
            </div>
          </div>
        </div>

      </div>
      <a href="https://dev.to/erixero/git-referencia-rapida-3gm3" class="crayons-story__tertiary fs-xs"><time datetime="2026-05-31T22:05:53Z">May 31</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1780265153"></span></a>
    </div>
  </div>

</div>

<div class="crayons-story__indention">
  <h2 class="crayons-story__title crayons-story__title-full_post">
    <a href="https://dev.to/erixero/git-referencia-rapida-3gm3" data-preload-image="" id="article-link-3791352">
      GIT Referencia Rápida
    </a>
  </h2>
    <div class="crayons-story__tags">
        <a class="crayons-tag  crayons-tag--monochrome " style="
    --tag-bg: rgba(245, 77, 39, 0.10);
    --tag-prefix: #F54D27;
    --tag-bg-hover: rgba(245, 77, 39, 0.10);
    --tag-prefix-hover: #F54D27;
  " href="/t/git"><span class="crayons-tag__prefix">#</span>git</a>
        <a class="crayons-tag  crayons-tag--monochrome " style="
    --tag-bg: rgba(59, 73, 223, 0.10);
    --tag-prefix: #3b49df;
    --tag-bg-hover: rgba(59, 73, 223, 0.10);
    --tag-prefix-hover: #3b49df;
  " href="/t/versions"><span class="crayons-tag__prefix">#</span>versions</a>
        <a class="crayons-tag  crayons-tag--monochrome " style="
    --tag-bg: rgba(59, 73, 223, 0.10);
    --tag-prefix: #3b49df;
    --tag-bg-hover: rgba(59, 73, 223, 0.10);
    --tag-prefix-hover: #3b49df;
  " href="/t/versioncontrol"><span class="crayons-tag__prefix">#</span>versioncontrol</a>
        <a class="crayons-tag  crayons-tag--monochrome " style="
    --tag-bg: rgba(59, 73, 223, 0.10);
    --tag-prefix: #3b49df;
    --tag-bg-hover: rgba(59, 73, 223, 0.10);
    --tag-prefix-hover: #3b49df;
  " href="/t/cheatsheet"><span class="crayons-tag__prefix">#</span>cheatsheet</a>
    </div>
  <div class="crayons-story__bottom">
    <div class="crayons-story__details">
        <a href="https://dev.to/erixero/git-referencia-rapida-3gm3#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - GIT Referencia Rápida">
          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aggyh7ei0ponzl7r6emij8l7kevgmozd" class="crayons-icon"><title id="aggyh7ei0ponzl7r6emij8l7kevgmozd">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg>

          <span class="hidden s:inline">Add Comment</span>
        </a>
    </div>
    <div class="crayons-story__save">
      <small class="crayons-story__tertiary fs-xs mr-2">
        2 min read
      </small>
        <button
          type="button"
          id="article-save-button-3791352"
          class="c-btn c-btn--icon-alone bookmark-button"
          data-reactable-id="3791352"
          data-article-author-id="3961631"
          aria-label="Save post GIT Referencia Rápida to reading list"
          title="Save post GIT Referencia Rápida to reading list">
          <span class="bm-initial">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg>

          </span>
          <span class="bm-success">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg>

          </span>
        </button>
    </div>
  </div>
</div>
    Enter fullscreen mode Exit fullscreen mode



  • GIT cheatsheet:


    GIT Cheatsheet 



          <a href="/erixero" class="crayons-avatar  crayons-avatar--l  ">
        <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3961631%2F3bda9bbb-8de7-466f-a410-f81e413413b6.jpg" alt="erixero profile" class="crayons-avatar__image" loading="lazy" />
      </a>
    </div>
    <div>
      <div>
        <a href="/erixero" class="crayons-story__secondary fw-medium m:hidden">
          Erick Quinteros
        </a>
        <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block">
          <button id="story-author-preview-trigger-3791396" aria-controls="story-author-preview-content-3791396" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Erick Quinteros profile details">
            Erick Quinteros

          </button>
          <div
            id="story-author-preview-content-3791396"
            class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0"
            style="border-top-color: var(--card-color);"
            data-repositioning-dropdown="true"
            data-testid="profile-preview-card">
            <div class="gap-4 grid">
              <div class="-mt-4">
                <a href="/erixero" class="flex">
                  <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0">
                    <img
                      src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3961631%2F3bda9bbb-8de7-466f-a410-f81e413413b6.jpg"
                      class="crayons-avatar__image"
                      alt=""
                      loading="lazy" />
                  </span>
                  <span class="crayons-link crayons-subtitle-2 mt-5">Erick Quinteros</span>
                </a>
              </div>
              <div class="print-hidden">
                <button
                  class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100"
                  data-info='{&quot;style&quot;:&quot;full&quot;,&quot;id&quot;:3961631,&quot;className&quot;:&quot;User&quot;,&quot;name&quot;:&quot;Erick Quinteros&quot;}'>
                  Follow
                </button>
              </div>
              <div
                class="author-preview-metadata-container"
                data-author-id="3961631"></div>
            </div>
          </div>
        </div>

      </div>
      <a href="https://dev.to/erixero/git-cheatsheet-18gj" class="crayons-story__tertiary fs-xs"><time datetime="2026-05-31T22:15:42Z">May 31</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1780265742"></span></a>
    </div>
  </div>

</div>

<div class="crayons-story__indention">
  <h2 class="crayons-story__title crayons-story__title-full_post">
    <a href="https://dev.to/erixero/git-cheatsheet-18gj" data-preload-image="" id="article-link-3791396">
      GIT Cheatsheet
    </a>
  </h2>
    <div class="crayons-story__tags">
        <a class="crayons-tag  crayons-tag--monochrome " style="
    --tag-bg: rgba(245, 77, 39, 0.10);
    --tag-prefix: #F54D27;
    --tag-bg-hover: rgba(245, 77, 39, 0.10);
    --tag-prefix-hover: #F54D27;
  " href="/t/git"><span class="crayons-tag__prefix">#</span>git</a>
        <a class="crayons-tag  crayons-tag--monochrome " style="
    --tag-bg: rgba(59, 73, 223, 0.10);
    --tag-prefix: #3b49df;
    --tag-bg-hover: rgba(59, 73, 223, 0.10);
    --tag-prefix-hover: #3b49df;
  " href="/t/versiones"><span class="crayons-tag__prefix">#</span>versiones</a>
        <a class="crayons-tag  crayons-tag--monochrome " style="
    --tag-bg: rgba(59, 73, 223, 0.10);
    --tag-prefix: #3b49df;
    --tag-bg-hover: rgba(59, 73, 223, 0.10);
    --tag-prefix-hover: #3b49df;
  " href="/t/distribuido"><span class="crayons-tag__prefix">#</span>distribuido</a>
        <a class="crayons-tag  crayons-tag--monochrome " style="
    --tag-bg: rgba(59, 73, 223, 0.10);
    --tag-prefix: #3b49df;
    --tag-bg-hover: rgba(59, 73, 223, 0.10);
    --tag-prefix-hover: #3b49df;
  " href="/t/cheatsheet"><span class="crayons-tag__prefix">#</span>cheatsheet</a>
    </div>
  <div class="crayons-story__bottom">
    <div class="crayons-story__details">
        <a href="https://dev.to/erixero/git-cheatsheet-18gj#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - GIT Cheatsheet">
          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a33sxux1plzplkcqxhs21u0f5a7l25dn" class="crayons-icon"><title id="a33sxux1plzplkcqxhs21u0f5a7l25dn">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg>

          <span class="hidden s:inline">Add Comment</span>
        </a>
    </div>
    <div class="crayons-story__save">
      <small class="crayons-story__tertiary fs-xs mr-2">
        3 min read
      </small>
        <button
          type="button"
          id="article-save-button-3791396"
          class="c-btn c-btn--icon-alone bookmark-button"
          data-reactable-id="3791396"
          data-article-author-id="3961631"
          aria-label="Save post GIT Cheatsheet to reading list"
          title="Save post GIT Cheatsheet to reading list">
          <span class="bm-initial">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg>

          </span>
          <span class="bm-success">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg>

          </span>
        </button>
    </div>
  </div>
</div>
    Enter fullscreen mode Exit fullscreen mode



  • GitHub:


    GitHub 



          <a href="/erixero" class="crayons-avatar  crayons-avatar--l  ">
        <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3961631%2F3bda9bbb-8de7-466f-a410-f81e413413b6.jpg" alt="erixero profile" class="crayons-avatar__image" loading="lazy" />
      </a>
    </div>
    <div>
      <div>
        <a href="/erixero" class="crayons-story__secondary fw-medium m:hidden">
          Erick Quinteros
        </a>
        <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block">
          <button id="story-author-preview-trigger-3791474" aria-controls="story-author-preview-content-3791474" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Erick Quinteros profile details">
            Erick Quinteros

          </button>
          <div
            id="story-author-preview-content-3791474"
            class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0"
            style="border-top-color: var(--card-color);"
            data-repositioning-dropdown="true"
            data-testid="profile-preview-card">
            <div class="gap-4 grid">
              <div class="-mt-4">
                <a href="/erixero" class="flex">
                  <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0">
                    <img
                      src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3961631%2F3bda9bbb-8de7-466f-a410-f81e413413b6.jpg"
                      class="crayons-avatar__image"
                      alt=""
                      loading="lazy" />
                  </span>
                  <span class="crayons-link crayons-subtitle-2 mt-5">Erick Quinteros</span>
                </a>
              </div>
              <div class="print-hidden">
                <button
                  class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100"
                  data-info='{&quot;style&quot;:&quot;full&quot;,&quot;id&quot;:3961631,&quot;className&quot;:&quot;User&quot;,&quot;name&quot;:&quot;Erick Quinteros&quot;}'>
                  Follow
                </button>
              </div>
              <div
                class="author-preview-metadata-container"
                data-author-id="3961631"></div>
            </div>
          </div>
        </div>

      </div>
      <a href="https://dev.to/erixero/github-2ki3" class="crayons-story__tertiary fs-xs"><time datetime="2026-05-31T22:51:03Z">May 31</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1780267863"></span></a>
    </div>
  </div>

</div>

<div class="crayons-story__indention">
  <h2 class="crayons-story__title crayons-story__title-full_post">
    <a href="https://dev.to/erixero/github-2ki3" data-preload-image="" id="article-link-3791474">
      GitHub
    </a>
  </h2>
    <div class="crayons-story__tags">
        <a class="crayons-tag  crayons-tag--monochrome " style="
    --tag-bg: rgba(245, 77, 39, 0.10);
    --tag-prefix: #F54D27;
    --tag-bg-hover: rgba(245, 77, 39, 0.10);
    --tag-prefix-hover: #F54D27;
  " href="/t/git"><span class="crayons-tag__prefix">#</span>git</a>
        <a class="crayons-tag  crayons-tag--monochrome " style="
    --tag-bg: rgba(59, 73, 223, 0.10);
    --tag-prefix: #3b49df;
    --tag-bg-hover: rgba(59, 73, 223, 0.10);
    --tag-prefix-hover: #3b49df;
  " href="/t/versiones"><span class="crayons-tag__prefix">#</span>versiones</a>
        <a class="crayons-tag  crayons-tag--monochrome " style="
    --tag-bg: rgba(59, 73, 223, 0.10);
    --tag-prefix: #3b49df;
    --tag-bg-hover: rgba(59, 73, 223, 0.10);
    --tag-prefix-hover: #3b49df;
  " href="/t/distribuido"><span class="crayons-tag__prefix">#</span>distribuido</a>
        <a class="crayons-tag  crayons-tag--monochrome " style="
    --tag-bg: rgba(0, 0, 0, 0.10);
    --tag-prefix: #000000;
    --tag-bg-hover: rgba(0, 0, 0, 0.10);
    --tag-prefix-hover: #000000;
  " href="/t/github"><span class="crayons-tag__prefix">#</span>github</a>
    </div>
  <div class="crayons-story__bottom">
    <div class="crayons-story__details">
        <a href="https://dev.to/erixero/github-2ki3#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - GitHub">
          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ab991wpfkmyvtqtm8zy965u0ouhcg54o" class="crayons-icon"><title id="ab991wpfkmyvtqtm8zy965u0ouhcg54o">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg>

          <span class="hidden s:inline">Add Comment</span>
        </a>
    </div>
    <div class="crayons-story__save">
      <small class="crayons-story__tertiary fs-xs mr-2">
        3 min read
      </small>
        <button
          type="button"
          id="article-save-button-3791474"
          class="c-btn c-btn--icon-alone bookmark-button"
          data-reactable-id="3791474"
          data-article-author-id="3961631"
          aria-label="Save post GitHub to reading list"
          title="Save post GitHub to reading list">
          <span class="bm-initial">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg>

          </span>
          <span class="bm-success">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg>

          </span>
        </button>
    </div>
  </div>
</div>
    Enter fullscreen mode Exit fullscreen mode



Top comments (0)