Anonim

Se você nunca ouviu falar do Bootstrap, uma estrutura desenvolvida pelo Twitter para criar sites bonitos, está perdendo! O Bootstrap torna bastante rápido e fácil criar um site sem muito conhecimento em CSS (Cascading Style Sheets). Se você é iniciante em programação para a Web, não precisa saber nada sobre CSS para começar a aprender como o Bootstrap funciona; tudo o que você precisa é de um único documento HTML. Vamos dar uma olhada no Bootstrap, mostrando a você o que é, como funciona e se é uma boa opção para todos os sites que você constrói.

Inserindo a API do Bootstrap no seu arquivo HTML

Você tem algumas opções para inserir o Bootstrap no arquivo principal do projeto. A primeira opção é inserir todos os arquivos necessários do Bootstrap no seu projeto. Você pode fazer isso baixando o pacote e fazendo o upload para a pasta do projeto. Obviamente, você precisará vincular o arquivo CSS Bootstrap primário ao seu documento. O site oficial do Bootstrap possui um guia passo a passo sobre como fazer isso.

A outra opção é pular o download do pacote e usar uma rede de entrega de conteúdo (CDN). Uma CDN permite vincular os arquivos principais do Bootstrap ao seu documento HTML sem precisar baixá-lo. Isso, é claro, nem sempre é uma coisa boa para sites profissionais, pois eu não seria muito rápido para deixar minha página de negócios ou portfólio para o destino, se esse servidor fosse desativado. É melhor ter os arquivos em seu projeto, mas, com o objetivo de aprender, a CDN se sairá bem.

Para inserir o Bootstrap no seu documento HTML, basta inserir o seguinte código dentro do diretório tag no seu documento HTML:

Depois que esses links forem inseridos nessa tag head, você deverá estar pronto para começar a usar as classes Bootstrap. Seu documento deve ser algo como isto:

Bootstrap e Classes

Os elementos de inicialização são divididos em classes, que são apenas um monte de CSS pré-escritos que você pode inserir na sua marcação. É fácil inserir classes na sua marcação, basta saber o nome da classe que você deseja usar e aplicá-lo a um dos seus elementos HTML usando o valor class = ”classname”, conforme discutido em um artigo anterior.

A parte difícil é descobrir como tudo isso funciona em conjunto para criar algo bonito. Você pode conferir todas as diferentes classes disponíveis no Bootstrap diretamente da documentação oficial. Agora, dominar o Bootstrap é outra história. Isso não é algo que nós ou qualquer outra pessoa possamos ensinar. Você pode assistir a tutorial após tutorial, mas, para se aperfeiçoar no uso da estrutura, isso inclui muitas tentativas e erros. E isso exige que você trabalhe em seus próprios projetos.

Com isso em mente, eu imploro que você inicie seu próprio projeto HTML no seu computador usando o Atom ou algum outro editor de texto, revise o que são as classes HTML e CSS e comece a brincar com o Bootstrap. E se você souber marcação suficiente, talvez até crie seu próprio site de portfólio como um exercício de teste.

O Bootstrap é uma opção viável para todos os sites?

O Bootstrap é uma ótima estrutura, mas é uma opção viável para todos os sites que você cria? Depende verdadeiramente do desenvolvedor, bem como dos requisitos do projeto. Em muitos ambientes profissionais, você realmente não terá a opção de escolher as tecnologias que está usando, pois isso depende muito do gerente de projeto. Se o gerente de projeto optar por usar o Bootstrap, você também o combinará com uma tonelada de CSS personalizado. É isso que geralmente torna seu site único e diferente de outros sites usando o Bootstrap.

Pessoalmente, não vejo o Bootstrap como uma ótima opção para todos os sites. Claro, ele pode ajudar e fornecer alguns atalhos, mas eu finalmente descobri que o design desde o início com CSS é a melhor rota em grande parte devido ao controle que você tem sobre ele. Mas, mais uma vez, se você está apenas começando na programação da Web, não é uma coisa ruim usar o Bootstrap, mas não confie nele para sua carreira.

Vale a pena notar que, se você é um desenvolvedor iniciante, não deve usar o Bootstrap para todos os projetos em seu portfólio. Pode parecer que você pode ser proficiente com a API, mas não conhece bem o CSS. Dito isto, é bom ter uma mistura decente de ambos no seu portfólio (ou mesmo exclusivamente em CSS, pois é fácil pegar o Bootstrap).

Encerramento

Isso é tudo o que o Bootstrap é, em poucas palavras. Como mencionei anteriormente, encorajo você a iniciar seu próprio projeto HTML e adicionar algumas das diferentes classes aos elementos para começar a brincar com a estrutura. Você pode encontrar todos os diferentes componentes que o Bootstrap oferece com explicações e exemplos de código aqui.

O Bootstrap é realmente uma ferramenta interessante, mas lembre-se de não confiar apenas nela! É bom estar familiarizado com ele e conhecer o caminho a seguir, mas também certifique-se de mergulhar no CSS para entender realmente o que está acontecendo nos bastidores. Não só isso, mas um conhecimento sólido em CSS complementa muito o Bootstrap, permitindo que você realmente crie alguns sites únicos e bonitos com sua própria personalização.

Como você pode usar o bootstrap para criar um site bonito