Chapter 4. The kitchensink-angularjs-bootstrap Example
The kitchensink-angularjs-bootstrap example creates an application to register members. The name, email address, and phone number of a new member is entered with a webform. After registration, those details are added to a members list for future reference. This example is designed primarily for mobile devices.
This example makes use of two frameworks: AngularJS and Bootstrap. These frameworks add objects to the user interface, store JavaScript files, and match the layout various screen sizes. This section examines the layout, features, and coding of the example.
4.1. Running the Example
The kitchensink-angularjs-bootstrap example requires the Red Hat JBoss Web Framework Kit distribution. The example can be downloaded from the Red Hat Customer Portal. This section explains how to download, build, and deploy the example.
4.1.1. Obtaining the Example
The kitchensink-angularjs-bootstrap example is available from the Red Hat Customer Portal. It must be downloaded and extracted into a local directory before it can be built.
Procedure 4.1. Downloading the Example from the Red Hat Customer Portal
- Log into the Red Hat Customer Portal at http://access.redhat.com.
- Locate the downloads for this version of Red Hat JBoss Web Framework Kit.
- Download the
.zipfile for Red Hat JBoss Web Framework Kit quickstarts, which contains the kitchensink-angularjs-bootstrap example. - Extract the contents of the downloaded
.zipfile to the location where you want to keep the quickstarts source code.
4.1.2. Building the Example
Use Maven to build kitchensink-angularjs-bootstrap locally.
Procedure 4.2. Building kitchensink-angularjs-bootstrap with Maven
- On the command line, navigate to the directory containing the kitchensink-angularjs-bootstrap example.
- Run the following command to build the example:
$mvn clean package
4.1.3. Deploying the Example
Deploy the example to the JBoss EAP server. After deploying the example to the JBoss EAP server, you can view the example in your browser.
Procedure 4.3. Deploying kitchensink-angularjs-bootstrap to the Server
- In the directory containing JBoss EAP, run the following command to start the server:
$./bin/standalone.sh - Open a new command line instance and navigate to the directory containing the kitchensink-angularjs-bootstrap example.
- Enter the following command to deploy the kitchensink-angularjs-bootstrap example:
$mvn jboss-as:deploy - Open a web browser and access the example at http://localhost:8080/jboss-kitchensink-angularjs-bootstrap/.