Wheel.js
•Download as PPTX, PDF•
1 like•2,228 views
Does the world need another front-end JavaScript framework. Apparently it does. This is a presentation on the need for a mobile and desktop web framework, and one possible rebuilding of the wheel.
Report
Share
Report
Share
Recommended
GCC 11-13-15
The meeting covered progress updates, goals for structuring and styling a web page using the Bootstrap CSS library, an introduction to jQuery for manipulating HTML elements and handling events, and plans for the next coding assignment on JavaScript and a trial Skype meeting. Participants were asked to provide availability for a Skype call instead of an in-person meeting and to work through Lesson 10 of JavaScript coding by the next meeting.
jQuery for Drupal
This document discusses jQuery and how it can be used with Drupal. It explains that jQuery was incorporated into Drupal core starting with Drupal 5 to simplify cross-browser compatibility and enable animation effects. It provides examples of jQuery syntax and discusses how to add jQuery to Drupal themes. Additionally, it outlines several common uses of jQuery with Drupal, such as expanding content and AJAX functionality, and lists some popular jQuery modules.
Modular & Event driven UI Architecture
The document discusses modular and event-driven UI architectures. It describes modules as single, solid units with defined interfaces that can be composed of other modules. An event-driven architecture uses a publish/subscribe pattern where events can be triggered and other parts of the code can listen and respond to those events. Backbone.js is presented as a popular MV* framework for building modular single page apps in an event-driven and RESTful way using models, views, collections, and a router.
Harness jQuery Templates and Data Link
This document discusses using jQuery Templates and Data Link to build dynamic data-driven browser applications. It describes how jQuery Templates can be used to render templates from data but offers limited interactivity. jQuery Data Link allows binding data to HTML but has no templating. The presentation previews a new approach called JsViews that integrates Templates and Data Link to provide both fast rendering of templates to static HTML strings as well as fully interactive and responsive views through two-way data binding between templates and JavaScript data objects.
Flexible UI Components for a Multi-Framework World
Slides from Flexible UI Components talk given at Web Unleashed 2017
Build UI components that work seamlessly in every JavaScript Framework.
Your core UI elements shouldn’t have to be different for your marketing site than they are in your application just because the former uses jQuery while the latter is built using Angular or React.
Lessons learned from work on ZURB Foundation 7.
The Mobile Development Landscape
A talk I was asked to give on the various options for building mobile applications / getting content onto mobile devices.
I chose to organize it as gradient surveying the spectrum from web to native, all the stuff in between. Unfortunately for native I've only had experience with iOS so I couldn't really speak towards the other platforms.
I do think that non native solutions can take care of 95% of the use cases, and this gap will only narrow as time goes on - I'm thinking back to early 2010 when cross platform SDKs like Appcelerator Titanium came onto the scene and how much has changed.
How to Use WebVR to Enhance the Web Experience
Presented at Web Unleashed 2017. More info at www.fitc.ca/webu
Presented by Kevin Vandecar, Autodesk
Overview
With different virtual reality (VR) devices in the market, the VR experience is getting more and more popular by consumers. WebVR brings the VR concept to the web by providing interfaces to VR hardware. This makes it much easier to build a VR experience with content delivered through a web browser. This topic will introduce the WebVR specification, and will show some interesting demos of how it can be used. There are several frameworks you can work with and even mix together. Kevin will discuss some different frameworks including Three.js, Autodesk Forge Viewer, and ReactVR. The talk will feature live demos, and the code behind the different examples.
Objective
Learn what WebVR is and how it could help your web experience.
Target Audience
Front-end developers who are interested in VR/AR experiences.
Assumed Audience Knowledge
Basic web dev skills
Five Things Audience Members Will Learn
What is WebVR
Introduction to a few WebVR frameworks
Different WebVR hardware experiences
Options to author/obtain content for WebVR experiences
Touch on AR possibilities
Realtime web apps rails
The document discusses the differences between web sites and web apps, and how to create real-time functionality in Rails applications. It explains that web sites focus on content consumption while web apps enable interaction. Emerging applications now expect more real-time functionality, updating content without page refreshes. This can be achieved in Rails using tools like Juggernaut, which implements real-time functionality using Node.js, Redis, and websockets to push data from Rails to the client-side in real-time. Alternatives like Pusher are also discussed.
Recommended
GCC 11-13-15
The meeting covered progress updates, goals for structuring and styling a web page using the Bootstrap CSS library, an introduction to jQuery for manipulating HTML elements and handling events, and plans for the next coding assignment on JavaScript and a trial Skype meeting. Participants were asked to provide availability for a Skype call instead of an in-person meeting and to work through Lesson 10 of JavaScript coding by the next meeting.
jQuery for Drupal
This document discusses jQuery and how it can be used with Drupal. It explains that jQuery was incorporated into Drupal core starting with Drupal 5 to simplify cross-browser compatibility and enable animation effects. It provides examples of jQuery syntax and discusses how to add jQuery to Drupal themes. Additionally, it outlines several common uses of jQuery with Drupal, such as expanding content and AJAX functionality, and lists some popular jQuery modules.
Modular & Event driven UI Architecture
The document discusses modular and event-driven UI architectures. It describes modules as single, solid units with defined interfaces that can be composed of other modules. An event-driven architecture uses a publish/subscribe pattern where events can be triggered and other parts of the code can listen and respond to those events. Backbone.js is presented as a popular MV* framework for building modular single page apps in an event-driven and RESTful way using models, views, collections, and a router.
Harness jQuery Templates and Data Link
This document discusses using jQuery Templates and Data Link to build dynamic data-driven browser applications. It describes how jQuery Templates can be used to render templates from data but offers limited interactivity. jQuery Data Link allows binding data to HTML but has no templating. The presentation previews a new approach called JsViews that integrates Templates and Data Link to provide both fast rendering of templates to static HTML strings as well as fully interactive and responsive views through two-way data binding between templates and JavaScript data objects.
Flexible UI Components for a Multi-Framework World
Slides from Flexible UI Components talk given at Web Unleashed 2017
Build UI components that work seamlessly in every JavaScript Framework.
Your core UI elements shouldn’t have to be different for your marketing site than they are in your application just because the former uses jQuery while the latter is built using Angular or React.
Lessons learned from work on ZURB Foundation 7.
The Mobile Development Landscape
A talk I was asked to give on the various options for building mobile applications / getting content onto mobile devices.
I chose to organize it as gradient surveying the spectrum from web to native, all the stuff in between. Unfortunately for native I've only had experience with iOS so I couldn't really speak towards the other platforms.
I do think that non native solutions can take care of 95% of the use cases, and this gap will only narrow as time goes on - I'm thinking back to early 2010 when cross platform SDKs like Appcelerator Titanium came onto the scene and how much has changed.
How to Use WebVR to Enhance the Web Experience
Presented at Web Unleashed 2017. More info at www.fitc.ca/webu
Presented by Kevin Vandecar, Autodesk
Overview
With different virtual reality (VR) devices in the market, the VR experience is getting more and more popular by consumers. WebVR brings the VR concept to the web by providing interfaces to VR hardware. This makes it much easier to build a VR experience with content delivered through a web browser. This topic will introduce the WebVR specification, and will show some interesting demos of how it can be used. There are several frameworks you can work with and even mix together. Kevin will discuss some different frameworks including Three.js, Autodesk Forge Viewer, and ReactVR. The talk will feature live demos, and the code behind the different examples.
Objective
Learn what WebVR is and how it could help your web experience.
Target Audience
Front-end developers who are interested in VR/AR experiences.
Assumed Audience Knowledge
Basic web dev skills
Five Things Audience Members Will Learn
What is WebVR
Introduction to a few WebVR frameworks
Different WebVR hardware experiences
Options to author/obtain content for WebVR experiences
Touch on AR possibilities
Realtime web apps rails
The document discusses the differences between web sites and web apps, and how to create real-time functionality in Rails applications. It explains that web sites focus on content consumption while web apps enable interaction. Emerging applications now expect more real-time functionality, updating content without page refreshes. This can be achieved in Rails using tools like Juggernaut, which implements real-time functionality using Node.js, Redis, and websockets to push data from Rails to the client-side in real-time. Alternatives like Pusher are also discussed.
Smooth Animations for Web & Hybrid
Presented at Web Unleashed 2017. More info at www.fitc.ca/webu
Presented by Alexander Blom, Isle of Code
Overview
Adding animations to web and hybrid apps can be challenging. Aside from choosing technique, you are often left with jank and less than desirable performance.
Objective
Audience members will leave with a better understanding of animation performance & pitfalls desktop and mobile context.
Target Audience
Web/Hybrid developers looking to improve animation performance.
Assumed Audience Knowledge
Basic JS/CSS assumed
Six Things Audience Members Will Learn
What are my choices when needing to animate?
What changes in a mobile context?
What are the tradeoffs and how do I decide?
What are the common pitfalls?
How do I debug performance problems?
Getting a smooth animation.
JsViews - Next Generation jQuery Templates
Come and see the future of jQuery Templates, as it moves from Beta1 towards a V1 product. The new jQuery Templates is taking two forms: JsRender – lean and mean, for fast rendering of templates as strings, and JsViews – for powerful interactive browser apps in which Data Link and Templates work hand-in-hand. See how with declarative data linking and templating together, creating powerful data-driven UI is easy, whether using MVVM patterns or binding directly to JSON, and whatever the richness or complexity of the underlying data.
jQuery UI is already building its future data-bound widgets on top of this technology. With JsViews and JsRender integration between jQuery UI controls and your own data and UI becomes trivially straightforward.
jQuery Conference San Diego 2014 - Web Performance
This document discusses jQuery and web performance. It describes how the jQuery Foundation maintains jQuery code and supports developers. It then discusses recent jQuery releases and how jQuery can be customized and used in different environments. The document outlines how the browser loads pages and the importance of prefetching resources. It recommends tools for analyzing page performance like YSlow, PageSpeed, and webpagetest.org. It provides tips for improving performance such as avoiding unnecessary layouts, optimizing JavaScript loops, and using developer tools to profile scripts and identify bottlenecks.
JavaScript Library Overview (Ajax Exp West 2007)
This document summarizes and compares several popular JavaScript libraries: Dojo, Prototype, jQuery, Mootools, and YUI. It outlines the focus, key features, documentation/community support, file size, and popularity for each library. The libraries provide DOM manipulation, event handling, effects/animations, and Ajax capabilities with varying levels of features and complexity. jQuery is highlighted as having a small file size and strong popularity while providing core functionality.
Webpack: What it is, What it does, Whether you need it
Webpack is a module bundler that bundles JavaScript files and their dependencies into packages that can be loaded in a browser. It provides features like module bundling, code splitting, tree shaking, code minification and optimization. While powerful, its configuration can be complex and obtuse. Alternatives like Browserify provide similar functionality but may be easier to use.
Backbone.js slides
Backbone.js abstracts remote resources into models and collections that emit events on state changes. This allows views to bind and respond to those changes. It provides concepts like models, collections, views and controllers to deal with common problems in web development like organizing rendering of views, supporting navigation, and avoiding callback soup. By abstracting functionality, separating concerns, and decoupling code, Backbone follows best practices and theoretical definitions of frameworks.
jQuery in the [Aol.] Enterprise
Last year, AOL adopted a new content strategy and has positioned itself as a premier destination for original content. Core to this strategy is having reusable, highly efficient and optimized common code and experiences at scale, which is where jQuery comes in. Check in with Dave Artz to see how jQuery has helped his front-end standards team tackle unique challenges like optimizing 3rd party widget performance, overriding plugin functionality, and managing dependencies and updates across 100+ sites spanning multiple back-end platforms.
Dangerous CSS
The document discusses best practices for organizing and structuring CSS code, including:
1. Using inheritance, cascading, and specificity principles to determine which styles take precedence.
2. Avoiding inline styles, <br> tags for spacing, for empty elements, and tables for layout as they harm semantics and structure.
3. Preferring class names over IDs due to lower specificity, and using flexbox, grid, rem/em units, and preprocessing with LESS/Sass for modularity and responsive design.
Advanced jQuery (Ajax Exp 2007)
This document discusses jQuery plugins, including how to create and use them. It provides examples of existing plugins for widgets, drag and drop, forms, and more. The document demonstrates how to build a wizard functionality using plugins for blocking elements, submitting ajax forms, and tabs.
Thinkin' Tags - Rapid Prototyping of CSS Layouts
Some thoughts about the challenges of creating "Thinkin' Tags" as a JavaScript developer ... presented on apps.berlin.js (Feb., 28th, 2013)
Buzzr: A "Cloud" Platform for Creating and Maintaining Websites
About the Buzzr,com "Software as a Service" platform for creating and running one or many websites. Based on Drupal, its very sophisticated and can run the website of a mid-sized organization, like a college, but with a streamlined user interface for ease of use.
Introduction to jQuery (Ajax Exp 2007)
jQuery is an open source JavaScript library that simplifies HTML and JavaScript interaction. It has a small file size, is fully documented, and supported across many browsers. jQuery allows developers to select elements, perform actions on them such as effects, events, DOM manipulation, and AJAX requests, using its simple and concise syntax.
Website Review with Screen Reader vs. SiteImprove
Comparison of Accessibility test results with automation versus a walkthrough of the site with Apple Voice Over screen reader.
The presentation was made to my team members at Mississippi State University Libraries to demonstrate the effectiveness of SiteImprove, our automated website accessibility checker compared with the actual experience of using the site with assistive technology.
As a novice with assistive technology, this does not serve as a legitimate study or review of the site, but simply a demonstration.
2011 - SharePoint + jQuery
The document discusses using jQuery with SharePoint. It describes jQuery as a JavaScript library for animation and effects. It explains how to include jQuery in SharePoint by uploading the jQuery file and referencing it in the master page. It provides examples of using jQuery selectors and methods to modify HTML elements and add interactivity. It demonstrates how to create an accordion, image rotator, and news rotator using jQuery in SharePoint list view web parts.
Javascript & Jquery
JavaScript is a client-side scripting language that allows for more web functionality on the user's machine, improving server performance and page load times. jQuery is a popular JavaScript library that simplifies tasks like HTML document manipulation, event handling, and Ajax calls. To use jQuery, include the jQuery script in an HTML file and use jQuery syntax with $ selectors to target elements and perform actions on them. Callbacks allow functions to execute asynchronously after their parent functions complete.
Mobile native-hacks
This document provides 14 lessons and hacks for building native and mobile web applications using JavaScript. It discusses issues like architecting for multiple platforms and environments, structuring the codebase, detecting the platform, improving performance of animations through CSS transitions, handling garbage collection of images and HTML, supporting touch events, adding sound, and leveraging tools like PhoneGap Build. The tips aim to help developers apply their web skills to build applications that run on both desktop and mobile devices using a single codebase.
Maven
Maven is a Java project management and build tool that uses a Project Object Model (POM) defined in XML files to manage a project's build, reporting and documentation from a central information source. It is based on a small core with numerous plugins that can be used to compile code, run tests, generate documentation and more. Maven uses local and remote repositories to download dependencies and build artifacts that projects specify in their POM files.
Canopy view of single-page applications (SPAs)
This document discusses single-page applications (SPAs) and related technologies. It defines an SPA as having a single HTML file, responsive CSS, JavaScript modules, and an underlying API that typically follows the MVVM pattern. Examples are given of why SPAs provide a consistent user experience across devices and partially-connected functionality for data-rich apps. Potential downsides discussed are that SPAs are not well-suited for sites needing good search engine optimization. The document also summarizes several JavaScript technologies used in SPAs, including RequireJS for module loading, KnockoutJS for model binding, and BreezeJS for querying data via LINQ. It describes how these can work together with MVC on the server
jQuery Mobile Introduction
jQuery Mobile Introduction
Presented at Dutch Mobile Conference, June 9, 2012
www.mobileconference.nl
Level: beginner
Responsivedesign 7-3-2012
The document is a presentation by Tom Carney about responsive web design. It discusses Carney's background in web development for over 10 years and experience with mobile and responsive design for 18 months. The presentation covers the introduction of responsive design, responsive design techniques like grids, media queries and plugins, transitioning websites to responsive design, responsive design workflows, and examples of responsive design. It addresses setting separate mobile sites versus responsive design and takes questions from the audience.
Wintellect - Devscovery - Enterprise JavaScript Development 2 of 2
This document summarizes a presentation on JavaScript frameworks and libraries. It discusses tools like JSLint and JSHint for code quality, jQuery for DOM manipulation, JSON and Web API for data, Twitter Bootstrap for layouts, Underscore.js for utility functions, Backbone.js for MVC, RequireJS for dependencies, Kendo UI for MVVM, and Amplify.js for pub/sub messaging. It recommends using these libraries to make code cross-browser compatible, modular, data-friendly, consistent, and decoupled.
Edy Dawson Notes on SF HTML5 Dev Conf
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.
More Related Content
What's hot
Smooth Animations for Web & Hybrid
Presented at Web Unleashed 2017. More info at www.fitc.ca/webu
Presented by Alexander Blom, Isle of Code
Overview
Adding animations to web and hybrid apps can be challenging. Aside from choosing technique, you are often left with jank and less than desirable performance.
Objective
Audience members will leave with a better understanding of animation performance & pitfalls desktop and mobile context.
Target Audience
Web/Hybrid developers looking to improve animation performance.
Assumed Audience Knowledge
Basic JS/CSS assumed
Six Things Audience Members Will Learn
What are my choices when needing to animate?
What changes in a mobile context?
What are the tradeoffs and how do I decide?
What are the common pitfalls?
How do I debug performance problems?
Getting a smooth animation.
JsViews - Next Generation jQuery Templates
Come and see the future of jQuery Templates, as it moves from Beta1 towards a V1 product. The new jQuery Templates is taking two forms: JsRender – lean and mean, for fast rendering of templates as strings, and JsViews – for powerful interactive browser apps in which Data Link and Templates work hand-in-hand. See how with declarative data linking and templating together, creating powerful data-driven UI is easy, whether using MVVM patterns or binding directly to JSON, and whatever the richness or complexity of the underlying data.
jQuery UI is already building its future data-bound widgets on top of this technology. With JsViews and JsRender integration between jQuery UI controls and your own data and UI becomes trivially straightforward.
jQuery Conference San Diego 2014 - Web Performance
This document discusses jQuery and web performance. It describes how the jQuery Foundation maintains jQuery code and supports developers. It then discusses recent jQuery releases and how jQuery can be customized and used in different environments. The document outlines how the browser loads pages and the importance of prefetching resources. It recommends tools for analyzing page performance like YSlow, PageSpeed, and webpagetest.org. It provides tips for improving performance such as avoiding unnecessary layouts, optimizing JavaScript loops, and using developer tools to profile scripts and identify bottlenecks.
JavaScript Library Overview (Ajax Exp West 2007)
This document summarizes and compares several popular JavaScript libraries: Dojo, Prototype, jQuery, Mootools, and YUI. It outlines the focus, key features, documentation/community support, file size, and popularity for each library. The libraries provide DOM manipulation, event handling, effects/animations, and Ajax capabilities with varying levels of features and complexity. jQuery is highlighted as having a small file size and strong popularity while providing core functionality.
Webpack: What it is, What it does, Whether you need it
Webpack is a module bundler that bundles JavaScript files and their dependencies into packages that can be loaded in a browser. It provides features like module bundling, code splitting, tree shaking, code minification and optimization. While powerful, its configuration can be complex and obtuse. Alternatives like Browserify provide similar functionality but may be easier to use.
Backbone.js slides
Backbone.js abstracts remote resources into models and collections that emit events on state changes. This allows views to bind and respond to those changes. It provides concepts like models, collections, views and controllers to deal with common problems in web development like organizing rendering of views, supporting navigation, and avoiding callback soup. By abstracting functionality, separating concerns, and decoupling code, Backbone follows best practices and theoretical definitions of frameworks.
jQuery in the [Aol.] Enterprise
Last year, AOL adopted a new content strategy and has positioned itself as a premier destination for original content. Core to this strategy is having reusable, highly efficient and optimized common code and experiences at scale, which is where jQuery comes in. Check in with Dave Artz to see how jQuery has helped his front-end standards team tackle unique challenges like optimizing 3rd party widget performance, overriding plugin functionality, and managing dependencies and updates across 100+ sites spanning multiple back-end platforms.
Dangerous CSS
The document discusses best practices for organizing and structuring CSS code, including:
1. Using inheritance, cascading, and specificity principles to determine which styles take precedence.
2. Avoiding inline styles, <br> tags for spacing, for empty elements, and tables for layout as they harm semantics and structure.
3. Preferring class names over IDs due to lower specificity, and using flexbox, grid, rem/em units, and preprocessing with LESS/Sass for modularity and responsive design.
Advanced jQuery (Ajax Exp 2007)
This document discusses jQuery plugins, including how to create and use them. It provides examples of existing plugins for widgets, drag and drop, forms, and more. The document demonstrates how to build a wizard functionality using plugins for blocking elements, submitting ajax forms, and tabs.
Thinkin' Tags - Rapid Prototyping of CSS Layouts
Some thoughts about the challenges of creating "Thinkin' Tags" as a JavaScript developer ... presented on apps.berlin.js (Feb., 28th, 2013)
Buzzr: A "Cloud" Platform for Creating and Maintaining Websites
About the Buzzr,com "Software as a Service" platform for creating and running one or many websites. Based on Drupal, its very sophisticated and can run the website of a mid-sized organization, like a college, but with a streamlined user interface for ease of use.
Introduction to jQuery (Ajax Exp 2007)
jQuery is an open source JavaScript library that simplifies HTML and JavaScript interaction. It has a small file size, is fully documented, and supported across many browsers. jQuery allows developers to select elements, perform actions on them such as effects, events, DOM manipulation, and AJAX requests, using its simple and concise syntax.
Website Review with Screen Reader vs. SiteImprove
Comparison of Accessibility test results with automation versus a walkthrough of the site with Apple Voice Over screen reader.
The presentation was made to my team members at Mississippi State University Libraries to demonstrate the effectiveness of SiteImprove, our automated website accessibility checker compared with the actual experience of using the site with assistive technology.
As a novice with assistive technology, this does not serve as a legitimate study or review of the site, but simply a demonstration.
2011 - SharePoint + jQuery
The document discusses using jQuery with SharePoint. It describes jQuery as a JavaScript library for animation and effects. It explains how to include jQuery in SharePoint by uploading the jQuery file and referencing it in the master page. It provides examples of using jQuery selectors and methods to modify HTML elements and add interactivity. It demonstrates how to create an accordion, image rotator, and news rotator using jQuery in SharePoint list view web parts.
Javascript & Jquery
JavaScript is a client-side scripting language that allows for more web functionality on the user's machine, improving server performance and page load times. jQuery is a popular JavaScript library that simplifies tasks like HTML document manipulation, event handling, and Ajax calls. To use jQuery, include the jQuery script in an HTML file and use jQuery syntax with $ selectors to target elements and perform actions on them. Callbacks allow functions to execute asynchronously after their parent functions complete.
Mobile native-hacks
This document provides 14 lessons and hacks for building native and mobile web applications using JavaScript. It discusses issues like architecting for multiple platforms and environments, structuring the codebase, detecting the platform, improving performance of animations through CSS transitions, handling garbage collection of images and HTML, supporting touch events, adding sound, and leveraging tools like PhoneGap Build. The tips aim to help developers apply their web skills to build applications that run on both desktop and mobile devices using a single codebase.
Maven
Maven is a Java project management and build tool that uses a Project Object Model (POM) defined in XML files to manage a project's build, reporting and documentation from a central information source. It is based on a small core with numerous plugins that can be used to compile code, run tests, generate documentation and more. Maven uses local and remote repositories to download dependencies and build artifacts that projects specify in their POM files.
Canopy view of single-page applications (SPAs)
This document discusses single-page applications (SPAs) and related technologies. It defines an SPA as having a single HTML file, responsive CSS, JavaScript modules, and an underlying API that typically follows the MVVM pattern. Examples are given of why SPAs provide a consistent user experience across devices and partially-connected functionality for data-rich apps. Potential downsides discussed are that SPAs are not well-suited for sites needing good search engine optimization. The document also summarizes several JavaScript technologies used in SPAs, including RequireJS for module loading, KnockoutJS for model binding, and BreezeJS for querying data via LINQ. It describes how these can work together with MVC on the server
jQuery Mobile Introduction
jQuery Mobile Introduction
Presented at Dutch Mobile Conference, June 9, 2012
www.mobileconference.nl
Level: beginner
Responsivedesign 7-3-2012
The document is a presentation by Tom Carney about responsive web design. It discusses Carney's background in web development for over 10 years and experience with mobile and responsive design for 18 months. The presentation covers the introduction of responsive design, responsive design techniques like grids, media queries and plugins, transitioning websites to responsive design, responsive design workflows, and examples of responsive design. It addresses setting separate mobile sites versus responsive design and takes questions from the audience.
What's hot (20)
jQuery Conference San Diego 2014 - Web Performance
jQuery Conference San Diego 2014 - Web Performance
Webpack: What it is, What it does, Whether you need it
Webpack: What it is, What it does, Whether you need it
Buzzr: A "Cloud" Platform for Creating and Maintaining Websites
Buzzr: A "Cloud" Platform for Creating and Maintaining Websites
Similar to Wheel.js
Wintellect - Devscovery - Enterprise JavaScript Development 2 of 2
This document summarizes a presentation on JavaScript frameworks and libraries. It discusses tools like JSLint and JSHint for code quality, jQuery for DOM manipulation, JSON and Web API for data, Twitter Bootstrap for layouts, Underscore.js for utility functions, Backbone.js for MVC, RequireJS for dependencies, Kendo UI for MVVM, and Amplify.js for pub/sub messaging. It recommends using these libraries to make code cross-browser compatible, modular, data-friendly, consistent, and decoupled.
Edy Dawson Notes on SF HTML5 Dev Conf
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.
jQuery - the world's most popular java script library comes to XPages
This document discusses using jQuery with XPages. It begins with an introduction to jQuery, explaining that it is a popular JavaScript library that simplifies document manipulation, events, animation, and AJAX. It then compares jQuery to Dojo and provides guidance on when each should be used. The document demonstrates how jQuery works via its API and methods. It also explains how to add jQuery to an XPages application either directly in code or via a theme. Finally, it discusses jQuery plugins and how they can provide ready-made functionality to solve requirements.
The Mobile Web - HTML5 on mobile devices
This presentation was given to the Atlanta HTML5 User Group on Sept 22, 2011 (http://www.meetup.com/AtlantaHTML5/events/29823121/).
Vlad Zelinschi - Embrace Native JavaScript (the anti-plugins talk) - Codecamp...
The document discusses the use of plugins in JavaScript development. It notes that while plugins can improve development speed, they can negatively impact performance and introduce dependencies. The document recommends using native JavaScript APIs instead of plugins when possible, as native code is often faster and avoids unnecessary dependencies. It also recommends dropping jQuery in favor of native alternatives for DOM manipulation, events, and animations in modern browsers that support these features natively.
Javascript for Wep Apps
JavaScript frameworks allow business logic to run on the client by sending JSON data on page load rather than dynamic HTML. This allows JavaScript to set up objects and classes to make assumptions without round trips to the server, improving performance. Popular frameworks like Backbone, Ember, Angular, Knockout, and Meteor emphasize separating UI from logic, data binding, templating, and routing to enable single-page applications. Meteor stands out by using the same syntax on client and server and web sockets for automatic UI updates.
Building Mobile Web Apps with jQM and Cordova on Azure
This document provides an overview of building mobile web apps with jQuery Mobile (jQM) and Apache Cordova on the Microsoft Azure platform. It discusses:
- Using Azure for hosting, data storage, and backend services for mobile apps
- Choosing jQM for the frontend framework due to its ease of use and integration with third party libraries
- Common issues encountered like data access across domains and debugging tools
- Packaging the app into a native format for iOS and Android using Cordova
- Tips for caching, maps integration, and avoiding duplicate event handling code
Getting started with dev tools (4/10/17 DC)
This document provides an introduction to using developer tools in Chrome. It discusses how to open dev tools, use the various panels to edit HTML, CSS, and JavaScript in real-time, debug JavaScript issues, and analyze network performance. The key benefits of using dev tools are inspecting and updating the DOM, testing responsiveness, running JavaScript in the console, debugging JavaScript, and measuring performance. Live editing allows testing changes without refreshing the page. The document recommends Chrome as the standard browser for developers and provides tips, demonstrations, and challenges for using different dev tools features.
Sugarcoating your frontend one ViewModel at a time
This document discusses modern JavaScript development approaches like MVVM and KnockoutJS. It promotes using a ViewModel pattern to separate application logic and state from the view. This improves testability and avoids issues like tightly coupled JavaScript code. The document provides examples of building Single Page Applications with KnockoutJS, handling dependencies through AMD, and using frameworks to create composable user interfaces. Overall it advocates for test-driven development and leveraging new JavaScript capabilities for building maintainable, modular applications.
jQuery: The World's Most Popular JavaScript Library Comes to XPages
Whether you want to add some serious eye candy to your XPages Applications or just want to do more with less code, jQuery, the world’s most popular JavaScript framework can help you. Come to this webinar and find out how you can use some of the thousands of jQuery plugins, in harmony with Dojo, within your XPages applications to create a better experience not only for your users, but for you as a developer. In this webinar, we'll look at how jQuery works, how to add it to your XPages, and how a complete JavaScript beginner can take advantage of its power. We'll demonstrate many working examples -- and a sample database will be provided.
Tech io spa_angularjs_20130814_v0.9.5
This document provides an overview of single page applications (SPAs) and AngularJS. It discusses why SPAs are useful, how they work, and key aspects of AngularJS like data binding, directives, routing, and dependency injection. Code samples are presented to demonstrate basic concepts like data binding, controllers, filters, and building an e-commerce application with routing and services. Future sessions are proposed to cover integration with Node.js backends, testing with Karma, and custom directives.
Building SPA’s (Single Page App) with Backbone.js
Building SPA’s (Single Page App) with Backbone.jsMicrosoft Developer Network (MSDN) - Belgium and Luxembourg
The document discusses trends in application development for mobile and cross-platform use. It notes the rise of consumerization of technology and the need to build apps that can be used on any device. This has led to changes like using HTML and JavaScript instead of platform-specific languages to allow cross-platform support. Frameworks like Backbone.js and libraries like Underscore.js can help manage the complexity of building such apps. The document also discusses considerations for responsive design, client-side architecture including MV* frameworks, and tools to support development.Angular mobile angular_u
Angular: Go Mobile!
How could you develop a mobile app across iOS, Android or windows devices? We’ll show how Apache Cordova opens the world of mobile app development to web developers. In the session, a “To Do” app using Angular will be explored and then it will be demonstrated step by step on how to turn it into a mobile app, with access to native device capabilities. Along the way, you'll also learn what kind of apps are best-suited for the hybrid architecture and when to make the switch from web app to mobile app.
Drupal 7 - The Top 40 Core Modules and What They Mean for You
Join Dries Buytaert, the creator and project lead for the Drupal open source social publishing system, for a one-hour presentation on the new Drupal 7. Dries will discuss the changes to Drupal 7, the new modules that have been added to core, and how these new modules will impact the Drupal 7 platform for developers, designers, site administrators and end-users. This is the second in a series of Drupal 7 Webinars hosted by Dries.
Building Enterprise Grade Front-End Applications with JavaScript Frameworks
Presented at Web Unleashed 2016 in Toronto.
By Chad Upton
FITC produces events for digital creators in Toronto, Amsterdam, NYC and beyond
Save 10% off any of our events with discount code 'slideshare'
Check out our events at http://fitc.ca
or follow us at https://twitter.com/fitc
Overview
Web applications are replacing desktop apps in a lot of enterprises. In this talk we'll look at why we should build web apps in the enterprise. Specifically, we'll look at frameworks such as Angular and React plus the libraries, testing tools, procedures and DevOps processes we should use; and how to bring all of those pieces together to make our enterprise web application easy to build, maintain and deploy.
Objective
Teach the ingredients of successful enterprise web applications
Target Audience
Web app developers, app development managers and CTOs
Assumed Audience Knowledge
Involvement with building web applications is helpful but not necessary
Three Things Audience Members Will Learn
Why we build web applications in the enterprise
Tooling, testing and frameworks that work well together
Application build and deployment strategies
Single Page Application Development with backbone.js and Simple.Web
This document summarizes a presentation about developing single page applications using Backbone.js and Simple.Web. It discusses Backbone.js and its core components like models, views and routers. It also covers libraries that are commonly used with Backbone like Underscore, Handlebars and RequireJS. Finally, it provides an overview of Simple.Web, a SOLID-based REST framework that can be used with Backbone.js applications.
The things we found in your website
This document summarizes the services and expertise offered by Acquia, a Drupal consulting firm. It discusses Acquia's Drupal and open source expertise, software industry experience, and the Acquia Network which provides Drupal support and optimized hosting. It also introduces the author and describes services like Drupal jumpstarts, workshops, audits, on-site consulting, and balancing custom and contributed code. The document emphasizes best practices in areas like content and display architecture, security, performance, infrastructure, maintenance, and deployment to help clients maintain a high-quality Drupal site.
Single Page Applications - Desert Code Camp 2012
Slides from my presentation on Single-Page Applications at Desert Code Camp 2012.
The event was held on November 17th, 2012 at Chandler-Gilbert Community College.
http://nov2012.desertcodecamp.com/session/565
Going Mobile with HTML5
The document provides an overview of using HTML5 for mobile mapping applications. It discusses the history and rise of HTML5, how it enables web applications to work across browsers, and its support for mobile functionality. It also covers various HTML5 mapping APIs, using geolocation, common data formats, tile maps and projections, and considerations for designing mobile user interfaces.
5 Common Mistakes You are Making on your Website
The document discusses common mistakes that are often found during website audits. It covers 5 categories: content architecture, display architecture, site architecture, security, and performance. Some examples of mistakes mentioned include having similar content types, not reusing fields, extra modules installed that are not useful, reinventing functionality that Drupal already provides well, outdated core/contrib modules, and complex queries without indexes. The document provides best practices for each category such as planning content architecture ahead of time, separating logic from presentation, using the right hooks for custom modules, keeping software updated, and optimizing databases before caching. It emphasizes the importance of testing, environments, and maintenance for the website lifecycle.
Similar to Wheel.js (20)
Wintellect - Devscovery - Enterprise JavaScript Development 2 of 2
Wintellect - Devscovery - Enterprise JavaScript Development 2 of 2
jQuery - the world's most popular java script library comes to XPages
jQuery - the world's most popular java script library comes to XPages
Vlad Zelinschi - Embrace Native JavaScript (the anti-plugins talk) - Codecamp...
Vlad Zelinschi - Embrace Native JavaScript (the anti-plugins talk) - Codecamp...
Building Mobile Web Apps with jQM and Cordova on Azure
Building Mobile Web Apps with jQM and Cordova on Azure
Sugarcoating your frontend one ViewModel at a time
Sugarcoating your frontend one ViewModel at a time
jQuery: The World's Most Popular JavaScript Library Comes to XPages
jQuery: The World's Most Popular JavaScript Library Comes to XPages
Drupal 7 - The Top 40 Core Modules and What They Mean for You
Drupal 7 - The Top 40 Core Modules and What They Mean for You
Building Enterprise Grade Front-End Applications with JavaScript Frameworks
Building Enterprise Grade Front-End Applications with JavaScript Frameworks
Single Page Application Development with backbone.js and Simple.Web
Single Page Application Development with backbone.js and Simple.Web
More from baccigalupi
What the C?
C has become pretty old school, but the way C developers now and throughout its history have used C, extended C is the foundation of a amazing dynamic languages. This talk describes some dynamic C data structures and also gives an overview of developing a language on top of these tools.
Long Live the Rubyist
Rubyists are abandoning Ruby because of concurrency. Fauxy is a faux object, faux functional language that hopes to solve those concurrency issues.
Going Evergreen, RubyConf 2014
RubyConf 2014 talk about evergreen projects in Ruby. Practices for maintaining projects and building great teams.
Diversity? Why? What? How?
There has been lots of talk about diversity everywhere in tech. Why is this so important? What's all the fuss? And How do we do it?
Why you should build your own JS Frontend Framework
This document advocates that everyone should create their own JavaScript framework. It notes that JavaScript has grown from a simple language into a tool for rendering and logic. As a result, many frameworks and tools have proliferated, making it unclear which path to take. The author then announces their own framework called wheel.js, providing a link for more information.
A cool, clear drink of Ruby object persistence
Introduction to a proof of concept library 'Aqua' that uses CouchDB and other document oriented back ends to transparently persist Ruby objects.
More from baccigalupi (6)
Why you should build your own JS Frontend Framework
Why you should build your own JS Frontend Framework
Recently uploaded
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Monitoring and observability aren’t traditionally found in software curriculums and many of us cobble this knowledge together from whatever vendor or ecosystem we were first introduced to and whatever is a part of your current company’s observability stack.
While the dev and ops silo continues to crumble….many organizations still relegate monitoring & observability as the purview of ops, infra and SRE teams. This is a mistake - achieving a highly observable system requires collaboration up and down the stack.
I, a former op, would like to extend an invitation to all application developers to join the observability party will share these foundational concepts to build on:
20 Comprehensive Checklist of Designing and Developing a Website
Dive into the world of Website Designing and Developing with Pixlogix! Looking to create a stunning online presence? Look no further! Our comprehensive checklist covers everything you need to know to craft a website that stands out. From user-friendly design to seamless functionality, we've got you covered. Don't miss out on this invaluable resource! Check out our checklist now at Pixlogix and start your journey towards a captivating online presence today.
Microsoft - Power Platform_G.Aspiotis.pdf
Revolutionizing Application Development
with AI-powered low-code, presentation by George Aspiotis, Sr. Partner Development Manager, Microsoft
20240605 QFM017 Machine Intelligence Reading List May 2024
Everything I found interesting about machines behaving intelligently during May 2024
Full-RAG: A modern architecture for hyper-personalization
Mike Del Balso, CEO & Co-Founder at Tecton, presents "Full RAG," a novel approach to AI recommendation systems, aiming to push beyond the limitations of traditional models through a deep integration of contextual insights and real-time data, leveraging the Retrieval-Augmented Generation architecture. This talk will outline Full RAG's potential to significantly enhance personalization, address engineering challenges such as data management and model training, and introduce data enrichment with reranking as a key solution. Attendees will gain crucial insights into the importance of hyperpersonalization in AI, the capabilities of Full RAG for advanced personalization, and strategies for managing complex data integrations for deploying cutting-edge AI solutions.
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
In this session I delve into the encryption technology used in Microsoft 365 and Microsoft Purview. Including the concepts of Customer Key and Double Key Encryption.
Goodbye Windows 11: Make Way for Nitrux Linux 3.5.0!
As the digital landscape continually evolves, operating systems play a critical role in shaping user experiences and productivity. The launch of Nitrux Linux 3.5.0 marks a significant milestone, offering a robust alternative to traditional systems such as Windows 11. This article delves into the essence of Nitrux Linux 3.5.0, exploring its unique features, advantages, and how it stands as a compelling choice for both casual users and tech enthusiasts.
Climate Impact of Software Testing at Nordic Testing Days
My slides at Nordic Testing Days 6.6.2024
Climate impact / sustainability of software testing discussed on the talk. ICT and testing must carry their part of global responsibility to help with the climat warming. We can minimize the carbon footprint but we can also have a carbon handprint, a positive impact on the climate. Quality characteristics can be added with sustainability, and then measured continuously. Test environments can be used less, and in smaller scale and on demand. Test techniques can be used in optimizing or minimizing number of tests. Test automation can be used to speed up testing.
Pushing the limits of ePRTC: 100ns holdover for 100 days
At WSTS 2024, Alon Stern explored the topic of parametric holdover and explained how recent research findings can be implemented in real-world PNT networks to achieve 100 nanoseconds of accuracy for up to 100 days.
GraphSummit Singapore | Enhancing Changi Airport Group's Passenger Experience...
Dr. Sean Tan, Head of Data Science, Changi Airport Group
Discover how Changi Airport Group (CAG) leverages graph technologies and generative AI to revolutionize their search capabilities. This session delves into the unique search needs of CAG’s diverse passengers and customers, showcasing how graph data structures enhance the accuracy and relevance of AI-generated search results, mitigating the risk of “hallucinations” and improving the overall customer journey.
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
ABSTRACT: A prima vista, un mattoncino Lego e la backdoor XZ potrebbero avere in comune il fatto di essere entrambi blocchi di costruzione, o dipendenze di progetti creativi e software. La realtà è che un mattoncino Lego e il caso della backdoor XZ hanno molto di più di tutto ciò in comune.
Partecipate alla presentazione per immergervi in una storia di interoperabilità, standard e formati aperti, per poi discutere del ruolo importante che i contributori hanno in una comunità open source sostenibile.
BIO: Sostenitrice del software libero e dei formati standard e aperti. È stata un membro attivo dei progetti Fedora e openSUSE e ha co-fondato l'Associazione LibreItalia dove è stata coinvolta in diversi eventi, migrazioni e formazione relativi a LibreOffice. In precedenza ha lavorato a migrazioni e corsi di formazione su LibreOffice per diverse amministrazioni pubbliche e privati. Da gennaio 2020 lavora in SUSE come Software Release Engineer per Uyuni e SUSE Manager e quando non segue la sua passione per i computer e per Geeko coltiva la sua curiosità per l'astronomia (da cui deriva il suo nickname deneb_alpha).
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Discover the seamless integration of RPA (Robotic Process Automation), COMPOSER, and APM with AWS IDP enhanced with Slack notifications. Explore how these technologies converge to streamline workflows, optimize performance, and ensure secure access, all while leveraging the power of AWS IDP and real-time communication via Slack notifications.
Mind map of terminologies used in context of Generative AI
Mind map of common terms used in context of Generative AI.
Introducing Milvus Lite: Easy-to-Install, Easy-to-Use vector database for you...
Join us to introduce Milvus Lite, a vector database that can run on notebooks and laptops, share the same API with Milvus, and integrate with every popular GenAI framework. This webinar is perfect for developers seeking easy-to-use, well-integrated vector databases for their GenAI apps.
20240607 QFM018 Elixir Reading List May 2024
Everything I found interesting about the Elixir programming ecosystem in May 2024
Presentation of the OECD Artificial Intelligence Review of Germany
Consult the full report at https://www.oecd.org/digital/oecd-artificial-intelligence-review-of-germany-609808d6-en.htm
Communications Mining Series - Zero to Hero - Session 1
This session provides introduction to UiPath Communication Mining, importance and platform overview. You will acquire a good understand of the phases in Communication Mining as we go over the platform with you. Topics covered:
• Communication Mining Overview
• Why is it important?
• How can it help today’s business and the benefits
• Phases in Communication Mining
• Demo on Platform overview
• Q/A
Building RAG with self-deployed Milvus vector database and Snowpark Container...
This talk will give hands-on advice on building RAG applications with an open-source Milvus database deployed as a docker container. We will also introduce the integration of Milvus with Snowpark Container Services.
Recently uploaded (20)
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
20 Comprehensive Checklist of Designing and Developing a Website
20 Comprehensive Checklist of Designing and Developing a Website
20240605 QFM017 Machine Intelligence Reading List May 2024
20240605 QFM017 Machine Intelligence Reading List May 2024
Full-RAG: A modern architecture for hyper-personalization
Full-RAG: A modern architecture for hyper-personalization
Monitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR Events
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Goodbye Windows 11: Make Way for Nitrux Linux 3.5.0!
Goodbye Windows 11: Make Way for Nitrux Linux 3.5.0!
Climate Impact of Software Testing at Nordic Testing Days
Climate Impact of Software Testing at Nordic Testing Days
Pushing the limits of ePRTC: 100ns holdover for 100 days
Pushing the limits of ePRTC: 100ns holdover for 100 days
GraphSummit Singapore | Enhancing Changi Airport Group's Passenger Experience...
GraphSummit Singapore | Enhancing Changi Airport Group's Passenger Experience...
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Mind map of terminologies used in context of Generative AI
Mind map of terminologies used in context of Generative AI
Introducing Milvus Lite: Easy-to-Install, Easy-to-Use vector database for you...
Introducing Milvus Lite: Easy-to-Install, Easy-to-Use vector database for you...
Presentation of the OECD Artificial Intelligence Review of Germany
Presentation of the OECD Artificial Intelligence Review of Germany
Communications Mining Series - Zero to Hero - Session 1
Communications Mining Series - Zero to Hero - Session 1
Building RAG with self-deployed Milvus vector database and Snowpark Container...
Building RAG with self-deployed Milvus vector database and Snowpark Container...
Wheel.js
- 1. Wheel.js Why everyone should make their own JavaScript framework, now
- 2. “I tend to liken JavaScript to water”
- 3. “… alone it's painfully simple but it can take the form of its container”
- 4. - John Resig author of jQuery
- 5. jQuery
- 7. jQuery + Plugins + a little app code
- 8. Then js grew up • Rendering • Logic
- 9. :(
- 11. Tools Proliferate • jQuery UI • JavaScriptMVC • Backbone • AngularJS • Sammy.js • Ext.js • Ember.js • Agility.js • Spine.js • KnockoutJS • Underscore • Knockback.js • Can.js • …
- 12. What’s the clear path?
- 13. But wait … there is more < 2007 :)
- 14. > 2007 :(
- 15. And I want things Form widgets Dialogs Menus etc …
- 16. Wish List • Platform for big or small js • Cross-device & Cross-browser compatibility • Install and code, sensible default app • Ability to customize what I don’t like • Library add-ons
- 17. Wheel.js I am trying to build my wishlist. You should too!
- 21. Subclassing
- 22. Got _super?
- 23. Keep it dry with modules
- 24. Why is OO important?
- 25. Why is OO important? Because customizing this means copy/paste
- 26. Wheel is View-centric! (and flexible) Views can … • be attached to existing browser DOM • be built with a string • received via ajax • hand-built • generate own DOM from a template
- 27. Gathering Views from DOM Given HTML in the browser
- 28. Gathering Views from DOM A simple view class for todo tasks
- 29. View Anatomy
- 30. Switching to DOM Generation
- 31. View Niceties Superclass initialization automatically – Finds/generates DOM – Provides a handy this.$ for DOM manipulation – Calls ‘listen’ after subclass ‘init’ block is called – Sets options passed in as instance variables – Automatically appends to parent, when parent option provided
- 33. Ajax Mixin • ‘data’ method to specify what will be sent to the server • ‘onComplete’, ‘onSuccess’, ‘onError’ methods • prototype/instance can set the http method • Module converts ‘put’ and ‘delete’ to ‘post’ with _method attribute • Needs a ‘url’ attribute
- 34. Ajaxing For the Mobile Era • Request queue instead of direct requests • Queue stored in LocalStorage or polyfill • Application tracks connectivity • Sends requests and executes callbacks as possible
- 35. More Mobile • Touch/Gesture events • Event Unification • Drag/Drop Conventions • Dynamic application loader (bandwidth) • ??
- 36. ++ Helpers Widgets • Poller • Tabs • Cookie Manager • Dialog • Models • Searcher • Router/History • Autocomplete Rails • Form Stuff • Generators • Tooltips • Better deps • Time ago helper manager??