Codificação Para Dummies Cheat Sheet - dummies

Por Nikhil Abraham

A codificação é o vocabulário, a lógica e a sintaxe das partes iguais. A codificação pode, a princípio, parecer intimidante, mas com a prática, porém, é fácil ficar confortável com sua terminologia, conceitos e estrutura. Compreender a codificação não é diferente de aprender um novo idioma: use-o com bastante frequência e você se encontrará capaz de falar, pensar e escrever no código. Ainda assim, é natural que os iniciantes tenham dúvidas. Existem muitos recursos de codificação disponíveis para você, tanto on-and-off-line. Pergunte ao redor e você achará que não está sozinho - muitas outras pessoas estão aprendendo. Afinal, a codificação é uma educação sem fim. Mestre uma faceta ou outra e uma nova abre na sua frente.

Codificação de vocabulário

Codificação tem um extenso vocabulário que, para os leigos, pode parecer um tecno-balbucio impenetrável. Se você está lendo um artigo relacionado com a codificação on-line ou falando com um desenvolvedor no trabalho, você pode ouvir palavras que você não ouviu anteriormente ou que tenham um significado diferente em um contexto de codificação. Aqui estão algumas palavras comuns de vocabulário para saber:

• Termos gerais de desenvolvimento web:

  • Servidor: Um computador que hospeda o código do site e que "serve" o código do site quando solicitado por um computador "cliente". Os servidores geralmente se sentam em grandes armazéns com milhares de outros servidores, e são semelhantes em tamanho e energia para o seu computador doméstico.

  • Cliente: Um dispositivo usado para acessar um site, incluindo computadores desktop, laptops, tablets ou telefones celulares.

  • Designer: Um profissional artístico que decide como um site se parecerá, juntamente com as maneiras pelas quais os usuários irão interagir com o site - como, por exemplo, clicando, deslizando, deslocando e assim por diante.

  • Wireframe: Uma ilustração criada por designers que mostram em detalhes os layouts, imagens e esquemas de cores de um site.

  • Desenvolvedor: Um profissional de engenharia que escreve código para transformar wireframes em sites utilizáveis. Com base no tipo de código escrito, os desenvolvedores são referidos como front-end, back-end ou full stack.

  • Front-end: Tudo o que você pode ver e clicar em um navegador. Os desenvolvedores de front-end escrevem códigos em linguagens front-end como HTML, CSS e JavaScript para criar a aparência do site.

  • Back-end: Tudo o que acontece atrás das cenas para fazer o front-end funcionar como pretendido. Os desenvolvedores de back-end escrevem código em linguagens de back-end como Ruby ou Python para criar funcionalidades, como fazer logon em usuários, armazenar preferências de usuários e recuperar dados como comentários em uma foto.

• Termos relacionados com as linguagens front-end:

  • * HTML ( Hypertext Markup Language ): Um idioma usado para colocar texto, imagens e outros conteúdos em uma página da web.

  • tag HTML: instruções HTML, geralmente aparecendo em pares. Os navegadores aplicam efeitos especiais ao texto entre uma tag HTML de abertura e fechamento. Por exemplo, a marca

    torna um navegador como uma grande manchete em negrito e pode ser usada dessa maneira:

    Dewey bate Truman

    .

  • atributo HTML: Atributos ou parâmetros para tags HTML que modificam o comportamento da tag. Os atributos são sempre colocados na tag HTML de abertura. Por exemplo, href é o atributo na seguinte tag de âncora (usado para criar hiperlinks):

    Mecanismo de pesquisa
    

  • CSS ( Folhas de estilo em cascata): Código que modifica o HTML nas páginas da Web e que controla o aparência de conteúdo alterando o tamanho do texto, o tamanho da imagem e outros atributos.

  • JavaScript: Código que adiciona interatividade e animação a páginas da web. O JavaScript também detecta eventos do navegador, como cliques no mouse, valida a entrada do usuário, como entradas de texto, e recupera dados de sites externos.

  • Variável: Um local de armazenamento com um nome e que contém dados numéricos ou texto (referidos como strings ) para uso posterior.

  • Se declaração (condicional): Uma instrução de código que testa uma condição que geralmente inclui variáveis, como x <18, e executa o código que você escreve quando a condição é verdadeira.

  • Função: Um nome dado a um grupo de instruções de programação para fácil referência e uso.

• Termos relacionados a idiomas de back-end:

  • Ruby: Uma linguagem de programação de código aberto mais conhecida para uso em programação web.

  • Rails: Uma estrutura projetada para tornar a criação de páginas da web com Ruby fácil.

  • Python: Uma linguagem de programação de código aberto usada na web, em aplicações científicas e para análise de dados.

Referências e recursos de codificação

HTML, CSS e JavaScript são os idiomas de codificação front-end mais comuns. A tabela a seguir lista alguns recursos on-line, referências e tutoriais para ajudá-lo a continuar a praticar os três idiomas.

• W3Schools: guias de referência para HTML, CSS e JavaScript

• Folha de truques HTML: comandos HTML geralmente usados ​​

• Folha de truques CSS: comandos CSS mais utilizados

• Tutoriais HTML: Tutoriais e artigos para a web mantido pelo Google

• Tutoriais CSS: Tutoriais e artigos para programação web, com foco em CSS

• Tutoriais de JavaScript: Tutoriais e guias de referência para JavaScript

Erros comuns de codificação

O código não está funcionando? Aqui estão alguns erros comuns que podem tropeçar até mesmo o codificador mais experiente. Se o seu código não for executado, tente executar esta lista de verificação para ver se você tem algum desses erros:

• Não possui uma etiqueta HTML de fechamento após cada tag HTML de abertura.

• Suportes ausentes em HTML.

• Faltando braçadeiras curvas, dois pontos ou ponto e vírgula em CSS, como no seguinte:

  h1 {cor: azul;}
  

• Faltando chaves curvas em JavaScript, especialmente para afirmações if.

• Esquecendo de ter um par de parcerias de fechamento para cada par de citações de abertura.

• Tendo mais de uma tag de abertura e fechamento, tag ou tag.

• Colocando código HTML no arquivo ou seção CSS e colocando o código CSS na seção HTML. Se o código lidar com estilo e aparência, é provável CSS.

• Não vinculando ao seu arquivo CSS usando a tag e, portanto, seus efeitos CSS não são renderizados no navegador.

• Faltando uma parte de um comando, como em

  , que está incorreta porque o atributo é soletrado src não scr.

• Incluindo atributos fora da tag HTML de abertura. Por exemplo,

  src = "logo. jpg "está incorreto porque o atributo está fora da etiqueta de imagem de abertura.