Edy Dawson Notes on SF HTML5 Dev Conf
0 likes478 views
The document discusses many of the popular buzzwords, tools, frameworks, and trends in front-end web development. Key topics mentioned include HTML5, JavaScript libraries like jQuery, CSS preprocessors like SASS, responsive and mobile development, automation of workflows and testing, and collaboration using GitHub. It provides lists of JavaScript frameworks, CSS preprocessors, version control systems, and tools for tasks like compiling CSS and debugging JavaScript. Overall it serves as a broad overview and "baseline" of the current front-end development landscape.
![• Paraphrased from Rebecca Murphey’s article at:
http://http://rmurphey.com/blog/2012/04/12/a-baseline-for-front-end-developers/
• Once upon a time, editing files, testing them locally…and then FTPing
them to the server was the essential workflow of a front-end dev…
• Something has changed in the last couple of years.
• Maybe it’s the result of people starting to take front-end dev seriously
• Maybe it’s browser vendors mostly getting their sh** together
• Or maybe it’s front-end devs …see[ing the] light about the process of
software development…](https://image.slidesharecdn.com/html5conf4-121024142623-phpapp01/85/Edy-Dawson-Notes-on-SF-HTML5-Dev-Conf-6-320.jpg)
Ad
More Related Content
What's hot (20)
Similar to Edy Dawson Notes on SF HTML5 Dev Conf (20)
Ad
Recently uploaded (20)
Ad
Edy Dawson Notes on SF HTML5 Dev Conf
- 2. The buzzwords/phrases heard most often: • HTML5 (of course!) • Javascript libraries & frameworks (such as jQuery) • GitHub (open source collaboration) • SASS (or other CSS precompilers) • Mobile (native or web app?) • Responsive (grids & flexibility) • One-page Web Apps (use that client! Fewer round- trips!)
- 3. • Web design is becoming more like software development • Users expect richer experience, increased interactivity, and speed • Device independence requires planning from back- end to front-end • Mobile developers unhappy with browser support and HTML5 promises. Much talk of developing native apps instead.
- 4. • Developer Tools and Workflow • JavaScript Frameworks, Libraries and APIs • HTML5 • CSS & Precompilers • Collaborative Spaces • Social Media • Browser Support • Mobile Development • Responsive/Adaptive Design & Development
- 5. • JSHint: detect errors in JavaScript • Testing automation: • Deployment automation • Yoeman: manage workflow, libraries & testing • LiveReload: view CSS edits with no reload • CodeKit: compiles Less, Sass, & Stylus files. Combines, minifies & error-checks JavaScript.
- 6. • Paraphrased from Rebecca Murphey’s article at: http://http://rmurphey.com/blog/2012/04/12/a-baseline-for-front-end-developers/ • Once upon a time, editing files, testing them locally…and then FTPing them to the server was the essential workflow of a front-end dev… • Something has changed in the last couple of years. • Maybe it’s the result of people starting to take front-end dev seriously • Maybe it’s browser vendors mostly getting their sh** together • Or maybe it’s front-end devs …see[ing the] light about the process of software development…
- 7. Here are some helpful tools (per Paul Irish, Mike Taylor, Angus Croll, and Vlad Filippov) • JavaScript • Git (and a GitHub account) • Modularity, dependency management and production builds • In-Browser Developer Tools • Command line • Client-side templating • CSS preprocessors • Testing • Process automation • Code quality • MDN - collaborative front-end development documentation
- 8. • Go to a library and start reading books. • If you are the application then the collection of books is the library. • The shelves, the cupboards, and the compound that houses all this constitutes the framework. • Everything you come in contact while performing the task of reading the books is the API.
- 9. • Dojo • Enyo • Ext JS • Google Web Toolkit • jQuery • Midori • MochiKit • MooTools • Prototype • Qooxdoo • Ember • Underscore • JavaScriptMVC • Spine • Backbone • Knockout • Sammy • Angular • SproutCore
- 11. Precompilers allow the use of variables, conditionals, nested rules, mixins, and operations in CSS and then parse it to regular styles. These are a few of the most popular precompilers and authoring frameworks: • SASS: Ruby • Less: PHP • Stylus: • Compass: CSS3 authoring framework with mixins, functions, and helpers for SASS. • CodeKit: compiles Less, Sass, Stylus, and more.
- 12. • GitHub: Uses Git (fast, efficient, distributed version control system for collaborative development.) • Beanstalk: Uses Subversion, Mercurial, Git. • Google Code Hosting: • Bitbucket:
- 15. Create mobile applications for iOS, Android, Blackberry, Windows Phone, Palm WebOS, Bada and Symbian using the HTML, CSS and JavaScript.
- 17. There was so much information, and so many great resources to investigate. Can’t possibly put them all in this presentation (however, initially, I did try! Whew!) Please refer to Confluence for further investigation. Also, I will continue my research into many of these technologies on edydawsonwebdev.wordpress.com Thank you!