Pt04

PT-04

Na Pt-04 aprendemos HTML e um pouco de CSS, e depois programamos a planta da turma.

A minha ficou assim: planta

Neste trabalho tivemos de fazer o curso de HTML da aplicação sololearn, e recebemos o seguinte comprovativo.

Aqui está a minha memória descritiva para se quiserem saber mais sobre o trabalho.

Memória Descritiva

PT04: Iniciação à Programação em HTML

Domínio que redireciona para uma página central: http://diogofafonso.ga

Memória Descritiva:

1. Comecei por aprender as bases da linguagem HTML e fiz a pauta fotográfica da turma da forma que me pareceu mais sugestiva para o trabalho.
2. Para realizar esta proposta de trabalho instalei o Notepad++ e o equipamento utilizado foi um computador.
3. Na execução do trabalho
   • O passo mais interessante foi a criação da tabela e a realização do curso da Solo Learn pois fez-me aprender de uma maneira mais interessante.
   • O passo mais difícil foi no inicio perceber como é que funcionava o GitHub.
   • O passo que me deu mais trabalho foi colocar as fotografias pequenas com uma hiperligação para um fotografia em grande com 1000px e colocar os nomes ainda na mesma célula com diferentes cores de todos os outros, pelo menos foi o que me ocupou mais o tempo.
   • O passo que tive de pedir ajuda foi a redimensionar a largura das colunas da tabela, pois a minha tabela ficava estranha e pedi ajuda ao professor.
4. Fui resolvendo os problemas que tinha procurando na Internet, perguntando ao meus colegas e ao professor.
5. Neste trabalho decidi utilizar CSS Internal para que a tabela ficasse mais bonita e porque achei que para um primeiro trabalho era mais fácil utilizar CSS Internal.
6. O que gostei mais de elaborar neste trabalho foi a pauta fotográfica da turma, acho que algumas cores na minha pauta nao ficaram muito legíveis e gostava de ter aperfeiçoado isso, e por fim aprendi a trabalhar com os básicos do HTML e fiquei a conhecer o GitHub.

Printscreen do certificado do curso da Solo Learn de HTML:

PT04 - Memória Descritiva

Neste trabalho tivemos que criar uma tabela com a pauta/planta da turma 12º2ª na disciplina de AIB com linguagem HTML e estilização CSS (opcional). Decidi criar uma pauta porque tornava o processo de arrumação na tabela significativamente mais simples e descomplicava muitas coisas que se poderiam tornar grandes dores de cabeça para pessoas inexperientes em programação (como eu).

1. Equipamento (Software e Hardware):

• O equipamento utilizado foi tanto o computador da escola como o PC pessoal da marca ASUS. Para poder realizar o mini-projeto foi-nos pedido que instalássemos um editor de texto HTML (Notepad++ ou Atom) e tive que utilizar uma outra aplicação para edição das fotografias mostradas na pauta (IrfanView).

     2. Passos dignos de nota:

• Os passos mais interessantes foram definitivamente a criação e edição da tabela, fazendo várias pequenas experiências para melhor perceber o que era afetado e de que modo ao introduzir pequenas tags e elements aqui e acolá para que a pauta ficasse o mais sintética e estética possível. 

• O que achei mais difícil e deu mais trabalho foi certamente a criação da conta no GitHub e FreeNom dado que são ambos sites que deixam muito a desejar no campo de intuitividade e facilidade de manipulação, acabando por ser aqui também onde tive que pedir ajuda a colegas sobre como/o que fazer.

     3. Resolução de problemas:

• Os problemas que encontrei foram resolvidos rapidamente com recurso a pesquisas no motor de busca Google, consulta de colegas na mesma situação e mais versados no assunto e, claro, perguntando ao professor. 

     4. As decisões tomadas ao longo do trabalho 

• Ao longo do trabalho fui tomando decisões mais no campo da estilização da tabela como que cores a utilizar, grossura das fronteiras e cor das legendas, já que cada uma tinha que ter uma cor diferente. De resto, o trabalho pouco dava para "inventar" mas não tenho querelas com isso pois me daria apenas mais tempo de introspeção dado o leque enorme de decisões que teriam de ser tomadas autonomamente, para as quais não teria resposta.

     5. Conclusão:

• O que mais gostei foi de aprender um pouco da história da linguagem HTML (passo 0) pois, apesar de saber as suas origens (CERN), pouco mais sabia; outro dos passos que gostei mais foi, naturalmente, a elaboração da tabela (passo 5) porque me deu a oportunidade de andar a mexer em código e foi uma tarefa bastante autodidata.
• Gostaria de ter tido outra oportunidade para ajeitar melhor a font das legendas mas foi algo com que tive alguns problemas e então teve que ficar com a font predefinida, que deixa muito a desejar.

Durante a realização deste projeto aprendi um pouco de tudo sobre HTML, desde a sua história até como criar páginas funcionais nessa linguagem.

Certificado de finalização do curso HMTL (SoloLearn)

Link para: Pauta produzida por Filipa Costa

PT04 - Iniciação à Programação em HTML

No início do 2º Período a turma de AIB 12.2 fez uma iniciação à programação em HTML

Passo 5 - PT04

Iniciação:

A maneira como fiz a tabela foi 70% de acordo com o que aprendi de pesquisar no "w3schools" e através do curso da aplicação SoloLearn. Os restantes foram pequenas pesquisas que fiz de modo a melhorar o resultado final.

Preparação do Trabalho:

Primeiramente tive de instalar o Notepad++ em ambos os computadores(o da escola e o de casa) e mais tarde passámos a usar o Atom pois este vinha com integração do GitHub, o que facilitava o processo de guardar e fazer upload. Para além disso, tivemos ainda que usar a app da SoloLearn, criar uma conta no GitHub e criar um domínio grátis para associar ao projeto no GitHub.

Realização do Trabalho:

A elaboração do mini-projeto "Pauta fotográfica da turma":

• O mais interessante: Ver o resultado final depois de ter o código todo escrito e pesquisar sobre como fazer cada coisa.
• O mais difícil: Aprender sobre CSS e como o aplicar.
• O que deu mais trabalho: Repetir várias vezes o mesmo código por ser uma tabela, como é o caso do elemento "td".
• O que tive de pedir ajuda: Aprender a trabalhar com o GitHub e a sincronizá-lo com o Atom.

Resolução de Problemas:

A maior parte das dúvidas eram sempre esclarecidas através de pesquisas, sendo ou nos tutorias do w3schools, ou no curso da SoloLearn, ou até através de pesquisas externas em fóruns , no entanto, como é evidente, ainda ouve dúvidas na realização do trabalho que foram esclarecidas com colegas e com o professor.

Decisões Influenciadoras:

As decisões que foram tomadas ao longo do trabalho tiveram bastante impacto no resultado final sendo essas: A ideia de como fazer uma tabela e a pré-organização influenciaram o modo e a dificuldade com que o mini-projeto foi feito; a mudança de editor a meio do projeto Notepad++>Atom teve impacto não só no modo de elaboração como na dificuldade(mudança de plugins e habituação ao novo editor).

Conclusão:

Concluindo, gostei de elaborar este projeto pois foi o primeiro onde se fez programação, que era aquilo que queria aprender em aib, e foi uma boa iniciação, uma vez que a linguagem aprendida não era muito complexa. O que mais gostei de fazer foi o curso SoloLearn pois foi onde aprendi mais. Acho que o resultado final poderia ter ficado melhor se tivesse gasto mais tempo em pesquisa sobre CSS. Em relação ao que aprendi, foi uma língua nova que serve para criar páginas, o que foi um bom ponto de partida para aprender outras linguagens que façam outras coisas.

URL's:

FreeNOM: gui14.ga

GitHub (Repositórios)

GitHub Pages (Pauta)

Certificado SoloLearn do curso "HTML Fundamentals course"

PT04 - Iniciação à programação

Memória Descritiva

1. Achei que ficaria com melhor apresentação da maneira que criei, mas no fim vejo que poderia ter havido maneiras mais fáceis e rápidas para a resolução desta PT.

2. Começámos por utilizar o Notepad++, ou em alternativa o Atom para programar e o Irfanview para redimensionar as fotografias utilizadas para aplicar na pauta dos respectivos alunos.

3. -O que achei mais interessante foi a colocação de imagens na pauta.
    -O que achei mais difícil foi o recorte das fotografias, pois não tinha a mínima ideia do funcionamento do programa.
    -O que deu mais trabalho foi criar os elementos da tabela para todos os alunos de AIB (<td></td>,<tr></tr>).
    -Tive de pedir ajuda no recorte das fotografias.

4. Recorri apenas aos meus colegas para tirar dúvidas.

5. Primeiro comecei por fazer uma planta da turma (não cheguei a concluir) e, quando o enunciado foi alterado (em vez de uma planta fazer uma pauta) comecei a fazer uma pauta.

6. O que mais gostei de elaborar (talvez pelo aspeto que dá ao ficheiro) foi a tabela em si.

 
    -Poderia ter feito apenas uma tabela com título, fotos e nomes e em vez disso segui a primeira ideia que tive.
    -Não sabia nada de programação de qualquer tipo (HTML, CSS e Javascript) e nesta PT aprendi o básico do HTML.

URL do site para a pauta

goncalocardoso27.ga

Certificado do curso HTML

Conclusão do PT04

PT04

Introdução: 

A proposta de trabalho 4 foi iniciada no dia 3 Janeiro, primeira aula do segundo período, e estendeu-se até ao dia 29 de Janeiro. Sendo o início de uma nova matéria, a programação, o trabalho foi dividido em várias partes, uma relativa à história do HTML, como introdução, e outras relativas às diferentes especificações desta linguagem que é o foco deste trabalho. Também nos foram apresentadas outras ferramentas úteis, como o Github e o SoloLearn, aplicação que gostei muito, em que o trabalho foi partilhado e um curso de HTML feito. O software usado foi o Notepad++ que foi instalado no computador da escola e também no pessoal.

Tempo de execução:

A progressão deste trabalho foi relativamente mais lenta do que os outros, porque a programação é uma área de conhecimento muito vasta em que, de início, me senti pouco à vontade. Ao todo, tivemos 6 aulas de 90 minutos, sendo que uma delas foi focada no Github e nas suas aplicações. Fora da escola, este projecto demorou cerca de 8h a completar, considerando o tempo de realização do curso de HTML e a organização do portefólio e do drive.

Realização: 

Este trabalho mostrou-se um desafio maior do que o esperado. O primeiro obstáculo com que me deparei foi a elaboração da tabela. Comecei com uma estrutura de planta da turma que acabei por abandonar (Drive - Pauta Fotográfica da Turma - Projecto abandonado), porque não conseguia fazer um bom uso da tag <coolspan> ficando a organização diferente daquilo que eu queria. Não consegui arranjar sozinha solução para o problema, por isso acabei por reiniciar o trabalho como pauta da turma e com um código diferente, com algumas sugestões dos meus colegas. Assim, o meu trabalho final só se começou a compor muito tarde, factor que me preocupou.  Além disso, encontrei outras adversidades, mas que consegui resolver graças a múltiplas consultas no site ww3schools. Os passos relacionados com o Github também se mostraram um pouco confusos, pelo que demorei mais tempo a executá-los.  Assim, os passos mais interessantes foram desenhar a pauta da turma e elaborar o código que seria a base para o projecto, tal como aprender sobre as origens do HTML e todos os processos aconselhados quando programamos, como por exemplo, a identação. Os passos mais trabalhosos foram também a elaboração da tabela e o curso do SoloLearn que, apesar de não ter considerado difícil, demorou cerca de 2h a completar, devido à sua dimensão. Por fim, houve 2 passos em que eu senti necessidade de pedir ajuda, o 7 e o 8. O primeiro estava relacionado com a associação do Github com um domínio personalizado do FreeNom, passo que eu não conseguia fazer, porque obtia um erro desconhecido no computador da escola sempre que tentava. Decidi pedir ajuda ao professor que sugeriu que eu tentasse fazê-lo em casa e, seguindo a sugestão, acabei por conseguir. O oitavo passo foi resolvido com ajuda e explicações dos meus colegas, porque eu não estava a perceber quais eram os links a enviar e estava com receio de enviar os incorrectos.

Decisões e toque pessoal: 

Este trabalho tem uma componente pessoal que se reflete principalmente na construção da tabela. A estrutura de HTML, o aspecto exterior da tabela e os printscreens capturados são algumas das decisões que deram um toque mais pessoal ao meu trabalho. Assim, na minha opinião, as decisões que influenciaram mais o meu trabalho foram a de fazer uma pauta e abandonar a ideia de fazer a planta da turma e também o código e os comentários lá feitos.

Conclusão:

Estranhamente, apesar das altas expectativas, este foi o trabalho que eu menos gostei de fazer até agora, provavelmente por causa da minha preferência por trabalhos mais criativos. Ainda assim, eu gostei muito de aprender HTML e de criar a tabela, mas, pessoalmente, acho que os passos relacionados com o Github foram um pouco cansativos e o enunciado um pouco vago no passo do mini-projecto. Ainda assim, eu acho que este projecto foi um bom desafio e ensinou-me muitas coisas, desde as tags mais comuns e úteis até às utilidades e diferenças do Git, do Github e do Github Pages. Acho que teria sido mais interessante ter feito uma planta da turma, mas como não me foi possível acho que a pauta funcionou bem. Por fim, acho que podia ter melhorado o meu trabalho se tivesse adicionado mais opções de estilização à tabela e tivesse conseguido fazer uma página inicial para os repositórios no Github.

Link do domínio pessoal com o site: http://leonordias.ml

Diploma final da conclusão do curso de HTML no SoloLearn

PT04- Pauta Da Turma 12º2ª

Link que redirecciona para o URL do domínio público: https://eduardoacoelho.github.io/
Link que redirecciona para a pauta fotográfica: https://eduardoacoelho.github.io/pautaeduardo/ 

Memória Descritiva Do Trabalho Da Pauta: 

1.  Processo Criativo:

   1.1. Comecei por perceber as bases do HTLM indo ao W3Schools aprendendo aos poucos o que era pedido. Para depois começar a fazer uma pauta fotográfica da turma.

2.  Preparação do trabalho:

  2.1. Descarreguei o NotePad++ como editor de programação para este trabalho. Descarreguei o  IrfanView para ajustar as imagens do tamanho pedido.
  2.2. Acabei o trabalho em cerca de 2 horas, usando tanto um laptop como um desktop, tanto em casa como na escola.
  2.3. O material utilizado foi um computador, um teclado e um rato.

3. A execução do trabalho:

 3.1. Os passos mais interessantes foram a criação da tabela e do seu estilo, a criação de uma conta no github e no freenom. 
 3.2.  A parte mais complicada do trabalho foi no inicio, perceber como a linguagem de HTML funcionava e como é que tinha de organizar as coisas para que o trabalho ficasse bom. 
 3.3. O passo que deu mais trabalho foi meter as fotos e criar uma hiperligação para depois serem abertas numa resolução maior.

4. Resolução de problemas e dificuldades encontradas ao longo do trabalho:

 4.1. Fui resolvendo os meus problemas com o HTML indo ao site W3Schools e pedindo ajuda aos meus colegas. 

5. As decisões tomadas ao longo do trabalho:

 5.1. Eu decidi por a imagem e o nome do aluno em células separadas pois era o que achava que ficava melhor. Decidi também por as cores de forma aleatórias, e escolher um background color tanto para a tabela como para o fundo da página onde a tabela é mostrada.

6. Conclusão final:

  6.1.  A parte que mais gostei de foi fazer a tabela em HTML.
  6.2. Com mais alguns conhecimentos na área da programação talvez pudesse ter corrigido alguns erros ou ter deixado tudo perfeito. 
  6.3. Fiquei a conhecer melhor a linguagem HTML. 

O certificado do curso "HTML Fundamentals Course" da Solo Learn:

PT04- Pauta Fotográfica

O dominio que redireciona para a Pauta Fotografica é: http://pedrosoares.ml

1.  Processo Criativo 

• Comecei por perceber as bases do HTLM, para depois começar a fazer uma planta fotográfica da turma.

2.  Preparação do trabalho 

• Descarreguei o NotePad++, o editor de programação usado para esta proposta de trabalho
• Acabei o trabalho em cerca de 4 horas, usando um computador portátil, tanto em casa como na escola  
• O material utilizado foi apenas o teclado e o rato.

3. A execução do trabalho:

• O passos mais interessante foi a criação da tabela e do seu estilo.
•    O parte mais complicada da proposta de trabalho foi o inicio, perceber como a linguagem de HTML funcionava.
•    O passo que deu mais trabalho foi escrever a hiperligação para as fotos num novo separador

4. Resolução de problemas e dificuldades encontradas ao longo do trabalho:

•  A resolução dos problemas encontrados foram resolvidos com ajuda de alguns colegas e alguns sites sobre programação de HTML.

5. As decisões tomadas ao longo do trabalho:

• Este trabalho e uma planta fotográfica da turma, após o código e a estrutura estarem feitas apercebi-me que era só uma pauta, nao uma planta 

6.Conclusão final

•  A parte que mais gostei de fazer foi a aprendizagem de HTML.
• Com mais alguns conhecimentos na área da programação talvez pudesse ter corrigido alguns erros ou ter deixado tudo perfeito. 
• Aprendi os básicos do HTML. 

O certificado do curso "HTML Fundamentals Course" da Solo Learn

Conclusão do Pt 04- Iniciação à programação em HTML

Memória descritiva:
No processo criativo deste trabalho a ideia de fazer uma planta da sala de aula surgiu-me ao usar o w3schools, porque vi uma maneira de utilizar a tag <table> muito interessante para aquilo que tinha em mente.
Este trabalho teve 4 etapas inicias de preparação: Sendo a primeira uma pequena contextualização em termos de história de HTML, na segunda aprendemos um pouco da estrutura básica de HTML, na terceira instalámos um editor de programação que .no meu caso foi o Notepad++, e a quarta foi a aprendizagem de boas práticas de programação. A seguir, foram-nos apresentados mais 7 passos relativos à elaboração deste projeto. Este trabalho prolongou-se por cerca de 3 semanas, contabilizando o tempo de aula  e umas 8h de trabalho em casa.
Os 7 passos restantes foram os que surgiram mais a minha atenção neste trabalho. Sendo o quarto a realização dos primeiros passos em HTML que realizei bastante rápido , pois já os tinha realizado no w3schools, o quinto era relacionado com aplicar os nossos conhecimentos de HTML para fazer uma planta/tabela da sala de aula, o sexto era sobre carregar o míni projeto da planta/tabela para o GitHub, o sétimo era relacionar o domínio pessoal do GitHub a um domínio personalizado no Freenom, no oitavo tivemos de enviar os endereços do GitHub e do freenom para um formulário, o nono era realizar um curso de HTML5 na aplicação SoloLearn e por ultimo o décimo passo era para fazermos uma notícia no blog pessoal.
Durante este trabalho senti algumas dificuldades em trabalhar com o GitHub, que está associado ao passo 6, pois não conseguia perceber bem como criar o link do site. Por outro lado o passo onde senti menos dificuldades foi o curso no aplicativo SoloLearn  de HTML5.
Os passos que me deram mais trabalho foram o passo 5 da realização da pauta da sala de aula e o passo 6 do GitHub e o passo que me deu menos trabalho foi o passo 4 da estrutura dos básicos de HTML.
Na realização deste trabalho tive alguns problemas no GitHub ao criar o meu repositório, pois tive que apagar o meu repositório 2 vezes pelo facto de ter mudado a dimensão de todas as fotografias. Resolvi este meu problemas indo ao informática para todos ver o enunciado do GitHub.
Tive algumas decisões chave no meu projeto que estiveram relacionadas com o passo 5 do míni projeto, nomeadamente eu a meio da realização da minha planta da sala de aula mudei a estrutura da minha tabela melhorando visualmente o meu projeto.
Concluindo com este trabalho fiquei a perceber os básicos de programação nomeadamente de HTML5, porem acho que podia ter melhorado mais o meu passo 5. O que gostei mais neste trabalho foi a realização do curso de HTML5 no SoloLearn.


-Diploma do final do curso de HTML.
-Link so site criado: https://tiagomcbgarcia.github.io/pt04/pt04versao9.html