Skip to content

Commit 2973ce7

Browse files
committed
Configuração de rotas, navbar e deploy Firebase
1 parent 7a3501b commit 2973ce7

21 files changed

+284
-22
lines changed

.firebaserc

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"projects": {
3+
"ecommerce": "angular-ecommerce-2f906",
4+
"default": "angular-ecommerce-2f906"
5+
}
6+
}

firebase.json

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
{
2+
"hosting": {
3+
"public": "dist",
4+
"ignore": [
5+
"firebase.json",
6+
"**/.*",
7+
"**/node_modules/**"
8+
],
9+
"rewrites": [
10+
{
11+
"source": "**",
12+
"destination": "/index.html"
13+
}
14+
]
15+
}
16+
}

package-lock.json

Lines changed: 10 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@
88
"build": "ng build --prod",
99
"test": "ng test",
1010
"lint": "ng lint",
11-
"e2e": "ng e2e"
11+
"e2e": "ng e2e",
12+
"deploy:firebase": "ng build --prod && firebase deploy"
1213
},
1314
"private": true,
1415
"dependencies": {
@@ -21,6 +22,8 @@
2122
"@angular/platform-browser": "^5.2.0",
2223
"@angular/platform-browser-dynamic": "^5.2.0",
2324
"@angular/router": "^5.2.0",
25+
"@ng-bootstrap/ng-bootstrap": "^2.0.0-alpha.0",
26+
"bootstrap": "^4.1.0",
2427
"core-js": "^2.4.1",
2528
"rxjs": "^5.5.6",
2629
"zone.js": "^0.8.19"

public/index.html

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1">
6+
<title>Welcome to Firebase Hosting</title>
7+
8+
<!-- update the version number as needed -->
9+
<script defer src="/__/firebase/4.12.1/firebase-app.js"></script>
10+
<!-- include only the Firebase features as you need -->
11+
<script defer src="/__/firebase/4.12.1/firebase-auth.js"></script>
12+
<script defer src="/__/firebase/4.12.1/firebase-database.js"></script>
13+
<script defer src="/__/firebase/4.12.1/firebase-messaging.js"></script>
14+
<script defer src="/__/firebase/4.12.1/firebase-storage.js"></script>
15+
<!-- initialize the SDK after all desired features are loaded -->
16+
<script defer src="/__/firebase/init.js"></script>
17+
18+
<style media="screen">
19+
body { background: #ECEFF1; color: rgba(0,0,0,0.87); font-family: Roboto, Helvetica, Arial, sans-serif; margin: 0; padding: 0; }
20+
#message { background: white; max-width: 360px; margin: 100px auto 16px; padding: 32px 24px; border-radius: 3px; }
21+
#message h2 { color: #ffa100; font-weight: bold; font-size: 16px; margin: 0 0 8px; }
22+
#message h1 { font-size: 22px; font-weight: 300; color: rgba(0,0,0,0.6); margin: 0 0 16px;}
23+
#message p { line-height: 140%; margin: 16px 0 24px; font-size: 14px; }
24+
#message a { display: block; text-align: center; background: #039be5; text-transform: uppercase; text-decoration: none; color: white; padding: 16px; border-radius: 4px; }
25+
#message, #message a { box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); }
26+
#load { color: rgba(0,0,0,0.4); text-align: center; font-size: 13px; }
27+
@media (max-width: 600px) {
28+
body, #message { margin-top: 0; background: white; box-shadow: none; }
29+
body { border-top: 16px solid #ffa100; }
30+
}
31+
</style>
32+
</head>
33+
<body>
34+
<div id="message">
35+
<h2>Welcome</h2>
36+
<h1>Firebase Hosting Setup Complete</h1>
37+
<p>You're seeing this because you've successfully setup Firebase Hosting. Now it's time to go build something extraordinary!</p>
38+
<a target="_blank" href="https://firebase.google.com/docs/hosting/">Open Hosting Documentation</a>
39+
</div>
40+
<p id="load">Firebase SDK Loading&hellip;</p>
41+
42+
<script>
43+
document.addEventListener('DOMContentLoaded', function() {
44+
// // 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
45+
// // The Firebase SDK is initialized and available here!
46+
//
47+
// firebase.auth().onAuthStateChanged(user => { });
48+
// firebase.database().ref('/path/to/ref').on('value', snapshot => { });
49+
// firebase.messaging().requestPermission().then(() => { });
50+
// firebase.storage().ref('/path/to/ref').getDownloadURL().then(() => { });
51+
//
52+
// // 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
53+
54+
try {
55+
let app = firebase.app();
56+
let features = ['auth', 'database', 'messaging', 'storage'].filter(feature => typeof app[feature] === 'function');
57+
document.getElementById('load').innerHTML = `Firebase SDK loaded with ${features.join(', ')}`;
58+
} catch (e) {
59+
console.error(e);
60+
document.getElementById('load').innerHTML = 'Error loading the Firebase SDK, check the console.';
61+
}
62+
});
63+
</script>
64+
</body>
65+
</html>

src/app/app.component.html

Lines changed: 27 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,29 @@
1-
<!--The content below is only a placeholder and can be replaced.-->
2-
<div style="text-align:center">
3-
<h1>
4-
Welcome to {{ title }}!
5-
</h1>
6-
<img width="300" alt="Angular Logo" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg==">
1+
<nav class="navbar navbar-expand-lg navbar-light bg-light">
2+
<a class="navbar-brand" routerLink="/">E-Commerce</a>
3+
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
4+
<span class="navbar-toggler-icon"></span>
5+
</button>
6+
7+
<div class="collapse navbar-collapse" id="navbarSupportedContent">
8+
<ul class="navbar-nav mr-auto">
9+
<li routerLinkActive="active" class="nav-item">
10+
<a class="nav-link" routerLink="/shopping-cart">Carrinho</a>
11+
</li>
12+
<li>
13+
<div ngbDropdown class="d-inline-block">
14+
<button class="btn btn-outlin" id="dropdownBasic1" ngbDropdownToggle>Usuário</button>
15+
<div ngbDropdownMenu aria-labelledby="dropdownBasic1">
16+
<button class="dropdown-item">Meus pedidos</button>
17+
<button class="dropdown-item">Gerenciar Pedidos</button>
18+
<button class="dropdown-item">Gerenciar Produtos</button>
19+
<button class="dropdown-item">Logout</button>
20+
</div>
21+
</div>
22+
</li>
23+
</ul>
24+
</div>
25+
</nav>
26+
<div class="main">
27+
<router-outlet></router-outlet>
728
</div>
8-
<h2>Here are some links to help you start: </h2>
9-
<ul>
10-
<li>
11-
<h2><a target="_blank" rel="noopener" href="https://angular.io/tutorial">Tour of Heroes</a></h2>
12-
</li>
13-
<li>
14-
<h2><a target="_blank" rel="noopener" href="https://github.com/angular/angular-cli/wiki">CLI Documentation</a></h2>
15-
</li>
16-
<li>
17-
<h2><a target="_blank" rel="noopener" href="https://blog.angular.io/">Angular blog</a></h2>
18-
</li>
19-
</ul>
2029

src/app/app.module.ts

Lines changed: 25 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,39 @@
11
import { BrowserModule } from '@angular/platform-browser';
22
import { NgModule } from '@angular/core';
3+
import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
4+
import { RouterModule } from '@angular/router';
35

46

57
import { AppComponent } from './app.component';
8+
import { HomeComponent } from './home/home.component';
9+
import { ShoppingCartComponent } from './shopping-cart/shopping-cart.component';
10+
import { NotFoundComponent } from './not-found/not-found.component';
611

712

813
@NgModule({
914
declarations: [
10-
AppComponent
15+
AppComponent,
16+
HomeComponent,
17+
ShoppingCartComponent,
18+
NotFoundComponent
1119
],
1220
imports: [
13-
BrowserModule
21+
BrowserModule,
22+
NgbModule.forRoot(),
23+
RouterModule.forRoot([
24+
{
25+
path: '',
26+
component: HomeComponent
27+
},
28+
{
29+
path: 'shopping-cart',
30+
component: ShoppingCartComponent
31+
},
32+
{
33+
path: '**',
34+
component: NotFoundComponent
35+
}
36+
])
1437
],
1538
providers: [],
1639
bootstrap: [AppComponent]

src/app/home/home.component.css

Whitespace-only changes.

src/app/home/home.component.html

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<p>
2+
home works!
3+
</p>

src/app/home/home.component.spec.ts

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2+
3+
import { HomeComponent } from './home.component';
4+
5+
describe('HomeComponent', () => {
6+
let component: HomeComponent;
7+
let fixture: ComponentFixture<HomeComponent>;
8+
9+
beforeEach(async(() => {
10+
TestBed.configureTestingModule({
11+
declarations: [ HomeComponent ]
12+
})
13+
.compileComponents();
14+
}));
15+
16+
beforeEach(() => {
17+
fixture = TestBed.createComponent(HomeComponent);
18+
component = fixture.componentInstance;
19+
fixture.detectChanges();
20+
});
21+
22+
it('should create', () => {
23+
expect(component).toBeTruthy();
24+
});
25+
});

0 commit comments

Comments
 (0)