I say A “front end build pipeline” – You say WAT!?
summary
Shows how a .NET web project uses Gulp + npm + Bower to transpile TypeScript and LESS, bundle and minify assets, and run source maps for debugging. Demonstrates cutting 298 requests and 1.2MB of downloads into a few files, compares sizes to a 163KB Super Mario, and uses systemjs + systemjs-builder for module bundling and ng-annotate to keep Angular DI working after minification. Covers watch tasks, CI build integration, cache-busting, and why not to check compiled node_modules into source control.
AI-written summary · about
chapters (37)
- 0:00Intro
- 1:45First Website
- 4:48Browser Connections
- 6:00TCP
- 8:35Bootstrap
- 13:23Node NPM
- 16:13Bower
- 17:42Package Managers
- 19:52Stock Photos
- 20:13Visual Studio
- 21:57Getting resources
- 23:00Cheating
- 23:46Bower install
- 24:21Bootstrap install
- 25:43Angular install
- 26:31Controller
- 30:35gutless
- 31:37transpile
- 32:44gulp Iscript
- 33:58gulp transpile
- 35:14systemjs config
- 36:35f5 no record
- 36:57Network
- 37:59Watch
- 39:05Reload
- 40:12Watch Task
- 40:57Source Maps
- 42:47Test Run
- 44:18bundling
- 44:59bundleconfig
- 45:48bundle module
- 48:09bundle
- 49:34minifying
- 50:58minified for me
- 55:18parallel
- 56:40minification
- 59:31webconfig
related talks
29mManaging a Large Front-End Project with Automated Build Tools
30mExcuse Me, I Have to Assemble the Frontend
45mFront-End Workflows with Gulp
50mAn Introduction to Gulp
37mGo Node Without Code
01h 52mWriting A Custom Angular Build
23mBuild Systems The Next Generation
51mGrunt JavaScript Automation for the Lazy Developer