Como criar um README dinâmico usando Javascript

올라! Você já pensou como seria poder gerar um README dinamicamente para aquele seu projeto do GitHub?
Eu já, mas nunca pensei em como funcionaria... até eu pesquisar se era possível e acabar me surpreendendo.

Depois de algumas pesquisas descobri uma feature do do GitHub chamada "GitHub Actions", e ela consegue executar um código que você especificar, em diversas situações como: após um push, pull-request, e até mesmo em um intervalo especificado. Isso era justamente o que eu precisava, e com essa feature em mãos comecei a escrever meu Javascri- calma...

...Como isso é um guia, melhor eu documentar como fiz e como você também pode fazer e utilizar de diversas maneiras como quiser. Então vamos começar pelo começo:

1. 크리안도 우마 베이스



Gerar um markdown direto do Javascript não é tão prático assim, pois para visualizar você precisaria executar o Javascript, e repetir isso para cada mudança definitivamente não é viável a longo prazo(vamos ignorar o nodemon). 이것은 마크다운을 기반으로 하는 문서를 추천하고, Javascript를 사용하여 수정하고, 완료할 때까지 사용할 수 있습니다.

예를 들어, 최종적으로 GitHub와 Disponibilizarei는 블로그에 새로운 저장소를 추가했습니다. Então vamos começar por essa base em markdown(que nomeei como "readme_base"), definindo nela as informações que serão fixas, e quais serão geradas:

# %{titulo}
Eu coloquei o titulo dentro de `%{}` apenas para evitar que
haja alguma ambiguidade com textos comuns.

Todas as partes desta base podem ser manipuladas e modificadas,
por exemplo aqui eu irei inserir uma lista de nomes:
%{listaDeNomes}}


2. 베이스 수정



Para testamos se está tudo funcionando, vamos criar um arquivo em Javascript, no qual noearei como "index.js", para modificar a base:

/* o fs é quem irá ler o arquivo e gerar um novo,
ele vem por padrão no node, então não se preocupe */
const fs = require('fs')

// esta parte lê o arquivo "README_BASE"
fs.readFile('README_BASE.md', 'utf-8', (err, data) => {
    if (err) {
        throw err;
    }

/* aqui é onde acontecem as substituições, por exemplo
substituindo %{titulo} por "Dynamic Readme" */
    const substituicoes = {
        titulo: 'Dynamic Readme',
        listaDeNomes: `- Carlos\n- Ana\n- Sérgio`
    }

/* aqui é o que verifica e executa as substituições, um
regex bem simples com object literals, não precisa mexer aqui */
    const modificado = data
        .replace(
            /%{.*}/gm,
            e => substituicoes?.[e.slice(2, -1)] || e
        )

/* após ter feito as mudanças ele cria um arquivo
chamado "README.md" com a nova versão */
    fs.writeFile('README.md', modificado, 'utf-8', (err) => {
        if (err) {
            throw err;
        }
        console.log('✔ Processo finalizado!');
    });
});


노드를 통해 코드를 실행하려면 다음과 같이 추가로 신타-세 리브르를 수행해야 합니다.

3. 프로세스 자동화



"Mas isso apenas gerou o arquivo pois fui eu quem iniciou o javascript, então para executar esse processo automaticamente eu precisaria de um host?"



Felizmente não, pois no caso do GitHub ele disponibiliza o github actions no qual eu havia falado. Ela permite que o processo rode em diversas circunstâncias, e no caso deste exemplo usarei o schedule que permite que o código seja executado a cada intervalo especificado.

Para isso iremos criar uma 파스타 chamada .github , e dentro dela uma outra chamada workflows , com um arquivo main.yaml .
이력서: .github/workflows/main.yaml .

no arquivo main.yaml é onde diremos ao github quando, como e o quê rodar.

# Nome do processo
name: Update automático

on:
  schedule:
    # cron é o "intervalo" de execução, recomendo usar
    # o site crontab.guru para lhe ajudar a definir.
    # nesse caso aqui, ele irá rodar a cada 10 minutos.
    - cron: '*/10 * * * *'

# Aqui vem os passos que a ação segue
jobs:
  build:
    # Inicia uma máquina virtual ubuntu
    runs-on: ubuntu-latest

    # Checa o código atual do repositório
    steps:
    - name: Checkout repo
      uses: actions/checkout@v2

    # Instala o node na versão 16.10
    - name: Use Node.js
      uses: actions/setup-node@v1
      with:
        node-version: 16.10
    - run: npm install
    - run: npm run build --if-present
      env:
        CI: true

    # Aqui em index.js você insere
    # o nome do seu arquivo javascript
    - name: Roda o arquivo
      run: |-
        node index.js
        cat README.md

    # E no final commita e faz um push caso haja alguma diferença
    # comparada ao código atual do repositório
    - name: Commit e push
      run: |-
        git diff
        git config --global user.email "[email protected]"
        git config --global user.name "bot automático"
        git add -A
        git commit -m "Arquivo atualizado!" || exit 0
        git push


Com isso feito, sua pasta/repositório deve estar mais ou menos assim:

> .github
  > workflows
    > main.yaml
> index.js
> readme_base.md
> README.md (gerado)


Se estiver assim, perfeito, tá tudo certo. Casos os nomes estejam diferentes ou não tenha gerado o README ainda, tá tudo bem também.

GitHub를 사용하려면 10분 안에 저장소를 확인해야 합니다. O GitHub Actions nem semper é immediato, algumas vezes leva mais tempo do que o especificado. 예를 들면 테스트 저장소가 없습니다.

Você pode acompanhar as actions por aqui, semper que uma for executada ela irá aparecer:


E falando no repositório, aqui está o link pra ele: Dynamic Readme . Se quiser pode fazer um fork e modificar ou seguir este tutorial, como preferir.

4. 오 최종



오빠! Gostou 블로그를합니까? É o meu primeiro, mas tentei deixar ele completo e simples de se entender, espero ter conseguido ^^.

E não pensa que dá pra fazer só essas coisinhas de trocar texto por texto não! 번호 meu readme eu fiz uma seção que atualiza mostrando minhas atividades mais latestes, e até gera uma imagem utilizando api do github para pegar um seguidor aleatório meu!


Tô ansioso pra ver o que vocês também conseguem criar.
Me marca no Twitter caso faça algo bacana com isso. 인테!

좋은 웹페이지 즐겨찾기