IdanCo / ng1bs4

AngularJS with Bootstrap 4
https://idanco.github.io/ng1bs4
38 stars 13 forks source link
angular angular1 angularjs bootstrap bootstrap4

ng1bs4

Tomorrow's Library with Yesterday's Framework

Gitter chat

Build Status npm version

A Library of AngularJS Components Implementing Boostrap 4

Just because you use AngularJS and not Angular like all the cool kids, doesn't mean you can't look good!

Enjoy the robust styling architecture of the new Bootstrap 4, while still using good ol' AngularJS.

See it in action at https://idanco.github.io/ng1bs4/.

Alternatives

Install

Install bootstrap 4 and import it's JS and styling into your project.

Install ng1bs4

npm install ng1bs4 --save

Import ng1bs4 module and styling into your project

import ng1bs4 from 'ng1bs4';
import 'ng1bs4/dist/import.css'

Inject ng1bs4 module into your app

angular
  .module('myApp', [
    ...,
    ng1bs4
  ]);

Test by adding this directive anywhere in your markup

<ngbs-test></ngbs-test>

for more details checkout a sample project with angularJS, bootstrap4 and ng1bs4.

Philosophy

No Styling. We believe you should be able to customize as much as you want, and with Bootstrap 4 theming is easy! That's why all components include minimal styling and rely heavily on Bootstrap's native classes and variables.

Simple Code. We strive to keep all components as simple yet robust as possible. Hence, rewiring them to fit your needs should be easy peasy.

Create New Components

Development is easy and fun! Just follow these simple steps to get started:

  1. Have at least Node.js 6.x installed
  2. Fork the main repository
  3. Git clone the forked repository
  4. Run the following commands
    1. npm i
    2. npm run serve
  5. Open http://localhost:8080 in a browser
  6. Start making amazing changes!

Create new components easily with our generator:

npm run new

And follow the on-screen instructions. Created a cool component? Make a pull request and contribute it back.

Contribute

§!@#$%^ HELP NEEDED! ^%$#@!§

We're a new open source project, trying to make our way in this crazy javascript world. There's tons of work to be done and any effort will be appreciated.

You can help by:

Any questions? open an issue or join us on gitter - https://gitter.im/ng1bs4