Classificação:
100 % of 100
136 alunos

Torne-se um desenvolvedor Magento Front End (com Bootstrap 4)

Entenda como o Magento funciona e tudo que envolve o desenvolvimento frontend (para criação de temas) de forma profissional e prática.
Instrutor: Ricardo Martins
Última Atualização: 03/2023
  • Intermediário
  • 38 aulas
  • 06h08
  • 1
  • português (Brasil)
de US$ 32,18 por US$ 15,93
Desbloquear este Curso

Ou pague apenas US$ 12,68/mês e tenha acesso a todos os cursos do Magenteiro.

Assinar o Clube Magenteiro
Continuar de onde parei

Você já comprou este curso.

Este curso inclui:

  • Acesso vitalício individual
  • Certificado online de conclusão
  • Garantia de arrependimento até 14 dias
  • Acesso a todo conteúdo exclusivo

Neste curso abordaremos tudo sobre a criação de temas e desenvolvimento frontend para Magento 1.x ou OpenMage.

A versão traduzida deste treinamento foi Eleito o melhor curso online de E-commece pela Online courses Review em 2018.

Entenda tudo o que precisa para começar a criar temas e modificar o visual de sua loja Magento.

Pré-requisitos

  • Conhecimento básico sobre Magento
  • XML, HTML e CSS Básico

O que você aprenderá

  • Estrutura básica de pastas do Magento
  • Criação de temas e pacotes
  • Alterar visualmente qualquer elemento do site da forma correta, mantendo a plataforma apta a ser atualizada sem riscos ou surpresas desagradáveis
  • Internacionalização/tradução de temas e pacotes
  • Entendimento sobre Layout XML e como podemos fazer (quase) tudo com eles
  • Tipos de blocos do Magento
  • Adicionar e remover elementos de qualquer página através com os XMLs de nossos temas ou via painel
  • Diversas formas de traduzir termos na nossa loja
  • Como converter um tema de e-commerce com Bootstrap 4

Bônus

Ao se inscrever neste curso, você receberá alguns bônus. São ferramentas (opcionais) que mostrarei ao longo do curso e descontos exclusivos em sites parceiros.

  • 6 meses de PhpStorm Personal Edition equivalente a USD 53,40
  • Link exclusivo Magicento 1 por USD 25 (desconto de USD 14)
  • 30% de desconto no FireCheckout (+/- USD 56)
  • 10% de desconto na compra de temas no Template Monster

Total da economia: USD 123,40+ (equivalente a mais de R$492,00)

Pra quem é este curso?

  • Desenvolvedores Frontend interessados em aprender Magento
  • Desenvolvedores Magento interessados a entender o frontend da plataforma

Conteúdo do curso

Expandir todos os módulos
  • Módulo 1

    Introdução

    2 aulas 05:32
    • O que esperar desse curso?

      Inclui links exclusivos e parceiros

      02:31
    • Ferramentas úteis (e que utilizaremos nesse curso)

      Nesta aula apresentarei 2 das minhas ferramentas preferidas para desenvolver com Magento, e tudo o que você precisa configurar ou ter para começar as aulas.

      03:01
  • Módulo 2

    Entendendo a estrutura de temas do Magento

    5 aulas 47:13
    • Bem-vindo oficialmente

      Permita-me lhe dar as boas vindas de verdade

      01:05
    • Estrutura de pastas

      Nesta aula falaremos sobre as principais pastas que usaremos no decorrer do curso e na vida de um desenvolvedor frontend Magento. Entre outras coisas, aprenderemos também como desativar módulos de forma segura em nossa loja.

      Assistir 09:24
    • Fallback de pastas de design/templates

      Entenda em qual ordem o Magento irá buscar por arquivos de template, xml e temas na sua loja.

      13:01
    • Alterando pacotes e temas da minha loja

      Dando continuação à aula anterior sobre hierarquias, vamos ver na prática como o magento faz o fallback de temas e vamos brincar um pouco, alterando o tema da nossa loja com outros temas nativos do magento.

      07:11
    • Outras formas de se alterar um tema

      Na aula anterior vimos como alterar o nosso tema e nosso pacote da forma normal. Na certificação e na vida do desenvolvedor frontend Magento, precisamos conhecer as outras formas de se alterar um tema e entender em que situação devemos usar cada uma dela

      16:32
  • Módulo 3

    Layout XML e Temas

    7 aulas 01:11:54
    • Bem-vindo à seção 3

      Vamos lá?

      01:04
    • Criando um pacote(package) e um tema(theme)

      Nesta aula vamos criar nosso primeiro package e nosso primeiro tema. E ainda vamos sobrescrever um arquivo do tema do magento, usando recursos novos de hierarquia da versão 1.9.

      15:44
    • Introdução aos XML's de Layout

      Vamos conhecer um pouquinho da parte mais importante no desenvolvimento de temas: os arquivos de XML

      05:59
    • Tipos de Blocos e processamento dos XML's

      Nesta aula vamos conhecer os dois tipos de blocos que o magento trabalha, pra que eles servem, o que fazem e como o magento lê e processa os arquivos de Layout XML.

      06:20
    • Entendendo a estrutura de um XML de Layout na prática

      Nesta aula falarei sobre a estrutura de um XML de Layout, sobre os principais blocos, métodos, e alguns dos recursos dessa poderosa ferramenta.

      12:05
    • Modificando um tema via layout XML

      Nesta aula vamos ver como é possível adicionar um bloco de texto em páginas específicas, gerenciar a posição do bloco, e como isso pode ser feito também sem modificar nenhum arquivo, apenas pelo painel do Magento.

      16:57
    • Inserindo JS e CSS em páginas específicas via XML

      Vamos estudar os principais métodos do bloco head, que nos permite adicionar JS e CSS de diferentes lugares. E por fim, vamos ver como adicionar um JS e um CSS nas páginas de produtos da nossa loja utilizando o handle catalog_product_view.

      13:45
  • Módulo 4

    Um pouco mais sobre blocos

    2 aulas 16:18
    • Criando um bloco com arquivo de template

      Vamos criar um arquivo phtml e inserir ele em nossas páginas. Também falarei sobre algumas normatizações de variáveis e estruturas de if e else, e veremos como o template do bloco de listagem de produtos funciona.

      11:16
    • Inserindo um bloco estático via layout XML

      Nesta aula vamos conhecer os Blocos Estáticos, e como eles podem ajudar na manutenção da nossa loja, dando a possibilidade do nosso administrador alterar informações preciosas pelo próprio painel do Magento.

      05:02
  • Módulo 5

    JavaScript e validações

    2 aulas 23:43
    • Validação de formulários via JavaScript e campo CPF

      Nesta aula vamos falar sobre a forma como o magento valida formulários via JavaScript e ainda veremos como adicionar uma classe de validação customizada. E de presente ainda vamos ver como adicionar o campo de CPF no nosso checkout e duas formas de adicio

      17:35
    • Estendendo uma classe JavaScript nativa

      Nesta aula veremos uma forma simples de se estender um método nativo do Magento, utilizando o wrap() do prototype.

      06:08
  • Módulo 6

    Criando um tema do zero

    2 aulas 18:48
    • Bônus: 3 dicas importantes para o sucesso do desenvolvimento

      Embora esta aula não seja tão focada apenas no desenvolvimento de temas, apresento 3 dicas importantes para um bom desenvolvimento de lojas em todo o ciclo de vida da mesma.

      07:57
    • Criando a estrutura e começando o desenvolvimento

      Nesta aula vamos ver como se dá o começo do desenvolvimento de um novo tema, e como informamos ao magento como definir o template do esqueleto principal de uma página (root template).

      10:51
  • Módulo 7

    Traduções e internacionalização

    2 aulas 20:07
    • Tipos de traduções e suas prioridades

      Falaremos de tradução inline, via tema, e por pacote/módulo

      13:19
    • Traduzindo com JavaScript

      O Magento oferece suporte também à traduções em arquivos JavaScript. Nesta aula abordaremos como isso funciona.

      06:48
  • Módulo 8

    SaaS, Compass e a nova forma de escrever CSS

    2 aulas 25:12
    • O que você precisa saber sobre a nova forma de escrever CSS no Magento

      Nas versões mais recentes, a forma de se escrever CSS ficou mais fácil, prática e eficaz. Nesta aula vamos ver como usar o Compass, um framework CSS.

      14:34
    • Inspecionando elementos e versionando compass

      Como descobrir em qual .scss foi declarada uma regra css? Como versionar arquivos CSS gerados pelo compass?

      10:38
  • Módulo 9

    Criando um tema do zero com Bootstrap 4

    13 aulas 02:18:20
    • Introdução ao Bootstrap

      Vamos conhecer um pouco do Bootstrap e do tema html que vamos baixar

      05:02
    • Criação do tema e começando a se organizar

      Vamos começar a criar nosso tema e organizar os arquivos dele

      Assistir 11:19
    • Construindo o HEAD igual o do template

      Vamos modificar o <head> do nosso tema usando métodos nativos para deixar igual o tema desejado

      18:49
    • Adicionando CSS ou JS Externo ao Magento (forma nativa)

      Adicionando CSS e JS externos do nosso tema

      02:09
    • Customizando menu e outras partes do topo

      Substituindo e customizando elementos do menu e outros elementos do topo do nosso tema

      19:10
    • Customizando menu e outras partes do topo - Parte 2

      Continuação da nossa customização e desenvolvimento com dicas pontuais

      11:02
    • Inserindo JS Complementares e inteligência do contador de items

      Nosso tema tem um carrinho lateral. Vamos ver como implementá-lo, além de outras inteligências pontuais

      Assistir 10:21
    • Inserindo outros conteúdos com blocos estáticos

      Como e onde usar blocos estáticos no nosso tema para dar flexibilidade ao administrador da loja

      11:11
    • Dando inteligência para o bloco de citação

      Vamos dar alguma inteligência para o bloco com a frase de impacto do nosso tema

      Assistir 02:55
    • Bloco Mais Vendidos - Parte 1

      Veja como vamos trabalhar com a lista de produtos mais vendidos na home do nosso tema

      13:55
    • Bloco Mais Vendidos - Parte 2

      Como redimensionar imagens e debugar collections no Magento

      08:04
    • Footer da Loja

      Como customizar o footer, com links dinâmicos, variáveis personalizadas, e valores da configuração da loja

      19:55
    • Resumo da seção e próximos passos

      Um wrap up do que vimos, algumas considerações e os próximos passos paras evoluir ainda mais

      Assistir 04:28
  • Módulo 10

    Encerramento

    1 aulas 01:32
    • Parabéns! Você é um desenvolvedor Magento!

      Obrigado pela companhia. Nos vemos por aí.

      01:32

Instrutor

Ricardo Martins
Desenvolvedor Certificado Magento / Instrutor Magento
98 Classificação do Instrutor
59 avaliações
4661 alunos
10 cursos
Desenvolvedor Magento desde 2011 e instrutor Magento desde 2015 com 12+ cursos publicados e 18.000+ alunos de 108+ países. Adoro criar conteúdo que ajudem a melhorar o ecossistema de desenvolvedores.
Avaliações do curso
  1. Valeu cada segundo!
    Avaliação Geral
    100%
    avaliado por em
    Gostei muito do curso. Recomendo!!
    Já trabalhava com Magento, mas fazendo o curso pude perceber que muita coisa eu resolvia da maneira errada. Esse curso me ajudou demais a entender melhor o funcionamento e a estrutura do Magento.
  2. Gostei muito
    Avaliação Geral
    100%
    avaliado por em
    Melhor curso que encontrei em Português - BR. Merece ter mais conteúdo ou um novo curso parte 02. Obrigado Ricardo.
  3. Melhor Curso
    Avaliação Geral
    100%
    avaliado por em
    Esse curso é excelente. Dentre todo o material em português que procurei, certamente esse curso é o mais completo! Aborda inclusive temas como o Prototype e a maneira que ele funciona no Magento (material que dificilmente é encontrado em outro lugar). O curso não só te dá a base para começar no desenvolvimento frontend Magento da maneira correta, mas também te dá toda a preparação para avançar nos estudos e conseguir a certificação. Além da incrível didática e atenção do Ricardo Martins. Recomendo muito!
  4. Curso muito bom
    Avaliação Geral
    100%
    avaliado por em
    Curso muito bom, realmente foi aprendido coisas de grandes valias para minha vida como desenvolvedor Magento espero que possa lançar o de backend logo certamente o farei.
  5. Muito bom
    Avaliação Geral
    100%
    avaliado por em
    O professor Ricardo sempre pronto a responder, melhor investimento em cursos que fiz na udemy, as aulas são bem objetivas
  6. Muito bom!
    Avaliação Geral
    100%
    avaliado por em
    Gostei muito do curso, irei recomendar.