step-11/index.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Angular 2 :: Beer Gallery</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <base href="./#"/>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.4/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/app.css">
    <!-- Polyfill(s) for older browsers -->
    <script src="https://unpkg.com/core-js/client/shim.min.js"></script>
    <!-- Polyfill for Web Animations -->
    <script src="https://unpkg.com/web-animations-js@2.2.1"></script>

    <!-- 1. Load libraries -->
    <script src="https://unpkg.com/zone.js@0.6.25?main=browser"></script>
    <script src="https://unpkg.com/reflect-metadata@0.1.3"></script>
    <script src="https://unpkg.com/systemjs@0.19.27/dist/system.src.js"></script>

    <script src="systemjs.config.js"></script>
    <script>
        System.import('app/main').then(null, console.error.bind(console));
    </script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.3.7/js/tether.min.js"></script>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.4/js/bootstrap.min.js"></script>
</head>
<body>
<nav class="navbar navbar-full navbar-dark bg-primary">
    <a class="navbar-brand" href="#">angular Beer</a>
    <ul class="nav navbar-nav">
        <li class="nav-item active">
            <a class="nav-link" href="#/">Home <span class="sr-only">(current)</span></a>
        </li>
    </ul>
</nav>
<div class="main">
    <my-app>
        <div class="container">Loading...
            <progress class="progress progress-striped progress-animated" value="100" max="100"></progress>
        </div>
    </my-app>
</div>
</body>
</html>