March 1, 2017 — Read this e-mail on the WebFrontEnd Focus Issue 279 — March 1, 2017 Progressive Web App Libraries in ProductionAddy Osmani looks at tools and libraries Google has released to make building fast, modern webapps a reality, including Offline Google Analytics and sw-precache. Addy OsmaniTim Berners Lee on Encrypted Media Extensions (EME) in HTML5Sir Tim, the original creator of the Web, explains why the W3C should endorse the EME standard which allows web pages to include encrypted content. Tim Berners-LeeWebAssembly Now Complete Enough to Deploy ‘On-By-Default’The W3C WebAssembly Community Group says the design of WebAssembly is complete enough that browsers can ship with it “on by default”. A new official WebAssembly logo has also been unveiled. W3CNew Course: Make back-end developers jealous, with Elm ?Write bullet-proof, easily maintainable web applications with Elm, the functional programming language that is transforming web application development! Frontend Masters SponsorUse CSS’s ‘:not’ to Save Time and Lines of CodeYou can often make your life easier by using :not(:last-of-type) rather than overriding with a separate :last-of-type rule. Tim SmithCSS Exclusions: Making Boring Layouts Less BoringCSS Exclusions may look similar to CSS Shapes in that they can wrap content around an element. Technically, however, they serve a different purpose. Louie RootfieldSeamlessly-Faded Background Images with CSS GradientsA CodePen demo written by Goce Mitevski, which shows how to create seamlessly-faded background images with CSS gradient overlays. Goce MitevskiWeb Content Accessibility Guidelines 2.1: First Public Working DraftThe guidelines cover a wide range of recommendations for making Web content more accessible, particularly to people with disabilities. Joshue O ConnorWebGL 2.0 ArrivesWebGL 2.0 is shipping in Firefox and Chrome browsers and all WebGL implementers have declared intent to support it. Here’s a live demo of WebGL 2 functionality if you have a supporting browser. The Khronos GroupUsing postMessage and WebSocket-reconnect to Steal Auth TokensA technical look at a now-resolved vulnerability where an auth token for Slack could be stolen across browser windows. Frans RosénAn Introduction to the Reduced Motion Media QuerySafari 10.1 introduced the ‘Reduced Motion’ Media Query, a declaration that lets developers “create styles that avoid large areas of motion” for users that prefer that. Eric BaileyJobs Front-End JavaScript Engineer (f/m) – Contentful (Berlin)As our front-end engineer, you’ll work on a modular user interface where API design and application architecture are the main challenges. contentful Senior Front-end Developer, BitbucketWant to build the future of code collaboration? Join us as a Front-end Engineer on Bitbucket, Atlassian’s source code collaboration and hosting product. Atlassian (Bitbucket)Can’t find the right job? Want companies to apply to you? Try Hired.com.In BriefGoogle Discloses a ‘High Severity’ Bug in Edge and IE news An as-yet unresolved vulnerability is now public after a 90 day non-disclosure period.Ars TechnicaRIP DMOZ: The Open Directory Project Is Closing newsDanny SullivanMozilla and BrowserStack Offering Free Firefox on Android Testing newsMozilla Hacks[Whitepaper] The Future of JavaScript—2017 and Beyond 2017 predictions for the key and rising JavaScript libraries and frameworks and JS’s New Frontiers in this whitepaper.Progress SponsorCSS Grid: Design Possibilities Looking at the design implications of CSS Grid.Susan RobertsonThe Unexpected Power of Viewport Units in CSS tutorialThomas LattimoreMaking The Most of the Chrome DevTools: A Few Lesser-Known Features tutorialLogRocketScaling SVG Clipping Paths for CSS Use tutorialEric MeyerHow to Use Flexbox to Create A Modern Card Design Layout tutorialFlywheelMore HTML5 Semantics: Changes to Existing Features tutorialLouis LazarisEmscripten/HTML Integration Tips tutorial “things I learned while adding a HTML UI to my 8-bit emulator”FlooohMargin or Padding? Thoughts On When to Use Which opinionPhilipp SporrerTrack errors in your apps with Sentry Sentry’s open-source error tracking tells you when your code breaks, without the need for bug reports.Sentry SponsorBox Alignment Cheatsheet tools This cheatsheet compares alignment in CSS Grid Layout and Flexbox.Rachel AndrewA Collection of Resources for Learning CSS Grid toolsJen Simmonsstore.js 2.0: Cross-Browser Storage for All Use Cases code 2.0 is a full revamp with pluggable storage and extra functionality.Marcus WestinOmnitone: Spatial Audio on the Web code An implementation of a FOA (first-order-ambisonic) decoder with binaural rendering using the Web Audio API.GoogleRough.js: Create Graphics with a Hand-Drawn, Sketchy Appearance codePropeller: A Responsive Framework Based on Material Design Standards & Bootstrap codeDigicorpCurated by Peter Cooper and published by Cooperpress. If you like this, you may also enjoy: JavaScript Weekly, Node Weekly, and React Status.Stop getting FrontEnd Focus : Change email address : Read this issue on the Web© Cooper Press Ltd. Office 30, Lincoln Way, Louth, LN11 0LS, UK Source link