Giter Club home page Giter Club logo

on5-bootstrap's Introduction

O que é um framework?

É uma estrutura base, uma plataforma de desenvolvimento ele contém ferramentas, guias, sistemas e componentes que agilizam o processo de desenvolvimento de soluções. Basicamente, é um template com diversas funções que podem ser usadas pelo desenvolvedor. Com ele, é desnecessário gastar tempo para reproduzir a mesma função em diferentes projetos, auxiliando em um gerenciamento ágil de projetos.

Assim um Framework tem como principal objetivo resolver problemas recorrentes com uma abordagem genérica, permitindo ao desenvolvedor focar seus esforços na resolução do problema em si, e não ficar reescrevendo software.

O que é Bootstrap?

É um dos frameworks front-end mais conhecidos do mundo, especialmente utilizado para criar sites responsivos e mobile. Desenvolvido por Mark Otto e Jacob Thornton no Twitter. Foi lançado como um produto de seu código aberto em agosto de 2011 no GitHub.

Porquê usar?

Com o Bootstrap, o profissional já não tem mais que perder tanto tempo digitando toda uma linha de CSS novamente. Esta facilidade se deve ao fato de que ele possui vários plugins em JavaScript (jQuery) que tornam o seu dia-a-dia muito mais fácil.

Vantagens do Bootstrap

Características que fazem o Bootstrap valer a pena: Biblioteca de componentes Reuso de código Documentação e comunidade Padrão visual Responsividade E muito mais!

Desvantagens

Excesso de padronização

Quem usa Bootstrap hoje?

Pesquisas afirmam que cerca de 7 milhões de sites utilizam o Bootstrap dentre eles: Aiirbnb WalMart Target NBA Globo

Agora mão na massa!

Documentação em Português

Vamos começar com as CDNs, mas o que são as CDNs

As CDN — sigla em inglês para Content Delivery Network ou Rede de Distribuição de Conteúdo (tradução livre) são redes de conteúdo não centralizadas. Ou seja, elas hospedam um determinado conteúdo em servidores espalhados em várias partes, permitindo dessa forma a distribuição de forma eficaz independente de onde o acesso é realizado. Existem várias redes CDN, e qualquer empresa pode contratar o serviço de uma para seu sistema, e essa decisão normalmente é tomada levando em conta vários aspectos como ganhos de performance, segurança e custos. O uso de CDNs pode ser indicado para ambientes de desenvolvimento e páginas estáticas.

Como instalar o Bootstrap via CDN no seu projeto? A instalação por CDN é a maneira mais rápida de instalar o Bootstrap no seu projeto, sem a necessidade de baixar os arquivos e adicioná-los no seu diretório. Copie e cole o arquivo de estilo abaixo, dentro da sua antes de todos os outros arquivos de estilo para carregar o CSS.

Colar no head

Colar no script no final do body

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

Esse sera o nosso projeto:

Vamos aprender a usar: NavBar Carrossel cards menu modal form

Prontas para o exercício?

Exercícios

Landpage responsiva

Tema

Use sua criatividade, você pode abordar o assunto que quiser!

Requisitos:

1 - Sua landpage deverá ter os itens que aprendemos na aula:

  • NavBar, Carrossel, Menu, Card, Modal, Form

2 - Usar uma fonte do goolgle fontes ou equivalente: Google Fontes

3 - Usar icones de redes sociais iimportados do Fontaweesome: Fontaweesome Lembre-se de sempre consultar a docummentação do Bootstrap.

Links para apoio:

Grid FlexBox

on5-bootstrap's People

Contributors

lprimante avatar re-andrade1987 avatar

Stargazers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.