Check out and download the source code on GitHub.GitHub
- ➊ PlazarJS Core (core)
➋ PlazarJS Static Utilities:
- • PlazarJS Http (http)
- • PlazarJS Binder (binder)
- • PlazarJS Array (array)
- • PlazarJS String (string)
- • PlazarJS Dom (dom)
- • PlazarJS Object (object)
- • PlazarJS Events (events)
➌ PlazarJS Asset Types:
- • PlazarJS Base (base)
- • PlazarJS Component (component)
- • PlazarJS Class (class)
- • PlazarJS Mixin (mixin)
➍ Bootstrap UI Integration:
➍ ➊ Components:
- • UI Base Component (ui-base-component)
- • UI Alert Component (ui-alert-component)
- • UI Breadcrumb Component (ui-breadcrumb-component)
- • UI Button Component (ui-button-component)
- • UI Button Group Component (ui-button-group-component)
- • UI Button Toolbar Component (ui-button-toolbar-component)
- • UI Card Component (ui-card-component)
- • UI Carousel Component (ui-carousel-component)
- • UI Collapse Component (ui-collapse-component)
- • UI Container Component (ui-container-component)
- • UI Dropdown Component (ui-dropdown-component)
- • UI Form Component (ui-form-component)
- • UI Grid Component (ui-grid-component)
- • UI Input Component (ui-input-component)
- • UI List Group Component (ui-list-group-component)
- • UI Nav Component (ui-nav-component)
- • UI Navbar Component (ui-navbar-component)
- • UI Progress Component (ui-progress-component)
- • UI Select Component (ui-select-component)
➍ ➋ Mixins:
- • Form Field Mixin (form-field-mixin)
- ➍ ➊ Components:
Place the following scripts at the end of your page and you are good to go:
PlazarJS can be installed via NPM as well by running the following command(s):
After setting up your project, for example, to be compiled by babel, and bundled with rollup.js, all you have to do is to import the module:
Optionally, you can include Bootstrap UI. Check out the guidelines here.
The following example illustrates how to use PlazarJS together with RequireJS. The first step would be to install it and place the relevant script tag on your page:
Next, configure the path for the PlazarJS module
At this point there should be no problem with requiring our core module. The content of your index.js file should look like this:
1. If you intend to create a Single Page Application, these four short steps will get you started in no time:
- Example applications can be found here and here.
- Step 1.1 Create an index.html page.
- Step 1.2 Create root.js file and define your root component. This component will automatically load it's children upon creation.
- Step 1.3 Create app.js file, define your application and setup the root component.
- Step 1.4 Place the following scripts at the end of your page:
2. In case you need a widget on the page, or you need to integrate some logic with a portion of your page, you don't need to define an application, you simply need a component. Check out the example bellow:
- Step 2.1 Locate an element on the page you wish to integrate with, and choose a way how you are going to identify it. Set the CSS class, or attribute, or id. Do it as you desire, but preferably it should be a unique value.
- Step 2.2 Create a file my-component.js and setup the component which will hold the logic.
- Step 2.3 Place the following scripts at the end of your page: