Angular2 Coding Dojo
Coding Dojo ?
Japanese term literally means "Place Of the Way"
DOJO
DOJO Mindset
Programming session based around a simple coding challenge
- Safe place outside work
- Non-competitive, collaborative, fun environment
- All skill levels are welcome
- Safe to try new ideas
- We are here to learn
DOJO
Randori style
Pair programming
Baby steps
Time boxing
Rules
Let's get started !
- Sprint 1 : Scaffolding
- Sprint 2 : First Component
- Sprint 3 : Master/Detail
- Sprint 4 : Routing
- Sprint 5 : Making your code reusable with services
15mn
via the quick starter
-
git clone https://github.com/ngMorocco/ng2-quick-starter.git -
cd ng2-quick-starter -
npm install -
npm strat
Sprint 1: Scaffolding
via the AngularCLI
-
npm install -g angular-cli -
ng new ng2-quick-starter -
ng serve
IMPORTANT: please make sure node and npm are installed :
node -v
npm -v
15mn
Sprint 2 : First Component
15mn
Sprint 3 : Master/Detail
15mn
Sprint 4 : Routing
-
Add <base href ="/"> to index.html -
create two other component: home.component.ts and heroes.component.ts -
import the router module : import {RouterModule} from'@angular/router'; - Add paths : RouterModule.forRoot([ {path: 'heroes',component: HeroesComponent},
{path: 'home',component: HomeComponent},
{path: '',redirectTo: '/home',pathMatch: 'full'}
]) -
add router outlet to app.component.ts:
<a routerLink="/dashboard">Dashboard</a> <a routerLink="/heroes">Heroes</a> <router-outlet></router-outlet>
15mn
Thans for your participating
Q & A
Angular2 Coding Dojo
By intissar