Ultra-modern web development (for.NET developers) @pseale
-
Upload
milton-warner -
Category
Documents
-
view
215 -
download
0
Transcript of Ultra-modern web development (for.NET developers) @pseale
Ultra-modernweb development
(for .NET developers)
@psealehttps://github.com/pseale/presentation-modern-dotnet-webdev/
Classic web development, in review:
It’s simpleIt’s stableIt’s fast*
Ɵ We’ll talk about the negatives later
jQuery-era web development, in review: Vast improvement over
raw JavaScript (IE5-era) Fast*
Ɵ bad* for complex UIƟ User experience is bad*
Full stack development:
Designers and frontend engineers can now participate in development*
The web’s huge ecosystem is now ours—this means more of everything
Newest JavaScript:
Has new, C#-alike syntax which is particularly good for C# developers
Ɵ don’t use the “class” keyword*
Building your frontend assets:
Enables you to apply quality control via ESHint, “use strict”, unit tests
Enables transpiling, minifying and packing of assets,
Composability (treat build steps as LEGO™ blocks)
React.js:
Small learning surface (comparable to Knockout.js)
Fast So hot right now* One-way databinding plus Flux
is a “pit of success” for complex apps
Ɵ still in the hype cycle
Server-side JavaScript rendering:
Fast* Fast* SEO-friendly No need to manually
harmonize Razor views with client-side JavaScript templates
Even easier in the future*
Ɵ Which JavaScript runs on the server, and which runs on the client?*
Ɵ I’m afraid to use this in production at work*
“Ultra-modern” versus “Ultra-stable”:
Just as easy* As fast on the page load Faster (AJAX vs postbacks) Enables your frontend
engineers and designers
Ɵ Not as easy*Ɵ The JavaScript community*
Summary: Tools (Page 1 of 2)
•Babel.js for ES6 (ES2015)•React.js from Facebook, • + Redux, the hottest Flux framework*•Gulp.js for build• ESHint and “use strict”; for code quality•Node.js/npm for compiling the frontend• JSPM for browser modules
Summary: Tools (Page 2 of 2)
• Every text editor, IDE, browser dev tool, and all the available training for HTML, JavaScript and CSS•PhantomJS for server-side JavaScript rendering
Summary: Concepts• AJAX-style web development is easy now*• Free your HTML from ASP.NET’s bitter grasp*• Emphasis: don’t blindly accept the ASP.NET default template• Server-side is boring (stable)*• React, Ember, Aurelia, Angular – choose one• Decide whether to bet on TypeScript or not
• If yes, use Aurelia or Angular 2• If no, use “vanilla JavaScript” solutions such as React or Ember
• Think about what the emergence of “full stack developers” means• Specialized, high-quality frontend stack developers• You will have to learn this stuff to remain a “full stack” developer
• You can still build web apps without any JavaScript, or you can build JavaScript-heavy web apps. Either way, stop using jQuery*
AJAX-style web development is easy now—it’s not as much about what more you can do, it’s how little extra effort it is
Decide whether to bet on TypeScript or not:
If yes, use Aurelia or Angular 2
If no, use “vanilla JavaScript” solutions such as React or Ember
Think about what the emergence of “full stack developers” means:
Specialized, high-quality frontend engineers exist now!
You will have to learn this stuff to remain a “full stack” developer
You can EITHER build web apps without any JavaScript, OR you can build JavaScript-heavy web apps.
Either way, stop using jQuery*
Summary: Concepts• AJAX-style web development is easy now*• Free your HTML from ASP.NET’s bitter grasp*• Emphasis: don’t blindly accept the ASP.NET default template• Server-side is boring (stable)*• React, Ember, Aurelia, Angular – choose one• Decide whether to bet on TypeScript or not
• If yes, use Aurelia or Angular 2• If no, use “vanilla JavaScript” solutions such as React or Ember
• Think about what the emergence of “full stack developers” means• Specialized, high-quality frontend stack developers• You will have to learn this stuff to remain a “full stack” developer
• You can still build web apps without any JavaScript, or you can build JavaScript-heavy web apps. Either way, stop using jQuery*