Ad
More Related Content
What's hot (20)
Viewers also liked (7)
Ad
Similar to PhoneGap Day 2016 EU: Creating the Ideal Cordova Dev Environment (20)
Ad
Recently uploaded (20)
PhoneGap Day 2016 EU: Creating the Ideal Cordova Dev Environment
- 1. Creating the Ideal Dev Environment Ryan J. Salva, Microsoft @ryanjsalva
- 2. DISCLAIMER • There’s no such thing as an “ideal” dev environment. • While I researched the tools used by surveying over 100 Cordova professionals, you may prefer something different. • If you have a tip, preference or better tool, please share it!
- 3. Creating the Ideal Dev Environment • Hardware • Node Version Manager • Globally Installed NPM Packages • VS Code • .bash_profile • Android SDK • Android Emulator • Parallels • Visual Studio • Remote Build Agent
- 4. Hardware (Mac-based) • 13-inch MacBook Pro with Retina display • 3.1GHz Dual-core Intel Core i7, Turbo Boost up to 3.4GHz • 16GB 1866MHz LPDDR3 SDRAM • 1TB PCIe-based Flash Storage • Intel Iris Graphics 6100 • OSX El Capitan • Parallels or VM Ware Fusion Pro
- 5. Hardware (Windows-based) • 13.5-inch Microsoft Surface Book • 6th Gen Intel Core i7 • 1TB SSD • 16GB RAM / dGPU • Windows 10 Pro • iOS Build Options • PhoneGap Build • MacInCloud • Mac Mini
- 6. 0.12.x 2.x all >=4.0 2.x >=5.3.3 >=5.0 3.x >=5.4.1 6.x 3.X none A Complicated Mess
- 7. sudo npm install -g cordova ... npm ERR! npm ERR! Additional logging details can be found in: npm ERR! /Users/ryanjsalva/npm-debug.log npm ERR! not ok code 0
- 8. sudo npm install is a Bad Idea™ • npm install has the ability to run arbitrary scripts. If you accidentally install malicious software with administrative permissions, you’re giving away the keys to the kingdom • Running sudo npm install (without -g) will create a local directory that can only be altered by the root user. • Even sudo npm install -g with a valid installation target can mess things up for you and make it hard to use npm without sudo. Admin will have directory permissions, making permission errors with a local user likely in the future. http://nvm.sh/
- 9. # install nvm curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.1/install.sh | bash # confirm that nvm is installed nvm --version # install the latest stable release nvm install v4.4.4 # make it the default nvm alias default v4.4.4
- 10. # this is a Cordova dev environment, right? npm install –g cordova
- 11. # UI framework npm install –g cordova ionic
- 12. # live updates w/o re-submitting to the store npm install –g cordova ionic code-push-cli
- 13. # future JS features today, req. by Ionic+Ng2 npm install –g cordova ionic code-push-cli typescript
- 14. # simply build pipeline management npm install –g cordova ionic code-push-cli typescript gulp
- 15. # Xcode build from Windows npm install –g cordova ionic code-push-cli typescript gulp remotebuild
- 16. # Install and debug iOS apps w/o opening Xcode npm install –g cordova ionic code-push-cli typescript gulp remotebuild ios-deploy
- 17. # launch iOS simulator from CLI npm install –g cordova ionic code-push-cli typescript gulp remotebuild ios-deploy ios-sim
- 18. # enforce JavaScript code style guide npm install –g cordova ionic code-push-cli typescript gulp remotebuild ios-deploy ios-sim eslint
- 19. # the baseline for our code style guide npm install –g cordova ionic code-push-cli typescript gulp remotebuild ios-deploy ios-sim eslint eslint-plugin-standard
- 20. # enforce TypeScript code style guide npm install –g cordova ionic code-push-cli typescript gulp remotebuild ios-deploy ios-sim eslint eslint-plugin-standard tslint
- 21. # framework agnostic livereload npm install –g cordova ionic code-push-cli typescript gulp remotebuild ios-deploy ios-sim eslint eslint-plugin-standard tslint cdvlive
- 22. # That’s it! Install everything else locally npm install –g cordova ionic code-push-cli typescript gulp remotebuild ios-deploy ios-sim eslint eslint-plugin-standard tslint cdvlive
- 24. Debug your code on any browser, emulator or device. Increase speed & accuracy with Intellisense for plugins. Invoke Cordova commands from the editor. Visual Studio Code
- 25. VS Code Extensions Cordova cordova-tools vscode-eslint tslint JS Native vscode-react-native nativescript
- 26. Google Emulators Apple OSX GenyMotion (requires VirtualBox) Google SDK with HAX Windows Visual Studio Android Emulator
- 27. Building for Windows • Visual Studio • Tools for Apache Cordova • Node 0.12 and NPM 2.2 (sandboxed) • Android SDK • Ant & Gradle • Visual Studio Android Emulator