💻 Frontend Mentor - Huddle landing page with a single introductory section

Essa é a solução do desafio Huddle landing page with a single introductory section.

🧵 Índice

• Desafio
  • Screenshot
  • Links
  • Como Contribuir
  • Meu Processo
  • Construído com
  • O que eu aprendi
• Autor

O desafio

• Os usuários devem ser capazes de vizualizar o layout ideal dependendo da tela do dispositivo.

Screenshot

🖇 Links

• URL do desafio
• URL Solução

♻ Como Contribuir

  # Clone the project
  $ git clone https://github.com/monsor3s/hundlepage.git

  # Enter directory
  $ cd hundlepage

  # Install the dependencies, if use npm
  $ npm install
  $ npm install --save styled-components
  $ npm install --save @fortawesome/fontawesome-free

or

  # Install the dependencies, if use yarn
  $ yarn install
  $ yarn add styled-components
  $ yarn add @fortawesome/fontawesome-free

Meu Processo

🛠 Construído com

• Flexbox
• CSS Grid
• Design Responsivo
• React - JS library
• Styled Components - For styles

📝 O que eu aprendi

O uso da ferramenta FontAwesome para obter ícones para a página.

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { fab, faFacebookF, faInstagram, faTwitter } from '@fortawesome/free-brands-svg-icons';

library.add( fab, faFacebookF, faTwitter, faInstagram )

const fbLookup: IconLookup = { prefix: 'fab', iconName: 'facebook-f' }
const ttLookup: IconLookup = { prefix: 'fab', iconName: 'twitter' }
const instLookup: IconLookup = { prefix: 'fab', iconName: 'instagram' }

🙋🏻‍♂️ Autor

• Linkedln - @Linkedln
• Frontend Mentor - @monsor3s