#Folia de descontos TreinaWeb - 30% OFF em todo site
Curso de CSS3 - Less e Sass Avançado 30%

Curso de

CSS3 - Less e Sass Avançado

Aprenda a utilizar os pré-processadores LESS e SASS de CSS, para melhorar seu trabalho na Camada de Apresentação e otimizar, em dezenas de vezes, seu fluxo de trabalho.

Adquira este curso de forma avulsa

Curso de CSS3 - Less e Sass Avançado

CSS3 - Less e Sass Avançado 30% OFF

de 6x R$ 23,32 por 6x R$ 16,32

R$ 97,93 à vista

Informações sobre o curso

Sobre o curso

A web (e suas tecnologias inerentes) em essência é mutável, e novas tecnologias surgem para suprir necessidades e falhas das precedentes e, até mesmo, para mudar a maneira como determinadas tarefas e consecução de objetivos são feitos.

Foi o que aconteceu com o advento dos pré-processadores de CSS: a maneira (atual) como o CSS é escrito e usado mudou bastante, muito mesmo, com a “incorporação” de determinados recursos e facilidades que, somente há alguns anos, faziam parte apenas das expectativas otimistas dos desenvolvedores de front-end.

Felizmente, os pré-processadores são uma realidade hoje e milhares de desenvolvedores estão otimizando a maneira como escrevem CSS e melhorando seus workflows através das facilidades e comodidades que os pré-processadores oferecem.

Com pré-processadores CSS temos facilidades que podem ser usadas no momento da escrita das Folhas de Estilo, tais como: Usar variáveis CSS, funções e operações CSS, aninhamento de regras, operações aritméticas, importação de outros arquivos para processamento, etc. Como resultado disso, o que temos? Menos código, mais reaproveitamento, mais organização etc.

Essas e outras facilidades intrínsecas são possíveis com o uso de pré-processadores CSS, sendo, por isso, que eles estão cada vez mais usados e mais desenvolvedores estão melhorando seus fluxos de criação e manutenção de CSS pelo mundo todo.

Conhecimentos adquiridos

No curso de CSS3 Avançado – Less e Sass do TreinaWeb Cursos, você irá aprender sobre o desenvolvimento web e sobre o desenvolvimento “em camadas”. Saberá um pouco sobre a história desse tipo de desenvolvimento e também sobre o que são pré-processadores.

Após aprender esses conceitos principais você aprenderá um pouco mais sobre os pré-processadores de CSS e logo em seguida aprenderá sobre LESS, como instalá-lo e como trabalhar com LESS.

Aprenderá sobre Mixins, Guards, o uso avançado de “&”, operações, funções, namespaces, escopo, importação, a fiferença entre @import com CSS e LESS e muitos outros temas. Além de ter uma referência de funções LESS com diversas funções disponíveis.

Você também aprenderá a usar LESS client-side e server-side e ao fim dos estudos do LESS você criará um projeto final completo utilizando os itens abordados no curso.

Após estudar LESS você estudará SASS e suas duas sintaxes. Irá aprender a preparar um ambiente de testes com o Ruby para efetuar os testes do SASS e depois aprenderá a compilar SASS de forma “manual” e automática. Além de aprender sobre a compilação Convertida, que também pode ser chamada de Compilação Reversa ou Engenharia Reversa.

Com o ambiente totalmente configurado e com o SASS compilado você aprender sobre as principais funcionalidades de SASS, tais como aninhamentos, referência ao ascendente, variáveis, operações, funções, compass e muito mais.

Quais os pré-requisitos para esse curso?

Os pré-requisitos não são obrigatórios, mas eles dão uma base de parte do conhecimento necessário que se precisa ter para fazer esse curso.

Carga horária do curso

1h51

Curso com 1h51 horas de vídeos

40h

Curso com certificado de 40 horas

Ambiente do curso

  • Less 1.3.3 ou superior
  • Firefox com extensão Firebug
  • Sublime Text 2
  • Rubyinstaller 1.9.3 ou superior
  • Sass 3.2.5 ou superior
  • Compass 0.12.2 ou superior

Metodologia

  • Vídeo-aulas
  • Texto e imagens
  • Início imediato
  • Exemplos práticos

Satisfação garantida ou seu dinheiro de volta!

Adquira este curso agora mesmo

Curso de CSS3 - Less e Sass Avançado

CSS3 - Less e Sass Avançado 30% OFF

de 6x R$ 23,32 por 6x R$ 16,32

R$ 97,93 à vista

Conteúdo programático Baixar esta ementa

Tópicos do Curso

  1. Códigos, imagens, diagramas etc.

    Desenvolvimento Web
  2. Códigos, imagens, diagramas etc.

    Desenvolvimento “em camadas”
  3. Códigos, imagens, diagramas etc.

    As folhas de estilo CSS
  4. Códigos, imagens, diagramas etc.

    Um pouco de história
  5. Códigos, imagens, diagramas etc.

    O que são pré-processadores
  6. Códigos, imagens, diagramas etc.

    Pré-processadores de CSS: uma evolução necessária
  7. Códigos, imagens, diagramas etc.

    LESS
  8. Códigos, imagens, diagramas etc.

    Instalando o LESS
  9. Códigos, imagens, diagramas etc.

    LESS client-side
  10. Códigos, imagens, diagramas etc.

    Ambiente de trabalho
  11. Códigos, imagens, diagramas etc.

    Criando o primeiro exemplo
  12. Códigos, imagens, diagramas etc.

    Configurando o Sublime Text
  13. Códigos, imagens, diagramas etc.

    Trabalhando com LESS
  14. Códigos, imagens, diagramas etc.

    Variáveis
  15. Códigos, imagens, diagramas etc.

    Mixins
  16. Códigos, imagens, diagramas etc.

    Mixins com parâmetros
  17. Códigos, imagens, diagramas etc.

    A variável @arguments
  18. Códigos, imagens, diagramas etc.

    Argumentos avançados e a variável @rest
  19. Códigos, imagens, diagramas etc.

    Pattern-matching e expressões Guard
  20. Códigos, imagens, diagramas etc.

    Guards
  21. Vídeoaula com duração de: 00:10:21

    Loop no less
  22. Códigos, imagens, diagramas etc.

    Regras aninhadas
  23. Códigos, imagens, diagramas etc.

    Media Queries aninhadas
  24. Vídeoaula com duração de: 00:13:58

    Trabalhando com media queries
  25. Códigos, imagens, diagramas etc.

    Uso avançado de “&”
  26. Códigos, imagens, diagramas etc.

    Operações
  27. Códigos, imagens, diagramas etc.

    Funções
  28. Códigos, imagens, diagramas etc.

    Namespaces
  29. Códigos, imagens, diagramas etc.

    Escopo
  30. Códigos, imagens, diagramas etc.

    Comentários
  31. Códigos, imagens, diagramas etc.

    Importação
  32. Códigos, imagens, diagramas etc.

    Diferença entre @import com CSS e LESS
  33. Códigos, imagens, diagramas etc.

    Interpolação de strings
  34. Códigos, imagens, diagramas etc.

    Escaping
  35. Códigos, imagens, diagramas etc.

    Interpolação de seletores
  36. Códigos, imagens, diagramas etc.

    Avaliação (evaluation) de JavaScript
  37. Códigos, imagens, diagramas etc.

    Referência de funções LESS
  38. Códigos, imagens, diagramas etc.

    Funções de string
  39. Códigos, imagens, diagramas etc.

    e
  40. Códigos, imagens, diagramas etc.

    %
  41. Códigos, imagens, diagramas etc.

    unit
  42. Códigos, imagens, diagramas etc.

    Funções matemáticas
  43. Códigos, imagens, diagramas etc.

    ceil
  44. Códigos, imagens, diagramas etc.

    floor
  45. Códigos, imagens, diagramas etc.

    percentage
  46. Códigos, imagens, diagramas etc.

    round
  47. Códigos, imagens, diagramas etc.

    Funções de cores
  48. Códigos, imagens, diagramas etc.

    rgba
  49. Códigos, imagens, diagramas etc.

    argb
  50. Códigos, imagens, diagramas etc.

    hsl
  51. Códigos, imagens, diagramas etc.

    hsla
  52. Códigos, imagens, diagramas etc.

    hsv
  53. Códigos, imagens, diagramas etc.

    hsva
  54. Códigos, imagens, diagramas etc.

    Informação sobre canal de cor
  55. Códigos, imagens, diagramas etc.

    saturation
  56. Códigos, imagens, diagramas etc.

    lightness
  57. Códigos, imagens, diagramas etc.

    red
  58. Códigos, imagens, diagramas etc.

    green
  59. Códigos, imagens, diagramas etc.

    blue
  60. Códigos, imagens, diagramas etc.

    alpha
  61. Códigos, imagens, diagramas etc.

    luma
  62. Códigos, imagens, diagramas etc.

    Operações de cor
  63. Códigos, imagens, diagramas etc.

    desaturate
  64. Códigos, imagens, diagramas etc.

    lighten
  65. Códigos, imagens, diagramas etc.

    darken
  66. Códigos, imagens, diagramas etc.

    fadein
  67. Códigos, imagens, diagramas etc.

    fadeout
  68. Códigos, imagens, diagramas etc.

    fade
  69. Códigos, imagens, diagramas etc.

    spin
  70. Códigos, imagens, diagramas etc.

    mix
  71. Códigos, imagens, diagramas etc.

    greyscale
  72. Códigos, imagens, diagramas etc.

    contrast
  73. Códigos, imagens, diagramas etc.

    Mistura de cor
  74. Códigos, imagens, diagramas etc.

    multiply
  75. Códigos, imagens, diagramas etc.

    screen
  76. Códigos, imagens, diagramas etc.

    overlay
  77. Códigos, imagens, diagramas etc.

    softlight
  78. Códigos, imagens, diagramas etc.

    hardlight
  79. Códigos, imagens, diagramas etc.

    difference
  80. Códigos, imagens, diagramas etc.

    exclusion
  81. Códigos, imagens, diagramas etc.

    average
  82. Códigos, imagens, diagramas etc.

    negation
  83. Códigos, imagens, diagramas etc.

    Primeiro projeto do curso
  84. Códigos, imagens, diagramas etc.

    HTML
  85. Códigos, imagens, diagramas etc.

    LESS
  86. Códigos, imagens, diagramas etc.

    Variáveis & Mixins
  87. Códigos, imagens, diagramas etc.

    Estilos
  88. Códigos, imagens, diagramas etc.

    Aninhamento de seletores
  89. Códigos, imagens, diagramas etc.

    &
  90. Códigos, imagens, diagramas etc.

    Variáveis
  91. Códigos, imagens, diagramas etc.

    Funções
  92. Códigos, imagens, diagramas etc.

    Ferramentas para compilação client-side
  93. Códigos, imagens, diagramas etc.

    LESS server-side
  94. Códigos, imagens, diagramas etc.

    Criando um Build System Less no Sublime
  95. Códigos, imagens, diagramas etc.

    Qual é o melhor método, client-side ou server-side?
  96. Códigos, imagens, diagramas etc.

    Less Elements e Less Hat
  97. Códigos, imagens, diagramas etc.

    Projeto final – Less
  98. Códigos, imagens, diagramas etc.

    Convertendo o projeto para Less
  99. Códigos, imagens, diagramas etc.

    Alterando os estilos do projeto
  100. Vídeoaula com duração de: 00:15:55

    Trabalhando com Bootstrap
  101. Códigos, imagens, diagramas etc.

    SASS
  102. Códigos, imagens, diagramas etc.

    Duas sintaxes para SASS
  103. Códigos, imagens, diagramas etc.

    Preparando o ambiente
  104. Códigos, imagens, diagramas etc.

    Instalando o Ruby
  105. Códigos, imagens, diagramas etc.

    Instalando SASS
  106. Códigos, imagens, diagramas etc.

    Instalação padrão
  107. Códigos, imagens, diagramas etc.

    Prerelease gem
  108. Códigos, imagens, diagramas etc.

    Instalando SASS pelo Git
  109. Códigos, imagens, diagramas etc.

    Configurando o SASS no Sublime Text
  110. Códigos, imagens, diagramas etc.

    Compilando SASS
  111. Códigos, imagens, diagramas etc.

    Compilação “manual”
  112. Códigos, imagens, diagramas etc.

    Compilação automática: vigiando mudanças
  113. Códigos, imagens, diagramas etc.

    Compilação Convertida ou Compilação Reversa ou Engenharia Reversa
  114. Códigos, imagens, diagramas etc.

    Palavras finais sobre compilação de arquivos SASS
  115. Códigos, imagens, diagramas etc.

    Principais funcionalidades de SASS
  116. Códigos, imagens, diagramas etc.

    Aninhamentos
  117. Códigos, imagens, diagramas etc.

    Referência ao ascendente
  118. Códigos, imagens, diagramas etc.

    Variáveis
  119. Códigos, imagens, diagramas etc.

    Operações e Funções
  120. Códigos, imagens, diagramas etc.

    Interpolação
  121. Códigos, imagens, diagramas etc.

    Mixins
  122. Vídeoaula com duração de: 00:14:58

    Bibliotecas de mixins no Sass
  123. Códigos, imagens, diagramas etc.

    Argumentos
  124. Códigos, imagens, diagramas etc.

    @import
  125. Vídeoaula com duração de: 00:08:08

    Loops no Sass
  126. Códigos, imagens, diagramas etc.

    @extend
  127. Códigos, imagens, diagramas etc.

    Como @extend funciona
  128. Códigos, imagens, diagramas etc.

    Compass
  129. Códigos, imagens, diagramas etc.

    Instalando o Compass
  130. Códigos, imagens, diagramas etc.

    Iniciando um projeto SASS/Compass
  131. Vídeoaula com duração de: 00:19:50

    Grid no Compass
  132. Códigos, imagens, diagramas etc.

    Criando um projeto Compass que usa o Zurb Foundation
  133. Vídeoaula com duração de: 00:14:34

    Sprites no Compass
  134. Códigos, imagens, diagramas etc.

    Continuando os estudos com SASS/Compass
  135. Vídeoaula com duração de: 00:13:21

    Media queries no Compass
  136. Códigos, imagens, diagramas etc.

    Conclusão

Adquira este curso agora mesmo

Curso de CSS3 - Less e Sass Avançado

CSS3 - Less e Sass Avançado 30% OFF

de 6x R$ 23,32 por 6x R$ 16,32

R$ 97,93 à vista

Vantagens de estudar no Treinaweb

Início imediato! Não é necessário aguardar a formação de turmas.

Defina o horário que quiser e estude de onde estiver.

Após o curso, você ainda tem 2 anos para revisar o conteúdo.

Assim que finalizar, receba o certificado em casa, sem custo adicional.

Escolha o dispositivo que preferir: PC, Tablet ou Smartphone.

Se surgir alguma dúvida, basta perguntar aos nossos instrutores.

Satisfação garantida ou seu dinheiro de volta.

40h

Curso com certificado de 40 horas

O que os alunos dizem?

Ótimo curso! Como sempre equipe TreinaWeb está de parabéns!

Adquira este curso de forma avulsa

Curso de CSS3 - Less e Sass Avançado

CSS3 - Less e Sass Avançado 30% OFF

de 6x R$ 23,32 por 6x R$ 16,32

R$ 97,93 à vista

Quer ter acesso completo a todos os nossos cursos?

Escolha um dos planos abaixo e comece agora mesmo!

30% OFF
1 ano
De 12x R$ 99
12x 69 reais
ou por R$ 828,00 à vista
  • 1 ano de acesso a todos os cursos
  • Cursos novos toda semana
  • Certificados digitais
  • Suporte com SLA de 4 horas úteis
    Suporte exclusivo, feito diretamente por nossos professores. SLA = Tempo médio para resposta.
  • Lançamentos e atualizações
  • Plano de estudos individual
    Plano de estudos desenvolvido junto a um professor orientador
Matricule-se
30% OFF
3 anos
De 12x R$ 199
12x 139 reais
ou por R$ 1.668,00 à vista
  • 3 anos de acesso a todos os cursos
  • Cursos novos toda semana
  • Certificados digitais
  • Suporte com SLA de 4 horas úteis
    Suporte exclusivo, feito diretamente por nossos professores. SLA = Tempo médio para resposta.
  • Lançamentos e atualizações
  • Plano de estudos individual
    Plano de estudos desenvolvido junto a um professor orientador
Matricule-se
30% OFF
5 anos
De 12x R$ 256
12x 179 reais
ou por R$ 2.148,00 à vista
  • 5 anos de acesso a todos os cursos
  • Cursos novos toda semana
  • Certificados digitais
  • Suporte com SLA de 4 horas úteis
    Suporte exclusivo, feito diretamente por nossos professores. SLA = Tempo médio para resposta.
  • Lançamentos e atualizações
  • Plano de estudos individual
    Plano de estudos desenvolvido junto a um professor orientador
Matricule-se

Cursos relacionados