Pular para o conteúdo principal

Angular 4 & Bootstrap 4

E ai galera. 
Neste post irei demonstrar como fazer a preparação inicial de uma aplicação que utilize Angular 4 e Bootstrap 4.


Após você instalar o Angular-CLI você pode iniciar sua aplicação angular digitando o comando no cmd:
ng new minha-app

cd minha-app

Após navegar para a pasta de sua app você pode instalar o Bootstrap 4 e o ng-bootstrap. O ng-bootstrap é uma biblioteca que contem componentes bootstrap para angular, fazendo com que não seja necessário adicionar bootstrap.js em nossa aplicação.


npm install --save @ng-bootstrap/ng-bootstrap bootstrap@4.0.0-beta

Com todas instalações realizadas, você deve registrar o css do bootsrap no arquivo angular-cli.json na propriedade styles.

"styles": [
     "../node_modules/bootstrap/dist/css/bootstrap.min.css",
     "styles.css"
 ]

No arquivo app.module.ts deve ser feito importação do módulo do ng-bootstrap o NgbModule.
E por fim você pode começar a utilizar os componentes do ng-bootstrap e os demais elementos com estilo do bootsrap. Como no exemplo de carousel em app.component.html.



Para ver o resultado final digite na sessão do seu terminal:

ng serve --o


Link para github https://github.com/jozimarback/setup-ng-bootstrap

Por hoje é só.
Até a próxima.

Comentários

Postagens mais visitadas deste blog

Dica: Extensão Indentar código VUE Visual Studio Code

Olá Por muitas é necessário um atalho para formatar o seu código fonte no editor de texto. Para formatação de HTML, CSS, JS e afins no visual studio code você pode utilizar o: HTML Snippets Mas esta extensão acima não formata arquivos de template .vue . Para formatar este tipo de arquivos é necessário instalar alguma outra extensão. Entre as que busquei a que faz o serviço da melhor forma atualmente utilizando o atalho alt+shift+f   é o plugin ventur: Vetur Este plugin é muito bom mesmo. Facilitou bastante a formatação de fontes em templates .vue. É isso espero que ajude;)

Migrando repositório TFS para GIT

Chega o momento em que decidimos migrar do TFS para GIT por 'N' motivos e benefícios que esta migração pode trazer. Caso você tenha uma repositório de longa data e queira manter o histórico de checkins, o  git-tfs auxilia nesta tarefa. Uma das minhas formas preferidas para instalar é através do chocolatey . Com o chocolatey instalado em sua máquina basta abrir o powershell em modo admin e digitar: cinst GitTfs No powershell para clonar o repositório TFS para seu repositório git você deve digitar o seguinte comando: git tfs clone http : //meutfs.com $/diretoriotfs c : /diretorio-alvo-clone --branches=all -u=CORP\Usuario -p=****** Para mais opções de comando segue link do github do projeto.

C# :Removendo propriedades nulas ao serializar JSON

Olá Para serializar uma classe em formato JSON em c#,por muitas vezes é utilizado o pacote Newtonsoft . Em alguns momentos há a necessidade de serializar somente as propriedades que estiverem preenchidas no objeto, removendo assim as que estiverem nulas. Para isto você pode utilizar a propriedade  NullValueHandling da classe  JsonSerializerSettings . Segue exemplo: Até a próxima