April 26, 2017 | Comments Read this e-mail on the WebFrontEnd Focus Issue 287 — April 26, 2017 WebExtensions 101: How to Create a Modern Browser ExtensionNo C needed, you can now easily build browser extensions using standard Web technologies. Benjamin YoungGetting Started with CSS Grid LayoutWe’ve brought together the best/most useful resources and tutorials from recent weeks. Chris BrandrickWhat’s All That Stuff At The Top of a CSS Spec?The first in a series of posts breaking down the Grid spec. The CSS Working Group called this “How to Read the First Page of Just About Any CSS Specification” Rachel AndrewFull-day Workshop: Using ES6 and React with Netflix’s Brian HoltNetflix’s Brian Holt returns to teach a full-day workshop on ES6 and React. React eschews the traditional MVC architecture, a counter-intuitive approach Brian explains along with JSX, React best practices, and the React component lifecycle. Forward Courses SponsorWhy CSS Custom Properties Will Prove Very HandyCSS Custom Properties give the ability to reach into a property value and change certain parts of it. This quick example should win you over. Chris Coyier5 Image Lazy Loading Techniques to Improve PerformanceMaria Antonietta Perna highlights the benefits of lazy loading images on websites and shows five approaches to implement it. SitePointAdvanced Vertical MarginsHow the adjacent sibling selector can solve complex design requirements while maintaining readable CSS. Sebastian Eberlein13 Terrible Web Trends From The 90s, and How to Recreate ThemA fun look back at a time when the Web’s aesthetic was a little more.. ‘rough and ready’. Remember the dancing baby? Dom HennequinThink You Know The Top Web Browsers?Our traditional idea of the top five browsers may be over-simplified, outdated and skewed. Peter O’ShaughnessyStart Using CSS Grid Layouts TodayRachel Andrew covers the basics of how to use CSS Grid and how to start using it right now – without leaving older browsers out in the cold. 28 minutes. RenderConfJobs Senior Front-end Engineer, BitbucketWant to build the future of code collaboration? Join Atlassian, work on Bitbucket, our source code collaboration and hosting product. Atlassian Senior Front-end EngineerWe’re looking for an enthusiastic front end engineer to join our team. 3 blocks from the beach. Go to our website to learn more. MJD Interactive Full Stack Engineer – Hello Alfred (Alfred HQ/New York)We’re seeking a Senior Full Stack Engineer with 3 years experience to join our team and help develop our engineering philosophy. Hello AlfredCan’t find the right job? Want companies to apply to you? Try Hired.com.In BriefChrome Headless Now Supported on All Versions of Chrome 59+ newsHow To Secure Your Web App With HTTP Headers tutorialSmashing MagazineLet’s Define Exactly What ‘Atomic CSS’ Is tutorialJohn PolacekOpen vs. Closed Shadow DOM tutorial The difference between using the open and closed modes of Shadow DOM.Leon Revilltouch-action: A CSS Property for Customizing Touch Interactivity tutorialHui Jing ChenLetting The Content Delivery Network Optimize Your Images tutorialJon Arne SæteråsA Journey to Effective, Maintainable CSS Media Queries tutorialKaloyan KosevCreate data-intensive, feature-rich web & mobile apps with Sencha Ext JS Learn how to design, develop and test data-intensive web apps that run on desktops, tablets, and smartphones.Sencha, Inc. SponsorThe Origin of the ‘IMG’ Tag storyJay HoffmanWhen Does a Project Need React? opinionCSS TricksSix Free Web-Based SVG Editors Compared toolsSitePointSuperTinySocialIcons: Miniscule SVG Versions of Common Logos toolsTerence Eden$20 Free Credit on a new account. Linux cloud hosting starting at 1GB of RAM for $5/mo. Use promo code HTML520 and get $20 credit.linode SponsorExplodal: A Modal With An Explosion Effect codeOpenLara: Classic Tomb Raider Running in the Browser demoCurated by Peter Cooper and Chris Brandrick and published by Cooperpress.Stop getting FrontEnd Focus : Change email address : Read this issue on the WebCooper Press Ltd. Office 30, Lincoln Way, Louth, LN11 0LS, UK Source link