Introduction to Angular 2 with Spring MVC
2016.11.20 00:26
Introduction to Angular 2 with Spring MVC
Monday, 9:00 AM - SALON 2
Do you work in a Java shop and want to get started with Angular 2? If so, this workshop is for you. An essential component of starting with Angular 2 is learning the build tools. It presents a major shift from how we integrated our JavaScript in the past. There isn't an established convention for integrating with Java Web Applications. In this workshop, we will cover the fundamentals of Angular 2 including: typescript, components, templates, dependency injection, routing, services, http, and observables. In addition, we'll integrate an Angular app in a Spring MVC app and establish a productive workflow.
This workshop will start with the fundamentals of Angular and then create an App within an existing SpringMVC app. Knowledge of Spring MVC is helpful, but not necessarily required. We'll primarily focus on the build and deployment aspects of Spring MVC. This workshop will use the following tools: angular-cli, npm, git, gradle, and gulp.
Workshop Requirements
This session is a workshop. Please come prepared.
1) Install Recent Node - v6.5.0 or Higher
OS X: https://nodejs.org/dist/v6.5.0/node-v6.5.0.pkg
Windows: https://nodejs.org/dist/v6.5.0/win-x64/node.exe
Linux: https://nodejs.org/dist/v6.5.0/node-v6.5.0-linux-x64.tar.xz
Other: https://nodejs.org/en/
2) Install Angular CLI, Gulp, and TypeScript
npm install -g angular-cli gulp typescript
If you need uninstall an older angular-cli version:
npm uninstall -g angular-cli
npm cache clear
3) Install Java 8
http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
Make sure the Java 8 JDK is your default java version on the system.
java -version
java version "1.8.0_101"
Check your JAVA_HOME environment variable. Make sure it is set to the Java 8 JDK.
4) Clone Workshop Repo
git clone git@github.com:bellingson/ng-workshop-starter.git
5) Install npm dependencies
cd ng-workshop-starter/product-mgr
npm install
cd ng-workshop-starter/stuffmart
npm install
6) Test Angular CLI Installation
ng -v
should print angular-cli: 1.0.0-beta.20-4 (or higher)
cd ng-workshop-starter/product-mgr
ng serve
got to http://localhost:4200/ in browser
should say "app works!"
7) Test Spring MVC App
On mac and linux:
cd ng-workshop-starter/stuffmart
./gradlew appRun
On windows:
cd ng-workshop-starter/stuffmart
./gradlew.bat appRun
go to http://localhost:8080/ in browser
should load "Stuff Mart" website
Browser
Chrome Browser is prefered
IDE Recommendations
IntelliJ Ultimate and Visual Studio Code seem to have the best Angular 2 support at this time. Both offer code completion and automatic imports. The workshop instructor will use IntelliJ Ultimate, but you are free to use another IDE that you are comfortable with.
-
IntelliJ Ultimate Edition (not free)
https://www.jetbrains.com/idea/#chooseYourEdition
Also install Angular JS plugin
https://plugins.jetbrains.com/plugin/6971?pr=phpStorm -
IntelliJ Community Edition (free) is good too, but lacks JavaScript code completion
-
Visual Studio Code
https://code.visualstudio.com/
Also recommend installing an Emmet plugin for any IDE you use.
http://emmet.io/
About Ben Ellingson
Ben is a full-stack web developer, mobile app developer, and designer. He is the developer behind nofluffjuststuff.com, uberconf.com, angularsummit.com, several other NFJS websites, and NFJS mobile apps (iOS and Android). He is fluent in JavaScript, Angular, Groovy, Java, Objective-C, Swift, and Front-end engineering. He has 19 years of development experience and is constantly learning new technologies.
[출처] https://angularsummit.com/conference/boston/2016/09/session?id=36767
광고 클릭에서 발생하는 수익금은 모두 웹사이트 서버의 유지 및 관리, 그리고 기술 콘텐츠 향상을 위해 쓰여집니다.
