https://github.com/jesielviana/ads-programacao-para-internet-i-2023
Material da disciplina de Programação para Internet I do Curso Superior de ADS do IFPI Campus Picos
https://github.com/jesielviana/ads-programacao-para-internet-i-2023
css html ifpi javascript js web website
Last synced: about 2 months ago
JSON representation
Material da disciplina de Programação para Internet I do Curso Superior de ADS do IFPI Campus Picos
- Host: GitHub
- URL: https://github.com/jesielviana/ads-programacao-para-internet-i-2023
- Owner: jesielviana
- License: other
- Created: 2023-02-07T21:41:32.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-03-31T22:44:16.000Z (about 2 years ago)
- Last Synced: 2025-04-12T10:15:22.667Z (about 2 months ago)
- Topics: css, html, ifpi, javascript, js, web, website
- Language: HTML
- Homepage: https://jesielviana.github.io/ads-programacao-para-internet-i-2023/exemplos/
- Size: 38.1 KB
- Stars: 6
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Programação para Internet I
Disciplina de Programação para Internet I do Curso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas do Instituto Federal do Piauí (IFPI) Campus Picos.
## Livro base da disciplina: [https://jesielviana.gitbook.io/webdev](https://jesielviana.gitbook.io/webdev)
**Sumário**
- [Programação para Internet I](#programação-para-internet-i)
- [Notas](#notas-de-aulas)
- [Objetivo do curso](#objetivo-do-curso)
- [Objetivos de aprendizagem detalhados](#objetivos-de-aprendizagem-detalhados)
- [Pré-Requisitos](#pré-requisitos)
- [Ementa](#ementa)
- [Ferramentas](#ferramentas)
- [Bibliografia](#bibliografia)
- [Licença](#licença)
- [Autor](#autor)
## Notas de aulas
| Aula | Assunto | Material |
| ---------- | ------------------------------- | ------------------------------------------------------------- |
| 13/02/2023 | Apresentação do plano de ensino | slides |
| 17/02/2023 | Introdução a Web | slides |
| 24/02/2023 | Introdução a HTML | HTML |
| 27/02/2023 | Introdução a CSS | CSS |
| 03/03/2023 | CSS Flexbox | Flexbox |
| 14/03/2023 | Web Design Responsivo | Slides |
| 31/03/2023 | Renderização web | Slides |
## Atividades
- [Atividade 1 (Layout simples com HTML e CSS)](atividades/atividade-1.md) - entregra dia 03/03/2023
- [Atividade 2 (Portfólio)](atividades/atividade-2.md) - entregra dia 13/03/2023
## Objetivo do curso
Este curso é uma introdução à programação para Web. Vamos aprender sobre os principais componentes da web, sobre o modelo cliente-servidor e de forma simplificada vamos entender como a internet e a web funcionam. E, principalmente, **vamos aprender como desenvolver aplicações web usando várias tecnologias**, tais como:
- Hypertext Transfer Protocol (HTTP) como protocolo de comunicação;
- HyperText Markup Language (HTML) para criação de páginas web;
- Cascading Style Sheets (CSS) para aplicar estilo às páginas web;
- JavaScript (JS) para criar páginas da web dinâmicas e interativas;
- Web Design Responsivo para criar páginas web adaptativas a diferentes resoluções de tela; e
- JavaScript assíncrono (AJAX) e JSON para interação entre aplicações Web.
No processo de aprendizado dessas tecnologias, você também vai:
- Praticar a habilidade de ler documentações detalhadas, **ler e escrever código legível**, bem documentado e estruturado;
- Aprender a **pesquisar e avaliar soluções** de forma adequada;
- Ter a oportunidade de **desenvolver um portfólio individual** para mostrar aos possíveis empregadores.
## Objetivos de aprendizagem detalhados
1. Conhecer a história do surgimento e expansão da Internet e Web;
1. Conhecer os principais componentes da web e compreender o seu funcionamento de forma simplificada;
1. Compreender a sintaxe e o papel da HTML para o desenvolvimento web, assim como conhecer seus principais elementos;
1. Compreender a sintaxe e o papel da CSS para o desenvolvimento web, assim como conhecer suas principais propriedades;
1. Entender a sintaxe e o papel da Javascript para o desenvolvimento web no lado cliente;
1. Entender o funcionamento do Document Object Model (DOM) e aprender a manipulá-lo;
1. Aprender a desenvolver aplicações web estáticas e responsivas com HTML e CSS;
1. Aprender a desenvolver aplicações web dinâmicas e responsivas com HTML, CSS e Javascript;
1. Ser capaz de desenvolver aplicações web seguindo os padrões de boas práticas e usabilidade da web.
1. Desenvolver habilidades técnicas para construção de aplicações web conforme os requisitos do cliente;
1. Desenvolver habilidades interpessoais para realização de trabalho em equipe e colaboração em projetos de desenvolvimento de software.
**Acompanhamento dos objetivos de aprendizagem: [Vereda App](https://vereda.vercel.app/cursos/cbqB0QVqDbINm8Nm5SOH)**
## Pré-Requisitos
- Conhecimento básico em algoritmos e estrutura de dados;
- Noções de comandos básicos do terminal Linux/Windows/Mac;
- Noções básicas de redes de computadores.
## Ementa
1. Introdução aos conceitos de Internet e Web;
2. Linguagem de marcação para Web - HTML;
3. Folha de estilo para Web - CSS;
4. Princípios de Design responsivo;
5. Usabilidade na Web;
6. Introdução à Javascript;
7. Páginas web dinâmicas com HTML, CSS e Javascript;
8. Integração com APIs externas;
9. Testes automatizados; e
10. Hospadagem de aplicações web na nuvem.
## Ferramentas
Ferramentas utilizadas no curso para realização das atividades. Instale e configure-as no seu computador.
- **Navegador web** - qualquer navegador web moderno ([Brave](https://brave.com), [Firefox](https://www.mozilla.org/en-US/firefox/new/), [Chrome](https://www.google.com/chrome/), etc)
- **Editor de Código** - [Visual Studio Code (VS Code)](https://code.visualstudio.com), que é um editor de código/IDE altamente recomendado para desenvolvimento web. É gratuito, _open-source_ e está disponível para os principais sistemas operacionais. O VS Code oferece muitas extensões, e o melhor são fáceis de instalar e configurar. Recomendo a instalação do pacote de extensões [Web Dev Extension Pack](https://marketplace.visualstudio.com/items?itemName=jesielviana.web-dev-extension-pack)
- **Sistema de controle de versão** - [Git](https://git-scm.com), que é um sistema de controle de versão open-source amplamente utilizado por desenvolvedores.
- **Plataforma Git na nuvem** - [GitHub](https://github.com), uma plataforma de hospedagem de código (repositórios Git) para controle de versão e colaboração distribuída. GitHub é a plataforma Git mais utilizada por desenvolvedores, principalmente para projetos open-source.
> Lista de ferramentas para desenvolvimento web: [O que deve ter na mala de ferramentas do desenvolvedor web?](https://jesielviana.com/blog/web-dev-tools)
## Bibliografia
Neste curso será utilizado dois recursos como bibliografia base: o eBook [Web Dev Book](https://webdev.jesielviana.com), disponível gratuitamente online e o portal da [Mozilla Developer Network - MDN](https://developer.mozilla.org/pt-BR/), que é uma das principais referências como documentação da web.
Além do Web Dev Book e da MDN, em toda aula será disponibilizados outros materiais complementares (vídeos, posts, tutoriais, documentações, etc).
---
## Licença
Este material está licenciado sob a licença Creative Commons [CC BY-NC-SA 4.0 Internacional](https://creativecommons.org/licenses/by-nc-sa/4.0/deed.pt_BR).
Sinta-se à vontade para usar este material em seu curso de desenvolvimento web, de acordo com a licença (uso não comercial).
Se você usar este material no seu curso, por favor me avise!
## Autor
Este material é mantido por Jesiel Viana.
Jesiel Viana é Mestre em Engenharia de Software pela Cesar School, Professor de Computação no Instituto Federal do Piauí - IFPI e Pesquisador Bolsista no IBICT. Possui mais de 10 anos de experiência em desenvolvimento web na indústria e academia.
Jesiel Viana é um [Github Campus Advisor](https://education.github.com/teachers/advisors), possui a certificação [Oracle Certified Professional, Java SE 6 Programmer](https://www.credly.com/badges/b53a6b6d-baae-4fa3-88d6-1550d33e1e0a/public_url).
- Linkedin: [https://linkedin.com/in/jesielviana](https://linkedin.com/in/jesielviana])
- Twitter: [https://twitter.com/jesielviana](https://twitter.com/jesielviana)
- Github: [https://github.com/jesielviana](https://github.com/jesielviana)
Gostou deste material? me indique para o GitHub Stars (jesielviana): [https://stars.github.com/nominate](https://stars.github.com/nominate/)