https://github.com/denetodev/qr-code-component

Este projeto é uma solução para o desafio de componente de código QR no Frontend Mentor.
https://github.com/denetodev/qr-code-component

bootstrap5 css3 flexbox html5 mobile-first-workflow

Last synced: about 2 months ago
JSON representation

Este projeto é uma solução para o desafio de componente de código QR no Frontend Mentor.

• Host: GitHub
• URL: https://github.com/denetodev/qr-code-component
• Owner: denetodev
• Created: 2024-08-17T03:05:34.000Z (5 months ago)
• Default Branch: master
• Last Pushed: 2024-10-15T01:36:11.000Z (3 months ago)
• Last Synced: 2024-11-19T05:58:25.917Z (2 months ago)
• Topics: bootstrap5, css3, flexbox, html5, mobile-first-workflow
• Language: HTML
• Homepage: https://denetodev.github.io/QR-code-component/
• Size: 1.36 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Frontend Mentor - QR code component solution

Este projeto é uma solução para o [desafio de componente de código QR no Frontend Mentor](https://www.frontendmentor.io/challenges/qr-code-component-iux_sIO_H). Os desafios do Frontend Mentor ajudam a melhorar suas habilidades de codificação ao construir projetos realistas.

## Índice de conteúdos

- [Visão geral](#visão-geral)

  - [Screenshot](#screenshot)

  - [Links](#links)

- [Meu processo](#meu-processo)

  - [Construído com](#construído-com)

  - [O que eu aprendi](#o-que-eu-aprendi)

  - [Desenvolvimento contínuo](#desenvolvimento-contínuo)

  - [Recursos úteis](#recursos-úteis)

- [Autor](#autor)

- [Agradecimentos](#agradecimentos)

## Visão geral

### Screenshot

![Screenshot do Projeto](https://raw.githubusercontent.com/deusdeteneto/QR-code-component/master/design/desktop-design.jpeg)

### Links

- URL da Solução: [Adicionar URL da solução aqui](https://www.frontendmentor.io/solutions/qr-code-component-solution-eFCseqY80a)

- URL do Site: [Adicionar URL do site aqui](https://deusdeteneto.github.io/QR-code-component/)

## 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:

```html

  


    

  


```

### 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](https://getbootstrap.com/docs/5.3/getting-started/introduction/) - 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](https://css-tricks.com/snippets/css/a-guide-to-flexbox/) - Este guia foi muito útil para entender as nuances do Flexbox.

## Autor

- LinkedIn - [Deusdete Neto](https://www.linkedin.com/in/deusdeteneto)

- Frontend Mentor - [@deusdeteneto](https://www.frontendmentor.io/profile/deusdeteneto)

- GitHub - [Deusdete Neto](https://github.com/deusdeteneto)

## Agradecimentos

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