Curso: 2025.2 - PROGRAMAÇÃO PARA INTERNET I - Turma 01

  • Geral

    Disciplina: Programação Para Internet I (PPI 1)

    Nesta unidade, estudaremos os fundamentos da programação para Web, explorando:
    HTML (estruturação de páginas)
    CSS (estilização e layout responsivo)
    JavaScript (interatividade no cliente)
    Além disso, abordaremos conceitos de arquitetura cliente-servidor e protocolo HTTP, essenciais para a comunicação entre navegador e servidor.

     Carga Horária 

    🕐Total 80 horas

    • 48 horas presenciais
    • 32 horas EAD (realizadas ao longo do período com atividades no AVA)
     Período das Aulas Presenciais

    📅
    🗓️ Aulas Presenciais:

    • Terças-feiras (Lab 4) e Quartas-feiras (Lab 6)
    • Das 18h30 às 22h30
    • Local: IFSC Campus Gaspar - Laboratório de 
    CanalInformação
    E-mail romulo.beninca@ifsc.edu.br
    WhatsApp (44) 98801-0521

    Horário de Atendimento

    🕑 Sextas-feiras das 14h às 15h
    📲 Outros horários: via agendamento por e-mail ou WhatsApp.
    💡 "Se precisar de ajuda, entre em contato quando quiser, agende horarios!"

    Leia o Plano de Ensino e e fique atento à carga horária da disciplina assim como seu método de avaliação!

  • Plano de ensino
    1
    2
    3
    Materiais e Atividades
    1
    2
    3
    4
    5
    6
  • Tópico 1 - Plano de Ensino

    O Plano de ensino da Unidade Curricular (PUC)  contempla explicações sobre o planejamento do módulo como organização dos conteúdos,  metodologias que serão utilizadas para ensino, métodos avaliativos que serão utilizados bem como proposta de recuperação e explicações de como devem ocorres todas essas atividades. 

    Distribuição Carga Horária:

    • Total Presencial: 48 horas
    • Total EAD: 32 horas

     

    SemanaDiaModalidadeConteúdo / AtividadeCH
    1 Presencial

    ✅ Apresentação do Plano de Ensino + História da Web e História da Internet.
    ✅ Arquitetura Cliente-Servidor + Protocolo HTTP +HTTP Status codes.
    ✅ HTML : estrutura básica HTML,  comentários em html, atributos , head, body, html , p , hr
    ✅ Incorporação de estilização com CSS : estrutura regra, comentário

    4h
    Presencial

    ✅ Git e Controle de Versão: conceitos de versionamento, commits, branches
    ✅ Serviços remotos: GitHub, GitLab, Bitbucket
    ✅ Publicação com GitHub Pages
    ✅ HTML Avançado: listas (<ul><ol>), tabelas (<table><tr><td>), formulários (<form><input><textarea><button>labelselectoption)
    ✅ CSS Prático: propriedades borderwidthheightmarginpaddingcolorbackground-*opacityborder-radiusfont-*text-transform
    ✅ Prática guiada: montagem de páginas simples integrando HTML e CSS

    4h
    EAD

    📚 Atividade prática no AVA(Ambiente Virtual de Aprendizagem):Formulários simples + validação básica (HTML)

    4h
    2 T) Sem aula devido ao feriado municipal 0h
    Presencial ✅ CSS Seletores:
    ✔️ Básicos: elemento, .classe#id
    ✔️ Hierárquicos: descendente (ul li), filho direto (div > p), irmãos (h2 + ph2 ~ p)
    ✅ Propriedades de Textofont-familyfont-sizefont-weightline-heighttext-aligntext-transformletter-spacing
    ✅ Cores e Fundoscolorbackground-colorbackground-image
    ✅ Prática: estilização de menus e áreas de conteúdo
    4h
    EAD 📚 Exercício prático: Criar layout responsivo com Flexbox + Grid no AVA 4h
    3 Presencial Projeto Prático de Layout Completo:
    ✔️ Integração de Flexbox e Grid para páginas complexas
    ✔️ Adição de responsividade com @media
    ✔️ Uso de unidades flexíveis (em%vhvw)
    ✅ Revisão de Estilização: boas práticas de semântica e acessibilidade (uso correto de tags e contrastes de cor)
    4h
    Presencial

    ✅ Revisão sobre Flexbox , e apresentação grid layout

    ✔️ Adição de responsividade com @media
    ✔️ Uso de unidades flexíveis (em%vhvw)

    4h
    EAD 📚 Revisão + Atividades de reforço (Recuperação parcial, se necessário) 4h
    4 Presencial

    ✅ Introdução ao JavaScript (JS):

    ✔️ Ambiente de execução no navegador (windowconsolealert)
    ✔️ Sintaxe básica: variáveis (letconst), tipos primitivos
    ✔️ Operadores matemáticos e lógicos
    ✔️ Estruturas de controle (if/else, switch)

    ✅ Manipulação do DOM com JS:
    ✔️ Seletores de elementos (getElementByIdquerySelector)
    ✔️ Manipulação de conteúdo (innerHTMLtextContent)
    ✔️ Manipulação de atributos e classes (setAttributeclassList.add)
    ✔️ Eventos (addEventListener para clicksubmit, etc.)
    ✅ Prática guiada: manipulação de formulários (validação simples com JS)

    4h
    Presencial

    ✅ Avaliação Parcial 1: HTML + CSS (Prova prática)
    ✅ Feedback e revisão

    4h
    EAD 📚 Atividade prática no AVA: Criar scripts JS manipulando formulários e eventos 4h
    5 Presencial ✅ JavaScript Avançado:
    ✔️ Laços (forwhileforEach)
    ✔️ Arrays e objetos simples
    ✔️ Criação e chamada de funções personalizadas
    ✔️ Escopo e boas práticas (uso de const e let, evitar var)
    ✔️ Modularização básica
    4h
    4h
    EAD 📚 Atividade prática no AVA: Criar uma landing page com Bootstrap e JS 4h
    6 27/11 Presencial ✅ Desenvolvimento de Projeto Final:
    ✔️ Orientação prática: validação do escopo, layout, interatividade
    ✔️ Aplicação dos conceitos aprendidos (HTML + CSS + JS + Bootstrap)
    ✔️ Revisão de acessibilidade e responsividade
    4h
    04/12 Presencial ✅ Apresentação dos Projetos + Avaliação Parcial 2:
    ✔️ Defesa e arguição dos projetos desenvolvidos
    ✔️ Feedback individualizado
    ✅ Orientação para Recuperação Final, se necessário
    4h
    EAD 📚 Atividades de recuperação (Reentrega do projeto ou nova avaliação prática) 4h

    Avaliações:

    • Avaliação 1 (HTML + CSS): prova prática (peso 1)
    • Avaliação 2 (Projeto com JS + Bootstrap): apresentação/arguição (peso 1)
    • Atividades e Listas no AVA: exercícios e atividades práticas (peso 1)

    Nota final:

     Média Final = (Avaliação 1+ Avaliação 2 + (Média das atividades e listas)

    • Tópico 2

      Conteúdos aborados na UC:

      Objetivos:

      • Compreender os conceitos relacionados ao desenvolvimento de interfaces Web.

      • Criar páginas web utilizando linguagens de marcação de hipertexto e de descrição de estilo.

      • Aprender a desenvolver páginas Web dinâmicas por meio de scripts executados no navegador, de forma a agilizar a animação e aprimorar a interatividade com a interface.

      Conteúdos:

                    1. Conceitos de aplicações web;

                    2. Linguagens de marcação: HTML, CSS;

                    3. Linguagem de script;

                    4. Arquitetura cliente/servidor;

                    5. Frameworks para desenvolvimento front-end;

      Bibliografia Básica:

                  RESIG, John. Segredos do Ninja JavaScript. São Paulo: Novatec, 2013.

                    SANDERS, Bill. Smashing HTML5: técnicas para a nova geração da web. Tradução de Mariana Bandarra. Porto Alegre: Bookman, 2012.

      Bibliografia Complementar:

              FLANAGAN, David. JavaScript: o guia definitivo. Tradução de João Eduardo Nóbrega Tortello. 6. ed. Porto Alegre: Bookman, 2013.

              MARCONDES, Christian Alfim. HTML 4.0 fundamental: a base da programação para web. 2. ed., 5. reimpr. São Paulo: Érica, 2012.

              MELO, Alexandre Altair de; LUCKOW, Décio Heinzelmann. Programação Java para a web. 2. ed. São Paulo: Novatec, 2015.

              SILVA, Maurício Samy. Construindo sites com CSS e (X) HTML: sites controlados por folhas de estilo em cascata. São Paulo: Novatec, 2008.

              SILVA, Maurício Samy. HTML 5: a linguagem de marcação que revolucionou a web. 2. ed. São Paulo: Novatec, 2011.


      • Avaliação e notas

        Nossa avaliação se baseia na pesquisa como princípio educativo, incentivando a compreensão, análise e domínio dos conteúdos conforme PPC. Utilizamos métodos variados, incluindo observação diária, trabalhos de pesquisa, testes, arguições e execução de projetos.

        As atividades em grupo exigem apresentação e defesa do trabalho, reforçando habilidades de comunicação e colaboração. O plágio é severamente penalizado, em sintonia com a integridade acadêmica preconizada pelo PDI.

        A entrega de trabalhos em formatos especificados e a utilização de terminologia correta, valorizando o profissionalismo e a precisão na comunicação. Todas as atividades possuem possibilidade de recuperação, demonstrando nosso compromisso com a inclusão e o sucesso de todos os alunos.

        Com base nesses princípios define-se os seguistes procedimentos para avaliação de aprendizagem nesta unidade. 

        As atividades  em sala e ou na plataforma moodle com especificações na própria atividades e também no plano de ensino, tendo como intervalo valores inteiros de 0 a 10 e podendo se utilizar das seguintes formas de avaliação. 

        • Conforme previsto na RDP as avaliações desta unidade podem constar:

        I - observação diária dos alunos pelos professores, em suas diversas atividades;
        II - trabalhos de pesquisa individual ou coletiva;
        III - testes e provas escritos, com ou sem consulta;
        IV - entrevistas e arguições;
        V - resoluções de exercícios;
        VI - planejamento ou execução de experimentos ou projetos;
        VII - relatórios referentes aos trabalhos, experimentos ou visitas técnicas;
        VIII - atividades práticas referentes àquela formação;
        IX - realização de eventos ou atividades abertas à comunidade;
        X - autoavaliação descritiva e avaliação pelos colegas da classe;
        XI - demais instrumentos que a prática pedagógica indicar.

        •  Intervalo das notas:As notas das atividades, bem como os cálculos seguiram o previsto na RDP sendo notas inteiras no intervalo de [0 a 10], ou seja sem qualquer parte fracionária. Por exemplo, 5,3 será 5, assim como 5,8 será 5. (Definido como RDP do IFSC). 
        • Atividades e avaliações:Todas atividades da unidade tem os critérios definidos no plano de ensino, podendo adicionamento ou sobrepor estes por meio de instruções descritas na própria atividade.

        • Atividade em grupo: Todos discentes do grupo devem entregar a atividade. Nestes caso pode ser solicitado aos integrantes apresentação com arguição para evidenciar domínio e compreensão sendo a nota atribuída ao domínio e compreensão.

        • Plagio:Cópias, plágios : Cópias ou plagio de trabalhos terão nota 0 (Zero). 

        • Algumas atividades poderão ser entregues por meio de link de repositórios, neste caso cabe ao discente garantir o acesso ou publicidade dos artefatos. Nesses casos o commit mais recente a data limite de entrega será considerado.

        • Atividades ou trabalhos entregues fora do formato especificado, quando tal for requisitado, receberão nota zero.

        • Nas atividades em que um modelo ou formato de entrega for especificado, este deve ser seguido. Caso haja divergência do formato especificado, a atividade receberá nota zero(0). Por exemplo, se o formato de entrega for .zip e um .rar for entregue, a nota atribuída será zero (0).

        • A utilização de terminologia correta será avaliada em qualquer tipo de atividade. Portanto, pode ser atribuída nota zero ou parcial para questões respondidas de maneira completa ou parcial que não apresentem a terminologia correta da área.

        • Todas as atividades desta unidade estão sujeitas à apresentação para que o docente possa identificar o real grau de conhecimento do aluno sobre a atividade. Dependendo da apresentação, a nota pode ser alterada. Em caso de necessidade de apresentação de qualquer atividade, o docente informará o discente através da ferramenta institucional.

        • Nas atividades entregues após a data definida receberão nota zero, exceto em casos onde sejam apresentadas justificativas legais previstas nos regulamentos institucionais.

        • Todas as atividades desta unidade estão sujeitas à apresentação  com arguição pelo docente, para que o docente possa identificar o real grau de conhecimento, domínio e compreensão  do aluno sobre a atividade e conteúdo.

        • Atividades que forem solicitadas, ou descritas com necessidade de apresentação é a nota pode ser alterada. Em caso de necessidade de apresentação de qualquer atividade, o docente informará o discente através da ferramenta institucional.A utilização de terminologia correta será avaliada em qualquer tipo de atividade. Portanto, pode ser atribuída nota zero ou parcial para questões respondidas de maneira completa ou parcial que não apresentem a terminologia correta da área.

        • Nas atividades em que um modelo ou formato de entrega for especificado, este deve ser seguido. Caso haja divergência do formato especificado, a atividade receberá nota zero(0). Por exemplo, se o formato de entrega for .zip e um .rar for entregue, a nota atribuída será zero (0).

        • Divergências em notas, ou correções devem ser comunicados ao docente para analise. Caso o discente descorde deve solicitar re-avaliação conforme RDP. 

        • Apresentação de atividades: As atividades que demandarem apresentação com arguição, a mera entrega dos artefatos sem apresentação com arguição tem nota zero (0). Nessas apresentações a nota é atribuída de acordo com conhecimento e domínio de manipulação dos artefatos identificados pelas respostas as arguições. Caso discente necessite de responder por escrito ou fazer adaptações deve comunicar ao professor. 

        Recuperação: Todas atividades terão oportunidade de recuperação. 

        Nota final: = (Avaliação 1+ Avaliação 2 + (Média das Atividades Propostas))

        As avaliações e atividades propostas poderão ser combinações das modalidades previstas para avaliação na RDP como avaliação escrita, observação em sala.


        • 1 - Introdução a web arquitetura cliente servidor e HTML Básico

          Introdução da história da web com foco na arquitetura cliente servidor e tecnologias HTTP, HTML, CSS e JS.
          Objetivos: 

          • Contexto do surgimento da web e internet
          • Tecnologias  utilizadas na web : arquitetura cliente servidor, protocolo HTTP, HTML, CSS e JavaScript. 
          • Estrutura básica  do HTML
        • 2 - CSS introdução Seletores , regras e propriedades básicas

        • 3 - CSS posicionamento , CSS1 , 2 e 3

        • Java Script

        • Avaliação 2 - Projetos JS HTML CSS API