Skip to content

Commit 9e5d199

Browse files
lazabogdanlazabogdan
committed
initial commit
0 parents  commit 9e5d199

22 files changed

+680
-0
lines changed

‎.gitignore‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
node_modules/
2+
typings/
3+
assets/css
4+
assets/js
5+
assets/vendor

‎.surgeignore‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
node_modules/
2+
app/
3+
typings/
4+
bs-config.json
5+
package.json
6+
tsconfig.json
7+
typings.json
8+
gulpfile.js
9+
*.md

‎200.html‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<title>adminplus-boilerplate-angular2 demo</title>
8+
9+
<!-- Enable pushState routing -->
10+
<base href="/">
11+
12+
<!-- Prevent the demo from appearing in search engines (REMOVE THIS) -->
13+
<meta name="robots" content="noindex">
14+
15+
<!-- Material Design Icons -->
16+
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
17+
18+
<!-- Simplebar.js CSS -->
19+
<link type="text/css" href="assets/vendor/simplebar.css" rel="stylesheet">
20+
21+
<!-- App CSS (includes vendor) -->
22+
<link type="text/css" href="assets/css/app.css" rel="stylesheet">
23+
24+
<!-- SystemJS -->
25+
<script src="assets/vendor/system.src.js"></script>
26+
27+
<!-- SystemJS Builder Production Bundle -->
28+
<script src="assets/js/app.bundle.js"></script>
29+
30+
<!-- SystemJS Config -->
31+
<script src="systemjs.config.js"></script>
32+
33+
</head>
34+
<body>
35+
<app>Loading ...</app>
36+
37+
<!-- Start App -->
38+
<script>System.import('app').then(null, console.error.bind(console));</script>
39+
</body>
40+
</html>

‎CNAME‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
adminplus-boilerplate-angular2.themekit.io

‎README.md‎

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
# adminplus-boilerplate-angular2
2+
> Angular2 boilerplate using [AdminPlus Lite](https://github.com/themekit/adminplus), [Bootstrap Layout](https://github.com/themekit/bootstrap-layout) and [ng2-bootstrap-layout](https://github.com/themekit/ng2-bootstrap-layout).
3+
4+
### Demo
5+
> You can [see a working live demo](http://adminplus-boilerplate-angular2.themekit.io) of this boilerplate.
6+
7+
## Usage
8+
9+
### Clone the boilerplate repository
10+
```bash
11+
git clone https://github.com/themekit/adminplus-boilerplate-angular2.git my-project
12+
```
13+
```bash
14+
cd my-project
15+
```
16+
17+
### Install dependencies
18+
> Install `gulp`:
19+
20+
```bash
21+
npm install -g gulp
22+
```
23+
24+
> Install application dependencies:
25+
26+
```bash
27+
npm install
28+
```
29+
30+
### Development server
31+
> The following will make an initial build and then serve the application on `http://localhost:3000`.
32+
33+
> It will also watch `./app/**/*.ts` and recompile the TypeScript to `./assets/js`, watch `./assets/sass/**/*` and recompile the Sass to `./assets/css` and watch `index.html`, `systemjs.config.js`, `./assets/**/*.js` and `./assets/**/*.css` files and inject any changes into your browser automatically.
34+
35+
```bash
36+
npm start
37+
```
38+
39+
### Development build
40+
41+
```bash
42+
gulp build
43+
```
44+
45+
### Production build
46+
47+
```bash
48+
NODE_ENV=production gulp release
49+
```
50+
51+
#### Load production bundle
52+
> To use the production bundle, uncomment the following in `./index.html`, before the call to `System.import('app')`:
53+
54+
```html
55+
<!-- Production Bundle -->
56+
<script src="assets/js/app.bundle.js"></script>
57+
```

‎app/app.component.ts‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import { Component, OnInit } from '@angular/core';
2+
import { Router, Routes, ROUTER_DIRECTIVES } from '@angular/router';
3+
import { HomePage } from './home/index';
4+
import { SidebarPage } from './sidebar/index';
5+
6+
@Component({
7+
selector: 'app',
8+
template: `<router-outlet></router-outlet>`,
9+
directives: [
10+
ROUTER_DIRECTIVES
11+
]
12+
})
13+
14+
@Routes([
15+
{ path: '/home', component: HomePage },
16+
{ path: '/sidebar', component: SidebarPage }
17+
])
18+
19+
export class AppComponent implements OnInit {
20+
constructor(private router: Router) {}
21+
ngOnInit() {
22+
this.router.navigate(['/home']);
23+
}
24+
}

‎app/home/home.page.ts‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import { Component } from '@angular/core';
2+
import { ROUTER_DIRECTIVES } from '@angular/router';
3+
import { LayoutComponent, NavbarComponent } from 'ng2-bootstrap-layout';
4+
import { HelloWorldComponent } from '../shared/index';
5+
import { RouterActiveDirective } from 'ng2-router-active';
6+
7+
@Component({
8+
selector: 'home-page',
9+
template: `
10+
<ng2-bl-layout layout-type="fixed">
11+
12+
<ng2-bl-navbar>
13+
<div class="container">
14+
15+
<!-- Navbar toggle -->
16+
<button class="navbar-toggler hidden-md-up pull-xs-right last-child-xs" type="button" data-toggle="collapse" data-target="#navbar"><span class="material-icons">menu</span></button>
17+
18+
<!-- Brand -->
19+
<a class="navbar-brand" [routerLink]="['/home']">Brand</a>
20+
21+
<!-- Collapse -->
22+
<div class="collapse navbar-toggleable-xs" id="navbar">
23+
<ul class="nav navbar-nav">
24+
<li class="nav-item" ng2-router-active><a class="nav-link" [routerLink]="['/home']">Fixed</a></li>
25+
<li class="nav-item" ng2-router-active><a class="nav-link" [routerLink]="['/sidebar']">Sidebar</a></li>
26+
</ul>
27+
</div>
28+
<!-- // END Collapse -->
29+
30+
</div>
31+
</ng2-bl-navbar>
32+
33+
<!-- Breadcrumb -->
34+
<ol class="breadcrumb">
35+
<li><a [routerLink]="['/home']">AdminPlus</a></li>
36+
<li class="active">Fixed layout</li>
37+
</ol>
38+
<!-- // END Breadcrumb -->
39+
40+
<hello-world></hello-world>
41+
42+
</ng2-bl-layout>
43+
`,
44+
directives: [
45+
ROUTER_DIRECTIVES,
46+
LayoutComponent,
47+
NavbarComponent,
48+
HelloWorldComponent,
49+
RouterActiveDirective
50+
]
51+
})
52+
53+
export class HomePage {}

‎app/home/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export * from './home.page';

‎app/main.ts‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
// Angular dependencies
2+
import 'es6-shim';
3+
import 'zone.js';
4+
import 'reflect-metadata';
5+
6+
// App dependencies
7+
import 'jquery';
8+
import 'simplebar';
9+
import 'tether';
10+
import 'bootstrap';
11+
12+
// Bootstrap application
13+
import { bootstrap } from '@angular/platform-browser-dynamic';
14+
import { ROUTER_PROVIDERS } from '@angular/router';
15+
import { AppComponent } from './app.component';
16+
17+
// @if NODE_ENV='production'
18+
import { enableProdMode } from '@angular/core';
19+
enableProdMode();
20+
// @endif
21+
22+
bootstrap(AppComponent, [ROUTER_PROVIDERS]);

‎app/shared/hello-world.component.ts‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { Component } from '@angular/core';
2+
3+
@Component({
4+
selector: 'hello-world',
5+
template: `
6+
<h1>Hello World</h1>
7+
8+
<p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repudiandae ea ullam iusto asperiores repellat perspiciatis error. Quo praesentium, expedita neque natus quisquam iure consequuntur unde hic doloribus ab voluptas pariatur!</p>
9+
10+
<div class="card card-block">
11+
This is a demo for the <a target="_blank" href="https://github.com/themekit/adminplus-boilerplate-angular2">adminplus-boilerplate-angular2</a> repository, using <a target="_blank" href="https://github.com/themekit/adminplus">AdminPlus Lite</a> and <a target="_blank" href="https://github.com/themekit/bootstrap-layout">Bootstrap Layout</a> with Angular 2.
12+
</div>
13+
`
14+
})
15+
16+
export class HelloWorldComponent {}

0 commit comments

Comments
 (0)