Frontend Mentor - QR code component solution

Este projeto é uma solução para o desafio de componente de código QR no Frontend Mentor. Os desafios do Frontend Mentor ajudam a melhorar suas habilidades de codificação ao construir projetos realistas.

Índice de conteúdos

• Visão geral
  • Screenshot
  • Links
• Meu processo
  • Construído com
  • O que eu aprendi
  • Desenvolvimento contínuo
  • Recursos úteis
• Autor
• Agradecimentos

Visão geral

Screenshot

Links

• URL da Solução: Adicionar URL da solução aqui
• URL do Site: Adicionar URL do site aqui

Meu processo

Construído com

• HTML5 semântico
• Propriedades personalizadas de CSS
• Flexbox
• Bootstrap 5.3.3
• Workflow mobile-first

O que eu aprendi

Durante o desenvolvimento deste projeto, aprendi a trabalhar com a centralização de elementos usando Flexbox e a aplicação de classes utilitárias do Bootstrap para simplificar a estilização dos componentes. Também aprofundei meus conhecimentos na criação de componentes responsivos.

Aqui está um exemplo de código que utilizei:

<main class="d-flex justify-content-center align-items-center vh-100">
  <div class="card text-center p-3 rounded-4 shadow-lg" style="width: 18rem">
    <!-- Conteúdo do cartão -->
  </div>
</main>

Desenvolvimento contínuo

Para projetos futuros, quero continuar a melhorar minha habilidade de trabalhar com CSS Grid e explorar mais os componentes e recursos avançados do Bootstrap.

Recursos úteis

• Documentação do Bootstrap - A documentação oficial do Bootstrap foi essencial para entender como utilizar classes utilitárias de maneira eficiente.
• CSS Tricks - A Complete Guide to Flexbox - Este guia foi muito útil para entender as nuances do Flexbox.

Autor

• LinkedIn - Deusdete Neto
• Frontend Mentor - @deusdeteneto
• GitHub - Deusdete Neto

Agradecimentos

Gostaria de agradecer à comunidade do Frontend Mentor pelas discussões inspiradoras e feedback construtivo durante este desafio.