# Create a new aspect

This tutorial takes you through creating a new _aspect_ in an existing _BladeRunner_ application, using a Login Aspect as a specific example.

It assumes that you are familiar with the basics of what an _aspect_ is, and how they relate to the other components of a _BladeRunner_ application. Have a look at "[About Aspects](bladerunner-about-aspects.md)" for further information.

## 1. Before You Start

To follow this tutorial, you’ll need to have a basic application structure similar to this; for the examples given, we’ll use an application called **_example-app_**, and a _bladeset_ called **_my-bladeset_**. The _default-aspect_ is also present:

![br_aspect_3](../../../images/br_aspect_3.png)

This _aspect_ will handle authentication of users arriving at the application URL without logging in first. Having logged in, users would then be redirected to the _default-aspect_, where more of the app’s functionality would be made available.

## 2. Create the New Aspect via the Command-line

To create the new login aspect, go to a command-line window and execute the following instruction:

```
bladerunner create-aspect _<app-name> <new-aspect-name>_
```

**For example:**

```
bladerunner create-aspect *_example-app login_*
```

Your app folder structure will then look something like this:

![br_aspect_4](../../../images/br_aspect_4.png)

## 3. Create a Login Page

You now need to create a home-page for the login aspect, which you can do by adding a login form like the one below, to the body of the _login-aspect/index.html file_:

```html
<form method="post" action="j_security_check">
        <p>Username: <input class="username"
            type="text"
            name="j_username"
            value="user1@caplin.com" />
        </p>
        <p>Password: <input class="password"
            type="password"
            name="j_password"
            value="password" />
        </p>
        <p><input type="submit"
            value="Login"
            name="submit" />
        </p>
    </form>
```

The above HTML creates a basic login page which submits a _j_username_ and _j_password_, which are standardized names in the Java servlet specification.

Currently of course, people who enter the URL of this application would be directed to the _default-aspect_, whether they are logged in or not, as laid out in the table below:

| URL Request | Logical URL | Aspect |
| --- | --- | --- |
| <span>http://</span>localhost:7070/example-app | <span>http://</span>localhost:7070/example-app/default-aspect | **_default-aspect_** |
| <span>http://</span>localhost:7070/example-app/default | <span>http://</span>localhost:7070/example-app/default-aspect | **_default-aspect_** |
| <span>http://</span>localhost:7070/example-app/login | <span>http://</span>localhost:7070/example-app/login-aspect | **_login-aspect_** |

What you need to do now, is ensure that any users who are not logged in, will have to do so before they can access the _default-aspect_ of the application. You can do this by configuring a security constraint to the _web.xml_ file in the _WEB-INF_ folder.

## 4. Add security constraint config to web.xml

The following XML extract adds a security constraint named '_Login Section_', which directs unauthorized users to _/login_. Only after the users have been authenticated, will they be able to get to their initial request location; i.e. _/default-aspect_.

The _Jetty_ web server requires a _realm-name_ value. _BladeRunner_ has this internally defined as '_BladeRunnerLoginRealm_'.

```html
<security-role>
        <role-name>user</role-name>
    </security-role>

    <security-constraint>
        <web-resource-collection>
           <web-resource-name>Application</web-resource-name>
           <url-pattern>/*</url-pattern>
        </web-resource-collection>
        <auth-constraint>
            <role-name>user</role-name>
        </auth-constraint>
    </security-constraint>

    <security-constraint>
        <web-resource-collection>
            <web-resource-name>Login Section</web-resource-name>
            <url-pattern>/login/*</url-pattern>
        </web-resource-collection>
    </security-constraint>

    <login-config>
        <auth-method>FORM</auth-method>
        <realm-name>BladeRunnerLoginRealm</realm-name>
        <form-login-config>
            <form-login-page>/login/</form-login-page>
            <form-error-page>/login/</form-error-page>
        </form-login-config>
    </login-config>
```

## 5. Restart BladeRunner and Access your Application

Stop the _BladeRunner_ process, and then start it again from your command-line window, (using the command: `bladerunner start`).

If you go to a browser and enter the URL request for your application (<span>http://</span>localhost:7070/example-app), it should now redirect you to the login-aspect; <span>http://</span>localhost:7070/example-app/login.

Clicking the _Login_ button will then take you through to your _default-aspect_.

## Scenario: Create a Mobile Aspect

Aspects are not just for creating a login entry-point for your application though. You could also use an _aspect_ to create a 'view' of your application to present to mobile or tablet devices.

A simple way of doing this would be to have the _default-aspect_ contain logic to detect the browser agent , and then use that information to redirect tablets or mobile phones to a more "mobile-friendly" aspect of their application. The _mobile-aspect_ would still have access to all the application _bladesets_, but may have an interface geared towards touch-screen devices, avoiding mouse-over features, but making use of touch gesture libraries, to give a richer user experience.