https://github.com/icaro-freire/mementos_github

:octocat: Arquivando comandos que vou aprendendo no GitHub
https://github.com/icaro-freire/mementos_github

arquivamento commandos-github guia html latex latex-no-github markdown mementos

Last synced: 27 days ago
JSON representation

:octocat: Arquivando comandos que vou aprendendo no GitHub

• Host: GitHub
• URL: https://github.com/icaro-freire/mementos_github
• Owner: icaro-freire
• Created: 2020-11-12T03:16:56.000Z (about 4 years ago)
• Default Branch: master
• Last Pushed: 2021-10-08T20:18:54.000Z (over 3 years ago)
• Last Synced: 2024-11-11T03:12:57.576Z (3 months ago)
• Topics: arquivamento, commandos-github, guia, html, latex, latex-no-github, markdown, mementos
• Homepage:
• Size: 1.16 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


  

  


      Mementos do GitHub 

          


             (porque recordar é viver :sweat_smile:)

          

  




  

  

      

  

  

      

  

  

      

  





  

      

  



> `Mementos` significa "lembranças", "recordações". 

Esse repositório é para arquivamento de comandos do GitHub que vou usando durante o aprendizado. 

A ideia é organizar num único local para que eu possa acessá-los com facilidade.

Sumário

-------------------

   * [Colocando Imagem Inicial no README](#colocando-imagem-inicial-no-readme)

   * [Botões Estilizados (Badges)](#botões-estilizados-badges)

   * [Alinhamento e Dimensionamento de Imagem](#alinhamento-e-dimensionamento-de-imagem)

       - [Em Markdown](#em-markdown)

       - [Em Html](#em-html)

       - [Imagens por caminhos absolutos](#imagens-por-caminhos-absolutos)

   * [Escrevendo em LaTeX](#escrevendo-em-latex)

   * [Criando Árvore de Diretórios para o GitHub](#criando-árvore-de-diretórios-para-o-github)

   * [Usando o .gitignore](#usando-o-gitignore)

   * [Linha horizontal em Html](#linha-horizontal-em-html)

   * [Visualizando pdf](#visualizando-pdf)

       - [Com nbviewer](#com-nbviewer)

       - [Com GitHub Pages](#com-github-pages)

   * [Comentários em códigos](#comentarios-em-codigos)

       - [Um simples comentário](#um-simples-comentario)

       - [Comentar várias linhas](#comentar-varias-linhas)

   * [Texlo colapsado](#texto-colapsado)

---

# Colocando Imagem Inicial no README

Para colocar a imagem na página inicial de cada reposotório, no README.md, usa-se _html_:

```html



   

  


      Mementos GitHub

  

  


      (Recordar é viver :sweat_smile:)

  


```

# Botões Estilizados (Badges)

  - Para colocar os vários botões estilizados, pode ser usado o _site_ [shields.io](https://shields.io/);

  - Tal site pode sugerir os _badges_ ou podemos criar um;

     + Caso criemos um, uma imagem é gerada sem um link. Então, precisamos colocar `![url-da-imagem-gerada](link-desejado)`;  

  - Tenho percebido que o _Html_ facilita na hora da centralização dos objetos. 

Um repositório que contém muitas informações sobre customização de _badges_ é esse [daqui](https://github.com/alexandresanlim/Badges4-README.md-Profile).

# Alinhamento e Dimensionamento de Imagem

### Em Markdown

Para inserir uma imagem em markdown, basta fazer `![](caminho-da-imagem)`.

### Em Html

Para inserir e dimensionar, usamos:

```html



```

Obsservações

- `align` centraliza a imagem _inline_;

- `src` é o local onde inserimos a *url* onde está hospedada a imagem (numa pasta do repositório, por exemplo);

- `alt` é um nome que irá substituir (nome alternativo) a imagem, caso esta não seja carregada por algum motivo;

- `width` é a largura da imagem e *n* é um número inteiro.

- Além disso, todos esses comandos podem ser digitados na mesma linha, ou seja, caso ideal quanda a imagem (ou equação) estiver *inline*.

Pra deixar centralizada em relação à largura da margem do texto, usamos os comandos em _html_:

```html



  



```

### Imagens por caminhos absolutos

- É possível colocar as imagens, usando os diretórios do próprio GitHub.

    + isso evita quebra de _link_ quando pegamos de alguma `url`.

Para o `gif` a segui, o código foi:

```bash

![gato-felix](/figs/gato-felix.gif)

```

![gato-felix](/figs/gato-felix.gif)


Caso precise centralizar, é melhor usar _html_:

```html



   

   



# Escrevendo em LaTeX

Não consegui escrever diretamente no README usando o 

Para fazer isso, é preciso gerar um `html` num editor _online_ de LaTeX.

Particularmente, uso o [codecogs][CD].

[CD]: https://www.codecogs.com/latex/eqneditor.php?lang=pt-br

Por exemplo, se quero gerar a equação:



  



Usamos os comandos

```html



  



```

Mas, para gerar esses comandos, precisamos:

1. digitar a equação no _site_ [codecogs][CD];

2. verificar o tamanho adequado;

3. copiar o _link_ htlm gerado.


Como mostra a figura a seguir:



  



# Criando Árvore de Diretórios para o GitHub

- Uso o _site_ [tree](https://tree.nathanfriend.io/) para digitar meus diretórios de maneira bem simples.

- Depois copio o texto gerado pelo site;

- Por fim, colo aqui no README do GitHub.

Por exemplo, a árvore de diretórios desse repositório aqui mesmo, é dada por:

```bash

mementos_GitHub/

  .

  ├── figs/

  │   ├── codecogs.png

  │   └── fig-github.png

  └── README.md

```

Uma outra opção é usar o uma extensão para o editor [Vs Code](https://code.visualstudio.com/), denominada [file-tree-generator

][tree-file].

Com ela, a mesma árvore acima é dada por:


📦mementos_GitHub 

 ┣ 📂figs 

 ┃ ┣ 📜codecogs.png 

 ┃ ┣ 📜fig-github.png 

 ┗ 📜README.md 

 

 

 **Obs.:** o resultado deve estar dentro da _tag_ `
 ... 
`, para que seja mantido o alinhamento vertical.


[tree-file]: https://marketplace.visualstudio.com/items?itemName=Shinotatwu-DS.file-tree-generator

# Usando o .gitignore

- Para ignorar uma pasta, basta digitar no arquivo _.gitignore_: `nome-da-pasta/` 

- para ignorar arquivos: `*.extensao-do-arquivo` 

# Linha horizontal em Html

Para fazer uma linha horizontal, em _html_ usamos: `
` ou `
` ou `
`.


# Visualizando pdf

### Com nbviewer

- Abrir o *site* [https://nbviewer.jupyter.org/](https://nbviewer.jupyter.org/);

- Digitar o `url` (que está no GitHub) do pdf.

### Com GitHub Pages

Para usar a visualização direta do `.pdf` no próprio GitHub, precisamos ativar a *GitHub Pages*.

- Ir em `Settings`;

- Rolar até `GitHub Pages`;

  - Em *Source*, escolher o *Branch* adequado;

  - Escolher uma pasta adequada: pode ser a raiz (*root*) ou criar uma (geralmente *docs*);

  - Salvar;

  - Atualizar algumas vezes a página do seu projeto;

  - O *link* para o `.pdf` é: `https://seu-usuario.github.io/nome-do-projeto/nome-do-arquivo.pdf`

# Comentários em códigos

## Um simples comentário

Para um simples comentário, usamos a sintax:

```

"aqui deve conter uma linhas vazia"

[comentário]: # (escreva aqui seu comentário)

```

- Perceba que há um espaço entre `#` 

- Seu comentário deve estar entre parênteses;

- Deve conter uma linha vazia antes do comentário.

- Entre o colchete, pode vir qualquer texto (geralmente com o nome "comentário", para o identidicar)

## Comentar várias linhas

Para comentar várias linhas, usamos a sintax:

```html

```

# Texto colapsado

A *tag* ` ... ` colapsa um texto longo dentro de um tópico destacado (fazemos esse destaque no tópico com a *tag* ` ... `).

  

    Tópico 01

  

    Texto longo sobre o tótico 01 ...

  

    Tópico 02

  

    Texto longo sobre o tótico 02 ...

    

      

        Subtópico 2.1

      

        Pode fazer subtópicos também!

    

A ideia acima foi gerada com:

```html

  

    Tópico 01

  

    Texto longo sobre o tótico 01 ...

  

    Tópico 02

  

    Texto longo sobre o tótico 02 ...

    

      

        Subtópico 2.1

      

        Pode fazer subtópicos também!

    

```