ClientSide Web Technologies Introduction Source http gs statcounter
Client-Side Web Technologies Introduction
Source: http: //gs. statcounter. com/platform-market-share/desktop-mobile-tablet/united-states-of-america/#monthly-201412 -201612
Source: http: //gs. statcounter. com/browser-market-share/desktop-mobile-tablet/united-states-of-america/#monthly-201412 -201612
Are these statistics accurate? http: //gs. statcounter. com/faq#methodology Are they useful?
• When creating web applications: • Know who will be using it (what types of users? ) • Know how they will be using it (desktop, tablet, mobile, all of these? ) • Exercise concepts of progressive enhancement when appropriate • http: //alistapart. com/article/understandingprogressiveenhancement • Exercise concepts of responsive web design when appropriate • http: //alistapart. com/article/responsive-web-design • https: //developers. google. com/web/fundamentals/design-and-ui/responsive/
The Modern Front-End Landscape Pre-Processors/Compilers Package Module Management Managers Test Frameworks Core Java. Script Frameworks Technologies Libraries Frameworks CSS Task Pre-Processors/Extensions Automaters • • • Angular. JS Type. Script NPM Require. JS Jasmine (Node Package Manager) HTML j. Query Bootstrap less Grunt React Coffee. Script Browserify Mocha CSS Underscore Foundation Sass Gulp Backbone. js Bower Babel Java. Script • etc…
This Course Covers Task Automaters CSS Frameworks CSS Pre-Processors/ Extensions Java. Script Frameworks Module Management Package Managers Core Technologies Java. Script Test Frameworks Libraries Java. Script Pre-Processors/Compilers
Very Useful Web Resources • http: //caniuse. com/ • Detailed information on browser support for HTML 5, CSS 3, and Java. Script features • http: //www. w 3. org/ • Website of the World Wide Web Consortium • https: //developer. mozilla. org/en-US/ • Mozilla Developer Network • https: //developers. google. com/web/ • Google Web Developers
Essential Development Tools • For Firefox: • Developer tools are built-in: https: //developer. mozilla. org/en-US/docs/Tools • For Chrome: • Dev. Tools are built-in https: //developers. google. com/chrome-developer-tools/
- Slides: 9