1
0
Fork 0

tarefas aula remota

This commit is contained in:
grz 2024-05-02 19:34:36 -03:00
parent 79f2a68a43
commit e87694bf11
9 changed files with 472 additions and 1 deletions

View File

@ -0,0 +1,110 @@
[Índice](README.md)
# Atualizar o repositório no Codeberg
Para atualizarmos nosso repositório de código remoto, que está armazenado no Codeberg, vamos usar dois novos comando do GIT: <code>commit</code> e <code>push</code>.
## Commit e Push
O processo de envio de atualizações para o repositório remoto é chamado <code>push</code> (que literalmente significa 'empurrar' mas, neste contexto, o sentido é de 'enviar').
Esse *push* só pode acontecer após uma etapa preliminar chamada <code>commit</code> (que literalmente significa 'comprometer-se').
O processo de *commit* diz ao GIT que as mudanças que fizemos em um arquivo devem ser levadas ao repositório na próxima vez que um *push* for executado. Isto é, estamos dizendo que estamos nos 'comprometendo' com estas mudanças ao ponto de que elas já podem ser publicadas no repositório principal.
## Passos para commit (VSCodium)
1. <kbd>Ctrl+Shift+G</kbd> Para mudar para a aba com as operações do GIT. Note que o painel da esquerda mudou.
<figure>
<img src="img/vscodium/vscodium-painel-git.png" />
<figcaption style = "text-align: center">Painel com operações do GIT </figcaption>
</figure>
Aqui você está vendo uma lista com todos os arquivos que podem ser adicionados à lista de arquivos de uma operação de commit.
O VSCodium usa uma letra para indicar em que estado está o arquivo que pode ser adicionado.
Um arquivo pode entrar em um commit quando:
- <code>U</code> - o arquivo for novo e o GIT ainda não está rastreando ele (U de 'Untracked' que significa 'não rastreado')
- <code>M</code> - o arquivo teve seu conteúdo modificado (M de 'Modified')
- <code>D</code> - o arquivo foi deletado (D de 'Deleted')
No caso, todos os arquivos são novos e o GIT ainda não está observando as mudanças que ocorrem neles. Para o GIT começar a cuidar essas mudanças precisamos fazer adicionar esses esses arquivos à lista de arquivos do GIT e fazer um primeiro commit.
Para isso, vá com o mouse até o nome do arquivo <code>index.html</code> e clique no sinal de <code>+</code> que vai aparecer.
<figure>
<img src="img/vscodium/vscodium-stage-changes.png" />
<figcaption style = "text-align: center">Botão para adicionar um arquivo na lista de commit</figcaption>
</figure>
Observe que o arquivo <code>index.html</code> agora está com o sinal <code>A</code> que significa 'Added' (adicionado). Isso é porque ele foi adicionado à lista de arquivos para o próximo commit. Antes de fazer esse commit, termine de adicionar os outros dois arquivos.
<figure>
<img src="img/vscodium/vscodium-staged-changes.png" />
<figcaption style = "text-align: center">Botão para adicionar um arquivo na lista de commit</figcaption>
</figure>
Agora você precisa escrever uma <code>mensagem de commit</code>. É um passo **obrigatório** e serve para documentar o seu projeto.
Esta deve ser uma mensagem curta dizendo o que mudou nesse arquivo. Uma linha e nada mais. Ela é escrita na caixa de texto acima do botão azul chamado "Commit".
Como esta é a primeira vez que estamos fazendo commit destes arquivos, nada mudou e não temos nada para escrever na mensagem. Nesses casos, costumamos escrever simplesmente "Primeiro commit". Observe a figura:
<figure>
<img src="img/vscodium/vscodium-primeiro-commit.png" />
<figcaption style = "text-align: center">Mensagem de commit</figcaption>
</figure>
Clique no botão azul "Commit" e pronto. Commit feito. Agora passamos para o "Push", para enviar os arquivos ao Codeberg.
## Passos para o push
Depois de feito o commit, você vai ver que o botão azul mudou para "Sync changes", que significa "Sincronizar mudanças".
Note que que há uma seta apontando para cima. Isso significa que existem mudanças para "subir" para o servidor. Essa é a operação de "push" que queremos fazer.
<figure>
<img src="img/vscodium/vscodium-push.png" />
<figcaption style = "text-align: center">GIT pronto para operação de 'push'</figcaption>
</figure>
Clique no botão azul para iniciar o push.
O VSCodium vai mostrar uma caixa de confirmação alertando que esta operação vai enviar modificações para o servidor (operação de 'push') e também baixar modificações que forem encontradas nos arquivos que estão lá (operação chamada de 'pull').
Você pode escolher a opção <kbd>Ok, don't show again</kbd>, que quer dizer "Ok, e não mostre de novo".
<figure>
<img src="img/vscodium/vscodium-push-ok-dont-show-again.png" />
<figcaption style = "text-align: center">Caixa de confirmação da operação de sync</figcaption>
</figure>
Agora você precisa digitar seu nome de usuário e senha da sua conta no Codeberg. Isso é necessário para garantir a segurança e integridade dos dados do seu repositório. Senão, todo mundo que fizesse um clone do seu repositório poderia alterar o conteúdo dele sempre que quisesse.
No Linux e no Windows o modo de o VSCodium pedir o nome de usuário e a senha é diferente. Abaixo você tem um exemplo da interface do Linux
<figure>
<img src="img/vscodium/vscodium-push-username.png" />
<figcaption style = "text-align: center">Digitação do nome de usuário do repositório remoto (usuário da sua conta no Codeberg)</figcaption>
</figure>
<figure>
<img src="img/vscodium/vscodium-push-password.png" />
<figcaption style = "text-align: center">Digitação da senha do repositório remoto (senha da sua conta no Codeberg)</figcaption>
</figure>
No Windows vai ser aberta uma janela de um gerenciador de senhas, fora do VSCodium.
Pronto. Agora seu repositório remoto está atualizado. Para conferir, acesse o URL do seu repositório no Codeberg e veja que os arquivos novos estão lá.
Se os arquivos não estiverem lá, volte e confira os passos todos.
[Índice](README.md)

41
GIT-Criar-ramo.md Normal file
View File

@ -0,0 +1,41 @@
[Índice](README.md)
# Criar um ramo de desenvolvimento (branching)
Com o GIT podemos controlar não apenas as versões dos arquivos do nosso projeto que estão no diretório de trabalho principal mas também criar versões alternativas para nosso projeto, que são novas linhas de desenvolvimento, muitas vezes usadas para experimentar ideias ou iniciar um novo projeto a partir do que já temos, sem para isso criar um novo diretório ou repositório.
Um <code>ramo</code> é uma espécie de "diretório virtual" com arquivos de nosso projeto e é como chamamos uma "linha de desenvolvimento" do projeto. Os arquivos que estão em ramo fazem parte da linha de desenvolvimento desse ramo.
Existe sempre a linha principal (por padrão, chamada de "main", que significa "principal") e outras possíveis linhas, cada uma com o nome que quisermos dar a elas.
O processo de criar um novo ramo em um repositório GIT é chamado de <code>branching</code>, que significa <code>ramificação</code>.
No VSCodium, o ramo de desenvolvimento atual aparece no canto inferior esquerdo da janela. Agora, o nome dele é <code>main</code>.
Para criar um novo ramo (observe as imagens abaixo):
1. clique em <code>main</code> (canto inferior esquerdo da janela, onde está o mouse)
2. No menu que se abriu no topo da janela, ao centro, escolha a opção <code>Create new branch...</code> (Criar novo ramo).
<figure>
<img src="../img/vscodium-create-branch.png" />
<figcaption style = "text-align: center">Criar um novo ramo</figcaption>
</figure>
<figure>
<img src="../img/vscodium-create-new-branch-pages.png" />
<figcaption style = "text-align: center">Dar um nome ao novo ramo - este vai se chamar <code>pages</code></figcaption>
</figure>
3. Observe no canto inferior esquerdo da janela que o ramo de desenvolvimento atual agora é <code>pages</code> e que todos os arquivos que estavam em <code>main</code> estão também neste novo ramo.
Parece que não mudou muita coisa, só que sim. A partir de agora, podemos fazer mudanças nos arquivos que estiverem em <code>pages</code> sem afetar os arquivos que estão no ramo <code>main</code>! Inclusive, podemos ter arquivos em um ramo que não existem no outro.
## Atualizar e publicar ramo
Agora precisamos atualizar o repositório no Codeberg, pois as mudanças que fizemos ainda estão apenas em nosso computador.
Siga as instruções para [Publicar ramo](GIT-Publicar-ramo.md).
[Índice](README.md)

16
GIT-Publicar-ramo.md Normal file
View File

@ -0,0 +1,16 @@
[Índice](README.md)
# Publicar ramo
Primeiro, faça os commits normalmente.
Depois, no canto inferior esquerdo, ao lado do nome do ramo atual, você vai ver o botão de publicar ramo.
<figure>
<img src="../img/vscodium-publish-branch.png" />
<figcaption style = "text-align: center">Botão "publish branch" (publicar ramo) é a núvem com a seta para cima
</figure>
Clique nele para enviar ao codeberg o novo ramo.
[Índice](README.md)

114
GIT-clonar-repositorio.md Normal file
View File

@ -0,0 +1,114 @@
[Índice](README.md)
# Clonar o repositório no seu computador de trabalho
Clonar é fazer uma cópia idêntica de um repositório salvando todos os arquivos em um outro local - normalmente em outro computador. No nosso caso, vamos copiar o repositório que acabamos de criar todinho para dentro do nosso computador de trabalho.
Clonar serve para que possamos fazer modificações nos arquivos (criar novos, alterar conteúdo de arquivos existente, apagar arquivos...) sem modificar diretamente o repositório principal, que é o que está publicado no codeberg.
Isso ajuda a organizar o trabalho (no nosso computador ficam os testes, os trabalhos pela metade, e também os trabalhos já prontos para publicar) e no servidor (o codeberg) ficam apenas os arquivos e partes do programa (ou site, ou documento...) que estão bons para serem usados.
## Clonar o repositório usando a linha de comando
Para clonar o repositório que você acabou de criar você pode usar o GIT em linha de comando (`CMD`, no Windows, `terminal` no Mac ou Linux) ou pode fazer tudo de dentro do `VisualStudio Code`.
Para clonar o repositório usando a linha de comando, começe abrindo o terminal que dá acesso à linha de comando.
Quando clonarmos o repositório, será criado um novo diretório em nosso computador que terá o mesmo nome do repositório.
> Por isso é importante cuidar para que não exista um diretório com o mesmo nome do repositório no diretório atual quando você executar o comando de clonagem.
Suponha que estamos usando o Windows e que o diretório atual seja `C:\Users\gustavo`. O prompt de comando vai aparecer assim:comando, digite:
```
C:\Users\gustavo>
```
Para evitar que haja um diretório com o mesmo nome do nosso repositório, nós vamos:
- criar um novo diretório
- mudar para esse diretório (entrar no diretório)
- clonar o repositório nesse diretório
> O prompt de comando nos exemplos a seguir está abreviado. Não estou usando o caminho completo nem outros sinais, apenas o sinal `$`, que é uma forma genérica de indicar que o computador está pronto para receber um comando. Você deve digitar o que vem após o sinal de prompt.
1. Crie um novo diretório chamado `repos` (abreviatura de "repositórios")
``` bash
$ mkdir repos
```
2. Entre no diretório `repos`
``` bash
$ cd repos
```
O prompt vai indicar que agora o diretório `repos` é o diretório de trabalho. Por exemplo:
```
repos$
```
3. Clone o repositório usando GIT. Para isso você precisa da URL de clonagem do seu repositório. Você encontra ela na página do seu repositório no Codeberg. Essa página é a página que se abriu logo após a criação do repositório.
> Caso você tenha mudado de página ou tenha fechado a janela sem querer, a URL que você precisa para o comando de clonagem é formada segundo a seguinte sintaxe:
```
https://codeberg.org/usuario/nome_repositorio.git
Onde:
usuario - nome de seu usuário no codeberg
nome_repositorio - nome do seu repositorio
* Observe a extensão .git após o nome do repositório *
```
Por exemplo. **Este é o comando para clonar o repositório** <kbd>iprog5750</kbd> do usuário <kbd>grz</kbd>.
``` bash
repos$ git clone https://codeberg.org/grz/iprog5750.git
```
Após esse comando, você vai ver algumas mensagens do GIT e, por fim, o prompt de comando novamente. Como no exemplo abaixo:
``` bash
Cloning into 'iprog5750'...
remote: Enumerating objects: 4, done.
remote: Counting objects: 100% (4/4), done.
remote: Compressing objects: 100% (3/3), done.
remote: Total 4 (delta 0), reused 0 (delta 0), pack-reused 0
Unpacking objects: 100% (4/4), 862 bytes | 862.00 KiB/s, done.
repos$ _
```
Confira se a clonagem deu certo listando o diretório
No Linux/MacOS
``` bash
repos$ ls -l
```
No Windows
``` cmd
repos$ dir
```
Deve aparecer uma listagem contendo um diretório que tem o nome do seu repositório.
Esse diretório é uma cópia do repositório. Confira se os arquivos estão lá digitando
``` bash
repos$ ls -l iprog5750
```
> Substitua <kbd>ls -l</kbd> por <kbd>dir</kbd> se você estiver no Windows e substitua o nome do diretório pelo nome do seu repositório.
Tudo deve estar lá e tudo deve ter dado certo. Se algo não funcionou, volte e confira os passos.
[Índice](README.md)

View File

@ -0,0 +1,28 @@
[Índice](README.md)
# Configurar nome e email do usuário local do repositório
Para usarmos em nosso computador um repositório que acabamos de clonar, precisamos configurar um nome de usuário e um email que serão usados a cada *commit* e a cada vez que enviarmos ao Codeberg (computador remoto) atualizações dos arquivos modificados por nós (computador local).
1. Mude para o diretório do repositório. Supondo que você ainda esteja no diretório `repos` que criamos, digite:
``` bash
repos$ cd iprog5750
```
Agora o prompt deve indicar que o diretório atual é `iprog5750` (ou, o nome que você deu ao seu repositório).
2. Configure o nome do seu usuário local, usando o nome de seu usuário do Codeberg ao invés de <kbd>grz</kbd>, como está no exemplo.
``` bash
iprog5750$ git config --local user.name grz
```
3. Configure o endereço de email do usuário local, substituindo o endereço de email pelo endereço de email que você usou para criar a sua conta de usuário no Codeberg.
``` bash
iprog5750$ git config --local user.email grzzr@duck.com
```
Pronto. Agora já podemos começar a trabalhar.
[Índice](README.md)

View File

@ -0,0 +1,53 @@
[Índice](README.md)
# Git - Criar um repositório no Codeberg
Para começar vamos criar um repositório GIT no [codeberg](https://codeberg.org) para armazenar os nossos arquivos e controlar o desenvolvimento do site.
Você já tem uma conta no [codeberg](https://codeberg.org), que foi criada em aula.
Para criar um repositório GIT no codeberg siga os links abaixo e as instruções a seguir:
1. faça [login no codeberg](https://codeberg.org/user/login)
2. clique em [create... new repository](https://codeberg.org/repo/create)
![página do codeberg: new repository](img/git/codeberg-new-repository.png)
Na página de criação de repositório que se abriu, preencha as informações solicitadas assim:
1. `Owner` - esse é o nome do dono do repositório - deve já estar preenchido com o nome do seu usuário, então, deixe assim.
2. `Repository name` - é o nome do repositório. Vou usar <kbd>iprog23</kbd> durante os exemplos, mas escolha o nome que você quiser.
> **Instruções para nome do repositório**: O repositório pode ter qualquer nome, desde que respeite as regras de nomenclatura do codeberg e as boas práticas para nomeação de repositórios de código. Basicamente, *escolha um nome curto que não contenha caracteres especias* (tipo, espaço em branco, ponto e acentos).
3. `Visibility` - É a visibilidade que o repositório terá na internet. Ele pode ser <kbd>público</kbd> (todos podem acessar e clonar) ou <kbd>privado</kbd> (apenas você terá acesso). Escolha <kbd>público</kbd>, para que eu e seus colegas possam acessá-lo. Para isso, basta não selecionar a caixa de seleção. Deixe ela como ela está.
4. `Description` - É uma descrição opcional e curta (1 linha está ótimo) do conteúdo do repositório
5. `Template` - Você pode criar este repositório copiando o modelo (em inglês, "template") de um outro repositório que você ou outra pessoa já tenha feito. Como este não é o caso, deixe em branco.
6. `Issue labels` - São rótulos usados para o rastreamento de pendências (tarefas por fazer) do repositório. Não vamos usar esse recurso neste projeto e, por isso, deixe em branco também.
7. `.gitignore` - é um arquivo de texto, chamado `.gitignore` que contém uma lista de arquivos e diretórios em seu repositório a serem ignorados pelo GIT. Isso significa que todos os arquivos e diretórios que estiverem listados nesse arquivo não serão rastreados nem controlados pelo GIT. Em consequência disso, também não serão armazenados no repositório. Deixe em branco porque não vamos precisar desse arquivo neste projeto.
8. `License` - Esta é a licença de uso que você concede a todos que acessarem seu repositório.
> **Licenças**: Sugiro que seja a [MIT](https://choosealicense.com/licenses/mit/), que basicamente dá licença para que possamos fazer o que quiser com o código, inclusive copiar, modificar, distribuir, usar pedeços dele em outros projetos e até comercialmente (o que não é nosso caso), desde que a licença (que inclui o seu nome no copyright) seja distribuída junto com os trabalhos derivados.
9. `README` - Opção pra criar um arquivo `README` automaticamente. Escolha a oção <kbd>Default</kbd>.
10. `Initialize repository (Adds .gitignore, Licence and README)` Sim. Deixe essa caixa de verificação selecionada. Isso vai fazer o codeberg copiar os arquivos `.gitignore`, `README` e o da licença para dentro do seu repositório. Assim, quando ele for criado já vai ter um conteúdo inicial.
> Atenção para esse passo 10! Se você sem querer desselecionar essa caixa de verificação vai ter mais trabalho adiante para inicializar seu repositório. Neste roteiro não constam as instruções para fazer essa inicialização manualmente.
11. `Defaul branch` - Nome do ramo de desenvolvimento padrão. Conforme vimos em aula, o GIT pode controlar diversas linhas de desenvolvimento (versões do seu projeto) e cada uma delas terá um nome. Aqui você deve dizer qual o nome da principal. Normalmente usamos o nome `main` que significa "principal" em inglês. Então, deixe assim como está.
12. `Signature Trust Model` - Esta é uma opção útil para quem vai assinar criptograficamente os commits feitos no repositório. Não é o nosso caso agora. Por isso, deixe assim como está.
13. `Template` - Esta opção permite que você salve suas opções de criação de repositório para reutilizá-las em outros repositórios. Não precisamos disso agora. Vamos fazer tudo à mão mesmo nos próximos repositórios que criaremos. Por isso não selecione esta opção.
14. Para finalizar e criar o repositório, clique no botão verde (`Create Repository`).
[Índice](README.md)

9
GIT-instalar.md Normal file
View File

@ -0,0 +1,9 @@
[Índice](README.md)
# Instalar GIT
Para clonar o repositório você vai precisar ter o [GIT](https://git-scm.com/) instalado no seu computador. Já fizemos isso em aula, por isso vou contar esta parte como pronta.
Caso você ainda não tenha instalado o GIT, vá na página do GIT ([git-scm.org](https://git-scm.com/)), faça o download do GIT e siga a instruções de instalação que lhe forem dadas.
[Índice](README.md)

79
JS-Exercicios-Objetos.md Normal file
View File

@ -0,0 +1,79 @@
# Exercícios - Objetos
Estes exercícios usam o pacote `readline-sync`. O código para importar o pacote foi omitido dos exemplos por brevidade.
## Instruções para começar o trabalho
Para fazer os exercícios você precisa:
1. criar um diretório
2. nesse diretório, instalar o `readline-sync` usando o `npm`
```sh
npm install readline-sync
```
3. em cada um de seus programas, incluir no começo deles a linha:
```js
const rl = require('readline-sync');
```
## Interpretação de código
1. No programa abaixo, o que vai ser impresso no console?
```js
const filme = {
nome: "Auto da Compadecida",
ano: 2000,
elenco: [
"Matheus Nachtergaele", "Selton Mello", "Denise Fraga",
"Virginia Cavendish"
],
transmissoesHoje: [
{canal: "Telecine", horario: "21h"},
{canal: "Canal Brasil", horario: "19h"},
{canal: "Globo", horario: "14h"}
]
}
console.log(filme.elenco[0])
console.log(filme.elenco[filme.elenco.length - 1])
console.log(filme.transmissoesHoje[2])
```
1. No programa abaixo, o que vai ser impresso no console?
```js
const cachorro = {
nome: "Juca",
idade: 3,
raca: "SRD"
}
const gato = {...cachorro, nome: "Juba"}
const tartaruga = {...gato, nome: gato.nome.replaceAll("a", "o")}
console.log(cachorro)
console.log(gato)
console.log(tartaruga)
```
1. No programa abaixo, o que vai ser impresso no console?
```js
function minhaFuncao(objeto, propriedade) {
return objeto[propriedade]
}
const pessoa = {
nome: "Caio",
idade: 23,
backender: false
}
console.log(minhaFuncao(pessoa, "backender"))
console.log(minhaFuncao(pessoa, "altura"))
```

View File

@ -108,4 +108,25 @@ Os datasets de emails e telefones foram gerados usando as ferramentas disponíve
### datasets
- [American Movies scraped from Wikipedia](https://raw.githubusercontent.com/prust/wikipedia-movie-data/master/movies.json)
- [American Movies scraped from Wikipedia](https://raw.githubusercontent.com/prust/wikipedia-movie-data/master/movies.json)
## Exercícios - aula remota 02/05/2024
- [Exercícios sobre Objetos](JS-Exercicios-Objetos.md) - Pesquise nos [slides da aula sobre objetos](slides/aula07-objetos.pdf) e resolva também os exercícios que envolvem sintaxes não vistas em aula, como o operador *spread* `...`
- [Exercícios sobre loops](JS-Exercicios-Lacos.md) - Pesquise nos [slides da aula sobre laços/loops](slides/aula09-lacos.pdf) e resolva também os exercícios que envolvem sintaxes não vistas em aula, como `for..of`.
## Tarefa para quem quiser adiantar assunto
Você pode fazer a etapa 2 pelo celular. As etapas que necessitam de instalação de programas ou do VSCode estão marcadas.
**Criar uma conta no `codeberg.org` ou `git.disroot.org` e criar um repositório seguindo os roteiros abaixo:**
1. [Instalar GIT](GIT-instalar.md) (precisa de computador)
2. [Criar conta e 1 repositório de código](GIT-criar-repositorio-codeberg.md) - Esta é parte que você pode fazer pelo celular. O roteiro usa o `codeberg.org` (git.disroot.org é igual, se você preferir).
> Se você quiser, pode também criar uma conta no `github.com` mas a criação de repositórios é um pouquinho diferente.
3. [Clonar repositório](GIT-clonar-repositorio.md) (precisa de computador com Git)
4. [Atualizar repositório](GIT-Atualizar-repositorio.md) (precisa de computador com Git e VScode)