You are excited to be PM and want to lead web or mobile engineering team? However, you are unsure about differences in React and React Native, what is JSX, Babel, ES2018, module manager, NPM registry, Gulp, Webpack, JWT and essentially why web security matters. This session will introduce and explain key terms so that you can have strong working relationship with engineers and bring the team onboard with your vision.

1. https://www.linkedin.com/in/adwankar/
@adwankar

2. Why PM need technical skills?
• Engaged Customer Interactions
• Strong working relationship with engineers
• Intuition on how long engineering work will
take

3. Stack Overflow Survey – 100K
developers
Stack Overflow Developer Survey 2018

4. Developer Role
Stack Overflow Developer Survey 2018

5. Most Popular Technologies
Stack Overflow Developer Survey 2018

6. Most Popular Framework, Library
Stack Overflow Developer Survey 2018

7. Most Popular Databases
Stack Overflow Developer Survey 2018

8. Most Popular Development
Environments
Stack Overflow Developer Survey 2018

9. Version Control
Stack Overflow Developer Survey 2018

10. Correlated Technologies
Stack Overflow Developer Survey 2018

11. What Developers Hope to be doing in
5 years
Stack Overflow Developer Survey 2018

12. State of JavaScript Survey 2017

13. JavaScript Flavors
State of JS 2017
https://stateofjs.com/

14. What is ES2018, ES2017, ES6?
• Latest version of JavaScript from ECMA
Standards group
• Many new developer language features added
• Not yet supported by all Browsers
• Code needs to be Transpiled/Converted to ES5

15. Typescript
• Written by Microsoft
• Adds typed variables to language (var x:string)
• Adds various object oriented concepts to
language
• Used with Angular
• Needs to be transpiled

16. Front End Frameworks
State of JS 2017
https://stateofjs.com/

17. Angular
• Written by Google
• Angular 1.x
Known as AngularJS
• Angular 5.x – 2.x
Known simply as Angular
Written with TypeScript
• Many application capabilities (data, layout,
components) handled by other libraries

18. React
• Written by Facebook
• Referred to as the ‘V’ in MVC
• Takes advantage of Virtual DOM – enhances
performance
• Uses JSX, away to make HTML act like JavaScript
code (kinda)
• Many application capabilities (data, layout,
components) handled by other libraries

19. API and State Mgmt
State of JS 2017
https://stateofjs.com/

20. Web API

21. Back-end frameworks
State of JS 2017
https://stateofjs.com/

22. MERN/ MEAN
• Combines free, open source products for front-end and
back-end
• All are JavaScript based
• Write everything in JavaScript, whether it’s the
database, web services or front-end
• MongoDB - database
• Express – web application framework running on
Node.js
• React or Angular – adds the framework that runs in
the browser
• Node – server side execution environment

23. Testing Tools
State of JS 2017
https://stateofjs.com/

24. Styling
State of JS 2017
https://stateofjs.com/

25. Adaptive Design vs. Responsive Design
• How an application responds when run on
different sized screens or devices
• Adaptive Design, show a completely different
user interface based on the device type - e.g.
desktop compared to mobile
• Responsive Design, the app is may be resizing,
repositioning or showing/hiding components
based on available screen size - the same view is
running across all device types and screen sizes

26. Build Tools
State of JS 2017
https://stateofjs.com/

27. Node Package Manager
• Essentially, npm is a huge repository of open source
JavaScript based code packages
– 650,000 packages
• npm,Inc. offers this as a free service, and offers some
enterprise services
• Packages can be anything from a few lines of code, to a
fully featured framework
• Developers just execute a simple command to add a
package to their project, and it automatically adds any
dependencies
• Manage versions of packages being used

28. Transpilers and Polyfills and
SourceMaps (oh my!)
• These are needed to use ES6 today, since
browsers do not yet fully support ES6
• Transpilers are JavaScript-to-JavaScript compilers
• From ES6 (the new syntax) to ES5 (the browser
supported syntax)
• Babel is a popular transpiler
• Polyfills provide missing language syntax
• SourceMaps allow you to debug the code you
wrote, even though the transpiled code is what is
being run

29. Mobile Frameworks
State of JS 2017
https://stateofjs.com/

30. Progressive Web Applications
• All about the enablement of web applications to offer
native-like benefits, such as offline support:
– Load the app when offline
– Cache app data locally so the user can carry on working
when offline
• To the user, it looks like a native app, and works with
no internet Connectivity
• Displaying a banner inviting the user to “install” the
app to their home screen (on mobile)
• Requires modern browsers, like Chrome and Firefox

31. Web Security Threats