Calibration Assignment Submission (Firebrick JS): Difference between revisions

From Expertiza_Wiki
Jump to navigation Jump to search
(Created page with "{{AFC comment|1=Improve sourcing. Wikipedia is not a reference but a wikilink. The company's own web site is not a source but an external link. Add sources. [[User:Robert McCl...")
 
No edit summary
Line 64: Line 64:


== References ==
== References ==
<references/>

Revision as of 19:58, 8 September 2016

Template:AFC comment


Template:Infobox software

Firebrick JS is a MVC structure built on top of JavaScript, used to provide elegant and useful user interface elements for any web applications. It is an open source software that is simply a bootstrap based component library and MVC/MVVM framework.<ref name=":0"></ref> Firebrick uses jQuery, Knockout JS and Require JS to provide these user interface element.<ref name=":0" /> Examples of the type of interfaces currently supported by Firebrick JS include data fields, buttons, different types of display and alert boxes, containers, navigation panels and editable tables. By including Firebrick JS, a web developer has access to all the supported elements and can include them in the web application, thus reducing redundant code.

Firebrick JS uses another framework in conjunction, called Firebrick UI which is an extendable User Interface component library to provide these interfaces.

Overview

Firebrick JS started development in September 2014 and are currently at version 0.13.12 as of February 2016.<ref></ref> It was created by Steven Masala along with his team. It is one of the many flavors of JavaScript MVC frameworks. What makes Firebrick JS something to look out for is that it utilizes the frameworks of jQuery, Knockout JS and Require JS to built it's own frameworks.

jQuery is a lightweight JavaScript library which provides the users more functionality with less code.<ref></ref> It provides the user with in built methods that a user can call with a single line of code. This saves the user many lines of codes and also facilitates reusability.

Knockout is a JavaScript implementation which provides MVVM patterns and templates . The underlying principles are therefore:

  • a clear separation between domain data, view components and data to be displayed
  • the presence of a clearly defined layer of specialized code to manage the relationships between the view components<ref></ref>

Require JS is a JavaScript file and module loader. It is optimized for in-browser use, but it can be used in other JavaScript environments, like Rhino and Node.<ref></ref>

Usage

Firebrick JS can either be downloaded via GitHub

Alternatively and preferably the libraries can be downloaded with bower

	bower install firebrick

Firebrick JS controllers help in designing the UI of an HTML website. Examples of these UI elements include:

Username Input:

define( [ "text!./Input.html", "Firebrick.ui/containers/Panel", "Firebrick.ui/containers/FormPanel", "Firebrick.ui/containers/Box", "Firebrick.ui/fields/Input", "../ComponentTemplate" ], function( input ) {
	"use strict";
	return Firebrick.defineView( "FBJS.view.components.fields.Input", {
		extend: "fbjs.componenttemplate",
		title: "Input Field",
		topTitle: input,
		demo: {
			sName: "containers.formpanel",
			title: "Demo",
			collapsible: true,
			items: [{
				sName: "fields.input",
				inputAddon: true,
				iconClass: "glyphicon-home",
				label: "Username",
				placeholder: "Enter Username",
				tooltip: "tooltip!"
			},{
				sName: "fields.input",
				inplaceEdit: true,
				label: "Username",
				placeholder: "Enter Username",
				value: "'John Doe'",
				tooltip: "tooltip!"
			}]
		}
	});
});

As of now Firebrick JS has a good built-in API that can be used to handle events, prep applications, load different templates, etc.

Other UI elements and renditions of Firebrick JS can be found on this website.

See also

References

<references/>