Como trabalhar com o Markdown com sabor do Github no Linux

Como trabalhar com o Markdown com sabor do Github no Linux

Markdown é uma linguagem de formatação criada para a web. O objetivo do Markdown é facilitar a vida quando estamos escrevendo na Internet. Com o tempo, existem muitos sabores de marcha. Mas neste artigo, nosso foco será principalmente no Markdown com sabor do GitHub (GFM).

Github é baseado em Commonmark. Existem muitos recursos adicionais suportados na GFM, como tabelas, cercas de código, etc. Vamos entrar e explorar a sintaxe para GFM e como usá -la em diferentes casos.

Estou usando o vscode para demonstrar isso, mas você pode escolher qualquer editor Linux que seja adequado para você. Alguns editores como Atom e VScode vêm com suporte de remarca e, para alguns editores, precisamos instalar um plug -in de marcação.

Para trabalhar com o Markdown, o arquivo deve ser salvo .MD ou .Markdown como uma extensão.

Como adicionar títulos ao editor de Markdown

6 níveis de cabeçalho suportado no Markdown. Para criar um título, use o hash (#) símbolo seguido de um espaço e nome do cabeçalho. Maior o valor do hash diminuir o tamanho do cabeçalho.

OBSERVAÇÃO: H1 e H2 terá um estilo sublinhado por padrão.

#Heading1 ## Heading2 ### Heading3 #### Heading4 ##### heading5 ###### tabela 6 
Adicione títulos

Às vezes você pode querer alinhar o caminho em direção ao centro. Mas a triste história é o alinhamento não é suportado por padrão no Markdown. Por padrão, os títulos são renderizados com o alinhamento esquerdo. Você pode incorporar tags HTML/CSS no Markdown para obter alinhamento.

Markdown

Markdown

Markdown

Markdown

Alinhamentos de títulos

Como adicionar comentários ao editor de Markdown

Os comentários são uma maneira de documentar certas coisas para uma melhor compreensão do código/documentos. Isso não será renderizado pelo mecanismo de Markdown.

 
Adicione comentários ao editor

Como renderizar o texto como uma única linha

Normalmente, quando você digita algo em linhas separadas uma após outra marcação, a renderá como uma única linha.

Texto em linha única

Você pode criar quebras de linha de duas maneiras.

  • Quebra de linha suave
  • Quebra de linha dura

Quebras de linha suave pode ser criado adicionando dois espaços no final da linha. Dessa forma, o Markdown renderizará cada linha para ser linhas separadas.

Quebra de linha suave

Breaks de linha dura pode ser criado inserindo uma linha vazia entre cada linha.

Quebra de linha dura

Como adicionar linhas horizontais

O Regra horizontal pode ser criado colocando três ou mais asteriscos (*), hífens (-), ou sublinhado (_) em uma única linha. Também é bom adicionar espaço entre eles.

* * * --- ___ 
Adicione linhas horizontais

Como fazer um texto ousado

Para fazer palavras ou linhas AUDACIOSO, cercar a palavra ou linhas entre asteriscos duplos (**) ou sublinhado duplo (__).

** Tornando esta frase ousada usando asteriscos duplos.** __king esta frase em negrito usando sublinhado duplo.__ 
Ousada uma linha ou texto

Como fazer um texto em itálico

Para fazer palavras ou linhas Itálico, cercar a palavra ou linhas entre asteriscos únicos (*) ou sublinhado único (_).

*Fazendo esta linha a ser em itálico usando asteriscos.* _Manando esta linha a ser em itálico usando sublinhado._ 
Faça texto em itálico

Como adicionar uma greve às linhas

Para atingir qualquer coisa que você tenha que usar um duplo tilde. Cercada o que você precisar para atacar entre tildas duplas (~~).

Estou apenas impressionando a palavra ~~ Olá ~~. ~~ Estou impressionando toda a linha.~~ 
Adicione a greve às linhas

Como adicionar um blockQuote

Use maior que um símbolo (>) para BlockQuote.

> Bloco de linha única. 
Citação de linha única

Veja como a cotação do bloco abaixo é renderizada. Ambas as linhas são renderizadas na mesma linha.

> Primeira linha> Segunda linha> Terceira linha> Quarta linha 
Várias citações de linha

Você pode usar o retorno da linha deixando dois espaços no final de cada linha. Dessa forma, cada linha não será renderizada em uma única linha.

Render citação em linha única

Deixe as linhas alternativas vazias prefixadas por maior que um símbolo. Dessa forma, você pode criar uma quebra de linha entre cada linha dentro do mesmo bloco.

> Primeira linha >> Segunda linha >> Terceira linha >> Quarta linha 
Adicione quebra de linha

Você também pode criar cotações de blocos aninhadas, adicionando dois maiores que os símbolos (>>).

Citações de blocos aninhados

Crie código embutido

Usar Backtick Para fazer código embutido. O exemplo abaixo demonstra como criar código embutido. Veja as Notas e Readme que foram renderizados como código embutido.

Markdown é uma das melhores ferramentas para fazer 'Notas' e criar arquivos 'Readme'. 
Adicionar código embutido

Adicione o destaque da sintaxe do bloco de código

Adicione guias ou 4 espaços e coloque seu código para renderizá -lo como um bloco de código. Como alternativa, coloque seu código entre três backsticks para fazer o bloco ser renderizado como um bloco de código. A característica importante a ser observada aqui é o destaque da sintaxe. Normalmente, quando você coloca o código dentro do bloco, não há esquema de cores aplicado a ele.

"Echo" Hello World ""

Agora veja o mesmo exemplo, o esquema de cores é aplicado automaticamente. Isso é possível adicionando o nome da linguagem de programação após três backsticks que aplicarão o esquema de cores ao código.

"Bash Echo" Hello World ""
Realce de sintaxe

Amostra de código python.

"Python def fp (): print (" Hello World!!!") fp ()"
Código Python

Amostra de consulta SQL.

"SQL Selecione Max (Salary_EMP) de Employee_table Where Salary_emp<(SELECT MAX(SALARY_EMP) FROM EMPLOYEE_TABLE)"
Código de consulta SQL

Crie listas ordenadas e não ordenadas

Os itens podem ser organizados em listas ordenadas e listas não ordenadas no Markdown. Para criar uma lista ordenada, adicione números seguidos por um período. A parte interessante a ser observada aqui é o número não precisa ser seqüencial. O mecanismo de marcação é inteligente o suficiente para entender que é uma lista ordenada, mesmo se fizermos o pedido não sequencial.

No exemplo abaixo, você pode ver que eu criei uma lista ordenada com pedidos não sequenciais (10, 15, 150), mas o mecanismo de marcação o renderiza em ordem adequada. Você também pode criar uma lista aninhada, como mostrado na imagem.

Criar lista ordenada

Para criar uma lista não ordenada, use mais sinal (+) asteriscos (*) ou traço (-) seguido de um espaço e conteúdo da lista. Semelhante à lista ordenada, você também pode criar uma lista aninhada aqui.

Crie uma lista não formada

Crie lista de tarefas

Este é um recurso especial do GFM. Você pode criar uma lista de tarefas como mostrado na imagem abaixo. Para marcar a tarefa como concluído, você deve adicionar 'x' entre aparelho quadrado, como mostrado na imagem.

Crie lista de tarefas

Adicione links ao texto

Para adicionar um link, siga a sintaxe abaixo.

[Tecmint] (https: // Tecmint.com "O melhor site para Linux") 

Vamos quebrar a sintaxe em 3 partes.

  • Texto a ser exibido - Este é o texto que será colocado dentro do aparelho quadrado ([Tecmint]).
  • Link - Você colocará o link real dentro do parêntese.
  • Título - Quando você passa o mouse sobre o texto, ele mostra uma dica de ferramenta para o link. O título deve ser colocado dentro das citações, como mostrado na imagem.

Da imagem abaixo, você pode ver “Tecmint”É o meu texto de exibição e quando eu clicar que ele vai me redirecionar para“Tecmint.com”.

Adicione o link ao texto

Você também pode criar links colocando -os dentro de suportes de ângulo .

Crie links de texto

Adicione links para imagens

A sintaxe para a imagem é semelhante a adicionar links. Para adicionar uma imagem, siga a sintaxe abaixo.

![BrokenImage] (https: // www.Bing.com/th?id = amms_ff6f3f7a38b5544421b6e614be6e44912 & w = 110 & h = 110 & c = 7 & rs = 1 & qlt = 80 & pcl = f9f9f9 & cdv = 1 & dpr = 1.25 & PID = 16.1 "Logotipo de Markdown") 

Vamos quebrar a sintaxe em 3 partes.

  • Texto alternativo - Texto alternativo será colocado entre colchetes (![texto alternativo]). Se uma imagem estiver quebrada ou não é capaz de carregar este texto será exibida junto com um símbolo quebrado.
  • Link - Dentro dos colchetes, você colocará o link real para a imagem.
  • Título - Quando você passa o mouse sobre a imagem, ele mostrará o nome da imagem. O título deve ser colocado dentro das citações, como mostrado na imagem.
Adicione o link à imagem

Você também pode criar um link com imagens. Quando um usuário clica na imagem, será redirecionado para um link externo. A sintaxe permanece a mesma com poucas modificações. Cercando a mesma sintaxe que usamos para inserir uma imagem em suportes quadrados seguidos de um link dentro dos parênteses.

[[![BrokenImage] (https: // www.Bing.com/th?id = amms_ff6f3f7a38b5544421b6e614be6e44912 & w = 110 & h = 110 & c = 7 & rs = 1 & qlt = 80 & pcl = f9f9f9 & cdv = 1 & dpr = 1.25 & PID = 16.1 "logotipo de marcação")] (https: // pt.Wikipedia.org/wiki/markdown) 

Crie uma tabela

Mesas não são suportados no sabor original do Markdown. É uma das características especiais que vêm com GFM. Vamos ver como construir uma mesa de uma maneira passo a passo.

A primeira parte é criar nomes de colunas. Os nomes de colunas podem ser criados separando -os com tubos (|).

| Funcionário_name | Funcionário_age | Funcionário_id | 

Na segunda linha, use traços (-) em combinação com um cólon (:). Dashes diz ao mecanismo de marcação que isso deve ser renderizado como uma mesa e o cólon decide se nosso texto deve ser central, esquerdo ou alinhado à direita.

| Funcionário_name | Funcionário_age | Funcionário_id | |: -------------: |: -------------- | ------------: | : ---: ⇒ alinhamento central: --- ⇒ alinhamento esquerdo ---: ⇒ alinhamento direito 

Na terceira linha, você pode começar a criar registros. Os registros devem ser separados por um tubo (|).

| Funcionário_name | Funcionário_age | Funcionário_id | |: -------------: |: -------------- | ------------: | | Ravi | 30 | 127 | | Karthick | 27 | 128 | 
Crie a tabela em Markdown

Da imagem acima, você pode ver que a tabela é renderizada corretamente. A coluna 1 está alinhada central, as colunas 2 e 3 são deixadas e alinhadas à direita. Se você está usando Vscode, Você pode usar a “tabela de marcha em marcha ao formato para formatar a tabela cuidadosamente.

Crie um emoji

A GFM suporta uma ampla gama de emojis. Dê uma olhada na folha de dicas emoji.

Adicione emoji em Markdown

É isso para este artigo. Se você tiver algum feedback, poste -o na seção de comentários.