This session covers the basics of developing Node.js applications with NetBeans. NetBeans includes fully integrated support for both JavaScript and Node.js. You’ll get a tour of the features and learn how NetBeans can accelerate your projects. The presentation looks at basic code editing capabilities provided by the IDE, tool integration (npm/Grunt/Bower/Webpack), frameworks such as Express, and debugging capabilities. You’ll see why NetBeans is the best free JavaScript/Node.js IDE.

1. Node.js Development with
Apache NetBeans
Ryan Cuprak

2. About
Twitter: @ctjava
Email: rcuprak@gmail.com / r5k@3ds.com
Blog: cuprak.info
Linkedin: www.linkedin.com/in/rcuprak

3. Why Apache NetBeans?
1. Sublime Test
2. Visual Studio
Code
3. Brackets
4. Atom
5. Komodo Edit
6. Notepad++
7. BBEdit
8. TextMate
9. Emacs
10.Vim
https://goo.gl/MNyMMA

4. Beating Emacs
Problem: Only Java Developers know about NetBeans!

5. NetBeans Misconceptions
Following statements are NOT TRUE:
• JavaScript support is secondary
• JavaScript integration is just for Java web apps
• Projects must be created with NetBeans
• Projects must be refactored to use NetBeans
• NetBeans can’t deal with framework x and/or build tool y
etc.
NOT TRUE

6. Agenda
• Overview
• Setup
• Live Code Examples
• Simple Node.js
• Node.js + Express
• Gulp Integration
• Angular & Webpack
• Unit Testing
• AWS Lambda Testing

7. Overview

8. JavaScript Features
• Natively supports HTML5 projects.
• CSS3, HTML5, ECMAScript 6 & 7
• Support for HTML5 JavaScript libraries.
• Features
• Syntax highlighting, auto-completion, code folding, etc.
• Full-fledged debugger
• Breakpoints on DOM, line, event, and XMLHttpRequests.
• Call stack, variables, watches
• JavaScript unit testing
• Grunt Support
• SASS/LESS Support
• Apache Cordova (mobile HTML5 development)

9. Supported Frameworks
More…
Note: Integrated support for Oracle Jet

10. File Templates
Category File Types
HTML5/JavaScript HTML File, JavaScript File, CSS, Sass File, Less
file, JSON File, react.js, Jade File, package.json,
Gruntfile.js, gulpfile.js, bower.json, .bowerrc, JET
modules, Knockout JET Module
Selenium Tests Protractor Configuration File, Selenium Mocha Test
Case, Selenium Jasmine Test Case
Unit Tests Karma Configuration File, jsTestDrive Config File
Web Services RESTful JavaScript Client
Custom editor provided for each file type.

11. Project Templates

12. Code Completion

13. Code Analysis

14. CSS3 Editing
Popup for adding
new properties

15. LESS Support
Generated CSS

16. JavaScript Debugging + Chrome

17. DOM Debugging

18. Customizable Palette
• Drag HTML elements from Palette into HTML Window (Wizard appears)
• Drag selections from HTML document to Palette to create new HTML
snippets.

19. Dependency Management
Three different approaches:
• npm
• Bower
• CDNJS

20. Gulp Integration

21. Gulp Integration

22. Node.js Integration
• Fully integrated support for Node.js
• Node.js project wizard
• Search/find Node modules
• Integrated support Express generator
• Project specific Node.js settings

23. Setup

24. NetBeans Setup
1. Install Node.js
2. Download Sources
3. Setup npm/express

25. Install Chrome Plugin
https://goo.gl/Jc9Tq4

26. Configure Runtime Environment
Select Browser to use for testing – project specific.
Note testing on connected
devices.

27. Angular / TypeScript Support
Download plugin: https://github.com/Everlaw/nbts/

28. Angular / TypeScript Support
Install via Plugin Manager

29. Deep Dive

30. Typical Workflow
npm init Edit package.json npm install
NetBeans performs these tasks for us.
Shell commands can be executed at any point
– not locked into the IDE.

31. Demos
• Simple Node.js application & debugging
• Node.js + Express
• Gulp Demo
• Angular 4 Demo with TypeScript & Webpack
• https://github.com/angular/angular2-seed

32. Unit Testing

33. Unit Testing
• Supported Unit Testing frameworks:
• Karma
• JS Test Driver
• Mocha
• Demo
• Jasmine – JavaScript unit testing framework
• Tests written in JavaScript
• Test synchronous and asychronous JavaScript code
• Karma – JavaScript test runner
• Based on NodeJS
• Launches and executes tests in web browser

34. Unit Testing Setup
• For empty projects:
• Add dependencies in package.json
• Create karma.conf file
• Configure testing
• Implements tests
• For existing projects:
• Open project properties and configure

35. Unit Testing Setup

37. AWS Lambda Testing

38. What is AWS Lambda?
• Function as a Service (Faas) from AWS
• Stateless function that executes in the cloud
• Executes in response to events (S3, DynamoDB, API
Gateway, etc)
• Can be implemented using
• JavaScript (Node.js), Java, Python C#
• Billed on executions:
• First million executions are free
• $0.20 per each million afterwards

39. Example Lambda Function
exports.handler = function(event,context) {
context.succeed('Hello ' + event.firstName + ' ' +
event.lastName + ' you are at JavaOne 2017!');
};
{
"firstName": "Ryan",
"lastName": "Cuprak”
}
Handler
Function

40. SAM – AWS Lambda Testing
https://github.com/awslabs/aws-sam-local

41. AWS Lambda & NetBeans
• NetBeans can test AWS Lambda locally
• Prerequisites:
• Install Docker
• Install SAM Local - npm install -g aws-sam-local
• Steps:
1. Create a Node.js project in NetBeans
2. Add aws-sdk to project via npm
3. Implement function
4. Add yaml configuration file
5. Add scripts entry to launch SAM

42. AWS Lambda & NetBeans
Debugging steps:
1. Start SAM in debug mode
2. Trigger event for invocation
3. Attach debugger

44. Q&A
Twitter: @ctjava
Email: rcuprak@gmail.com / r5k@3ds.com
Blog: cuprak.info
Linkedin: www.linkedin.com/in/rcuprak
Slides: www.slideshare.net/rcuprak/presentations
Get involved! https://netbeans.apache.org !!