camila-github/projeto-bootstrap-parallax

FRONT END - Criação de uma pagina estática responsivo, utilizando Bootstrap + Parallax.

Projeto: Criação de uma pagina estatica responsivo, utilizando Bootstrap + Parallax

• O intuito do projeto foi criar uma pagina estatica, utilizando BootStrap + Parallax para sobreposição de imagens ao utilizar o scroll.

Ferramentas Utilizadas

BOOTSTRAP:

• Utilizado o link CDN que consta no site do bootstrap.

  https://getbootstrap.com/

JQUERY:

• Utilizado Jquery para uso do animate Scroll. Foi utilizado o link CDN que consta no site do Jquery CDN:

  https://code.jquery.com/

FONT AWESOME:

• Biblioteca de icones. Necessario fazer um cadastro, para obter um link e assim poder adicionar o link no projeto.

  https://fontawesome.com/

PROGRESS BAR JS:

• Utilizado ProgressBar.js, para criar barras de progresso responsivas circular. Foi utilizado o arquivo progressbar.min.js do link abaixo, que fica na pasta dist.

  https://github.com/kimmobrunfeldt/progressbar.js/tree/master/dist

PARALLAX:

• Utilizado para sobreposição de imagens ao utilizar o scroll. Utilizado o link CDN que consta no site abaixo.

  https://pixelcog.github.io/parallax.js/

GOOGLE FONTS:

• Utilizado a opção: roboto. Foi escolhido as fontes: Light 300, Regular 400, Bold 700.

  https://fonts.google.com/

Conceitos Utilizados:

• Criação de estrutura semântica no Html (SEO)
• Criaçao de Barra de navegação (Header e Navbar)
• Criação de SlideShow (Carousel)
• Criação de Containers, Row, Grid.
• Aplicação de Parallax e Progress Bar, que é a sobreposição de imagens ao utilizar o scroll.
• Criação de Cards
• Criação de filtro de Imagens
• Criação de formulario com Bootstrap
• Uso de icones com Font Awesome (Biblioteca de icones)
• Responsividade (Tablet e Mobile)
• Aplicação de conceitos Clean Code.
• Uso do animate()Scroll do Jquery, que é para o menu acessar as sessões da pagina.

Site Publicado no link abaixo

https://camila-github.github.io/projeto-bootstrap-parallax/index.html