Web Development Workflow: Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
Zeile 26: | Zeile 26: | ||
* In-Browser Devtools | * In-Browser Devtools | ||
** sourceURL ([http://www.thecssninja.com/javascript/source-mapping Source Mapping], [http://www.thecssninja.com/demo/source_mapping/compile.html Source Mapping Compile Demo]) | ** sourceURL ([http://www.thecssninja.com/javascript/source-mapping Source Mapping], [http://www.thecssninja.com/demo/source_mapping/compile.html Source Mapping Compile Demo]) | ||
+ | ** source maps - full live debugging on source files with Chrome Dev tools. | ||
+ | ** Navigating scripts | ||
+ | * Mobile | ||
+ | ** Test in Chrome | ||
+ | *** Emulate touches, override device metrics | ||
+ | ** Emulators & Browserstack | ||
+ | ** Real device & Adobe Shadow | ||
+ | ** Chrome on Android w/ DevTools | ||
==Others== | ==Others== |
Version vom 12. Juni 2013, 20:05 Uhr
Javascript Development Workflow of 2013
Video: Javascript Development Workflow of 2013 by Paul Irish (PDF)
- A Baseline for Front-End Developers
- Shell:
- Shell customizations: http://dotfiles.github.io/
- Faves: z script (for jumping), server alias
- Editor:
- learn it well, most important
- Code linting is your first unit test.
- Realtime Feedback
- live linting
- live recompilation
- live reload
- Javascript
- Modules / Dependency management
- AMD modules
- CommonJS modules
- ECMAScript Harmony modules
- Minispade require (ember.js example)
- Tricks:
- Template precompilation - into functions in a build step and ship the compiled templates.
- Custom build output based on build-time forks. (require.js optimizier)
- More module magic from Alex Sexton (MVC MODULE MAGIC)
- Modules / Dependency management
- Package Management - cooming soon.
- In-Browser Devtools
- sourceURL (Source Mapping, Source Mapping Compile Demo)
- source maps - full live debugging on source files with Chrome Dev tools.
- Navigating scripts
- Mobile
- Test in Chrome
- Emulate touches, override device metrics
- Emulators & Browserstack
- Real device & Adobe Shadow
- Chrome on Android w/ DevTools
- Test in Chrome