{"id":257,"date":"2019-09-02T14:46:18","date_gmt":"2019-09-02T12:46:18","guid":{"rendered":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/"},"modified":"2020-06-18T07:16:56","modified_gmt":"2020-06-18T07:16:56","slug":"fredriks-front-end-quick-read-2","status":"publish","type":"post","link":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/","title":{"rendered":"Fredrik\u2019s front-end quick read #2"},"content":{"rendered":"<figure><img decoding=\"async\" data-width=\"1920\" data-height=\"1080\" src=\"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/ebb18-1l3rf2ytsvsy3bgartd3j1a.jpeg\"><\/figure>\n<p><strong>Content:<\/strong><\/p>\n<ul>\n<li>What Happens When You Launch A Browser for The First Time?<\/li>\n<li>All the New ES2019 Tips and Tricks<\/li>\n<li>Native lazy-loading for the web<\/li>\n<li>Microsoft Web Template Studio<\/li>\n<li>Version Museum: A Visual History of Your Favorite Technology<\/li>\n<\/ul>\n<hr>\n<h3><strong>1. What Happens When You Launch A Browser for The First&nbsp;Time?<\/strong><\/h3>\n<p><a href=\"https:\/\/frontendfoc.us\/link\/68998\/6ab331ce8a\">https:\/\/frontendfoc.us\/link\/68998\/6ab331ce8a<\/a><\/p>\n<p>This is a collection of interesting and quite revealing Twitter threads digging into what browsers (Chrome, Firefox, Opera, etc) do upon install\/first launch (including phoning home and downloading default extensions).<\/p>\n<h3>2. All the New ES2019 Tips and&nbsp;Tricks<\/h3>\n<blockquote class=\"wp-embedded-content\" data-secret=\"ELUHmyHBkF\"><p><a href=\"https:\/\/css-tricks.com\/all-the-new-es2019-tips-and-tricks\/\">All the New ES2019 Tips and Tricks<\/a><\/p><\/blockquote>\n<p><iframe loading=\"lazy\" class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; clip: rect(1px, 1px, 1px, 1px);\" title=\"&#8220;All the New ES2019 Tips and Tricks&#8221; &#8212; CSS-Tricks\" src=\"https:\/\/css-tricks.com\/all-the-new-es2019-tips-and-tricks\/embed\/#?secret=ELUHmyHBkF\" data-secret=\"ELUHmyHBkF\" width=\"600\" height=\"338\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe><\/p>\n<p>In June, <a href=\"https:\/\/link.medium.com\/2rlQtsI0BZ\" target=\"_blank\" rel=\"noopener noreferrer\">ES2019 (Edition 10)<\/a> was released and of course it has been followed by a long line of articles about the new features. Among the new features you\u2019ll find ? like Array.flat\/flatmap into which you can specify depth, Object.fromEntries, sort stability and more. For an even more in-depth read about Javascript anno 2019 <a href=\"https:\/\/itnext.io\/whats-new-in-javascript-google-i-o-2019-summary-d16bd2308412\" target=\"_blank\" rel=\"noopener noreferrer\">read this<\/a>.<\/p>\n<p>Personally I\u2019m really looking forward to <strong>private class fields <\/strong>(Not in ES2019 ?)Finally, the ability to hide implementation details for real! ?<\/p>\n<p>It\u2019s currently in <a href=\"https:\/\/exploringjs.com\/es2016-es2017\/ch_tc39-process.html\" target=\"_blank\" rel=\"noopener noreferrer\">stage-3<\/a> (fingers crossed it makes it into ES2020). However, they didn\u2019t follow the cross-language untold \u201cstandard\u201d and called it <em>private<\/em>, instead they go with hash (#) symbol\u2026?! But still <em>private<\/em> with # is better than not having <em>private<\/em> at all\u2026 but nothing yet about <em>protected?<\/em> ?<\/p>\n<h3>3. Native lazy-loading for the&nbsp;web<\/h3>\n<blockquote class=\"wp-embedded-content\" data-secret=\"ELUHmyHBkF\"><p><a href=\"https:\/\/css-tricks.com\/all-the-new-es2019-tips-and-tricks\/\">All the New ES2019 Tips and Tricks<\/a><\/p><\/blockquote>\n<p><iframe loading=\"lazy\" class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; clip: rect(1px, 1px, 1px, 1px);\" title=\"&#8220;All the New ES2019 Tips and Tricks&#8221; &#8212; CSS-Tricks\" src=\"https:\/\/css-tricks.com\/all-the-new-es2019-tips-and-tricks\/embed\/#?secret=ELUHmyHBkF\" data-secret=\"ELUHmyHBkF\" width=\"600\" height=\"338\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe><\/p>\n<p>Starting with Chrome 76 (released July 30), you\u2019ll be able to use the new <em>loading<\/em> attribute to lazy-load resources without the need to write custom lazy-loading code or use a separate JavaScript library ? These guys explain how.<\/p>\n<h3><strong>4. Microsoft Web Template&nbsp;Studio<\/strong><\/h3>\n<blockquote class=\"wp-embedded-content\" data-secret=\"ELUHmyHBkF\"><p><a href=\"https:\/\/css-tricks.com\/all-the-new-es2019-tips-and-tricks\/\">All the New ES2019 Tips and Tricks<\/a><\/p><\/blockquote>\n<p><iframe loading=\"lazy\" class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; clip: rect(1px, 1px, 1px, 1px);\" title=\"&#8220;All the New ES2019 Tips and Tricks&#8221; &#8212; CSS-Tricks\" src=\"https:\/\/css-tricks.com\/all-the-new-es2019-tips-and-tricks\/embed\/#?secret=ELUHmyHBkF\" data-secret=\"ELUHmyHBkF\" width=\"600\" height=\"338\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe><\/p>\n<p>This is a nice addition to <a href=\"https:\/\/link.medium.com\/LcUmCMedGZ\" target=\"_blank\" rel=\"noopener noreferrer\">last week\u2019s entry<\/a> about Visual Studio Code Extensions! WebTS currently support <a href=\"https:\/\/reactjs.org\/\" target=\"_blank\" rel=\"noopener noreferrer\">React.js<\/a>&nbsp;, <a href=\"https:\/\/vuejs.org\/\" target=\"_blank\" rel=\"noopener noreferrer\">Vue.js<\/a>, <a href=\"https:\/\/angular.io\/\" target=\"_blank\" rel=\"noopener noreferrer\">Angular<\/a> for front-end and <a href=\"https:\/\/nodejs.org\/en\/\" target=\"_blank\" rel=\"noopener noreferrer\">Node.js<\/a> and Flask for back-end.<\/p>\n<p>I tested the combo React\/Node.js. The React front-end is utilizing react-scripts (from create-react-app), react-router-dom, and Bootstrap as default. The Node\/Express back-end has a pretty straight-forward express-server configured for SPA (Single-Page-Applications). It\u2019s a good starting point for your application.<\/p>\n<p>I\u2019m looking forward to see what more options they add in the future\u2026<\/p>\n<h3>5. Version Museum: A Visual History of Your Favorite Technology<\/h3>\n<blockquote class=\"wp-embedded-content\" data-secret=\"ELUHmyHBkF\"><p><a href=\"https:\/\/css-tricks.com\/all-the-new-es2019-tips-and-tricks\/\">All the New ES2019 Tips and Tricks<\/a><\/p><\/blockquote>\n<p><iframe loading=\"lazy\" class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; clip: rect(1px, 1px, 1px, 1px);\" title=\"&#8220;All the New ES2019 Tips and Tricks&#8221; &#8212; CSS-Tricks\" src=\"https:\/\/css-tricks.com\/all-the-new-es2019-tips-and-tricks\/embed\/#?secret=ELUHmyHBkF\" data-secret=\"ELUHmyHBkF\" width=\"600\" height=\"338\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe><\/p>\n<p>Sure, I like the minimalistic style where everything is flat (or flat-ish) with big imagery and nice clean icon-sets. But when all websites starts to look like that it makes me miss all the different kinds of glossy buttons, image maps and animated gifs a\u2019la Y2K. Not because they are super-aesthetically pleasing (they were cool ?) but for the diversity it brought among websites.<\/p>\n<hr>\n<figure><img decoding=\"async\" data-width=\"640\" data-height=\"800\" src=\"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/f8b2f-1dpomikqd2ryqfsmsmxv00q402x.jpeg\"><\/figure>\n<p>Thanks for reading and happy coding! \u2764\ufe0f<\/p>\n<p><em>\/Fredrik, Senior Front-end developer @ Bouvet and co-creator of Sketch2React<\/em><\/p>\n<blockquote class=\"wp-embedded-content\" data-secret=\"ELUHmyHBkF\"><p><a href=\"https:\/\/css-tricks.com\/all-the-new-es2019-tips-and-tricks\/\">All the New ES2019 Tips and Tricks<\/a><\/p><\/blockquote>\n<p><iframe loading=\"lazy\" class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; clip: rect(1px, 1px, 1px, 1px);\" title=\"&#8220;All the New ES2019 Tips and Tricks&#8221; &#8212; CSS-Tricks\" src=\"https:\/\/css-tricks.com\/all-the-new-es2019-tips-and-tricks\/embed\/#?secret=ELUHmyHBkF\" data-secret=\"ELUHmyHBkF\" width=\"600\" height=\"338\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe><\/p>\n<p><em>Psst, I also highly recommend Juan\u2019s Design Digest (He\u2019s the other 50% of Sketch2React)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Content: What Happens When You Launch A Browser for The First Time? All the New ES2019 Tips and Tricks Native lazy-loading for the web Microsoft Web Template Studio Version Museum: A Visual History of Your Favorite Technology 1. What Happens When You Launch A Browser for The First&nbsp;Time? https:\/\/frontendfoc.us\/link\/68998\/6ab331ce8a This is a collection of interesting&hellip;&nbsp;<a href=\"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/\" class=\"\" rel=\"bookmark\">Read More &raquo;<span class=\"screen-reader-text\">Fredrik\u2019s front-end quick read #2<\/span><\/a><\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"bgseo_title":"","bgseo_description":"","bgseo_robots_index":"","bgseo_robots_follow":"","neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","footnotes":""},"categories":[167],"tags":[158,159,61],"class_list":["post-257","post","type-post","status-publish","format-standard","hentry","category-fredriks-front-end-quick-read","tag-bouvet","tag-front-end-development","tag-javascript"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.7 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Fredrik\u2019s front-end quick read #2 | Sketch2React Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Fredrik\u2019s front-end quick read #2 - Sketch2React Blog\" \/>\n<meta property=\"og:description\" content=\"Content: What Happens When You Launch A Browser for The First Time? All the New ES2019 Tips and Tricks Native lazy-loading for the web Microsoft Web Template Studio Version Museum: A Visual History of Your Favorite Technology 1. What Happens When You Launch A Browser for The First&nbsp;Time? https:\/\/frontendfoc.us\/link\/68998\/6ab331ce8a This is a collection of interesting&hellip;&nbsp;Read More &raquo;Fredrik\u2019s front-end quick read #2\" \/>\n<meta property=\"og:url\" content=\"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/\" \/>\n<meta property=\"og:site_name\" content=\"Sketch2React Blog\" \/>\n<meta property=\"article:published_time\" content=\"2019-09-02T12:46:18+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-06-18T07:16:56+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/ebb18-1l3rf2ytsvsy3bgartd3j1a.jpeg\" \/>\n<meta name=\"author\" content=\"Fredrik Ward\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Fredrik Ward\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/\"},\"author\":{\"name\":\"Fredrik Ward\",\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/#\\\/schema\\\/person\\\/d452067d5528ce6cda4be87f136cf664\"},\"headline\":\"Fredrik\u2019s front-end quick read #2\",\"datePublished\":\"2019-09-02T12:46:18+00:00\",\"dateModified\":\"2020-06-18T07:16:56+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/\"},\"wordCount\":504,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/#primaryimage\"},\"thumbnailUrl\":\"http:\\\/\\\/sketch2react.files.wordpress.com\\\/2019\\\/09\\\/ebb18-1l3rf2ytsvsy3bgartd3j1a.jpeg\",\"keywords\":[\"Bouvet\",\"Front End Development\",\"JavaScript\"],\"articleSection\":[\"Fredrik's Front-end Quick Read\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/\",\"url\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/\",\"name\":\"Fredrik\u2019s front-end quick read #2 - Sketch2React Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/#primaryimage\"},\"thumbnailUrl\":\"http:\\\/\\\/sketch2react.files.wordpress.com\\\/2019\\\/09\\\/ebb18-1l3rf2ytsvsy3bgartd3j1a.jpeg\",\"datePublished\":\"2019-09-02T12:46:18+00:00\",\"dateModified\":\"2020-06-18T07:16:56+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/#primaryimage\",\"url\":\"http:\\\/\\\/sketch2react.files.wordpress.com\\\/2019\\\/09\\\/ebb18-1l3rf2ytsvsy3bgartd3j1a.jpeg\",\"contentUrl\":\"http:\\\/\\\/sketch2react.files.wordpress.com\\\/2019\\\/09\\\/ebb18-1l3rf2ytsvsy3bgartd3j1a.jpeg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/fredriks-front-end-quick-read-2\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Fredrik\u2019s front-end quick read #2\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/\",\"name\":\"Sketch2React Blog\",\"description\":\"Articles, tutorials, tips &amp; tricks\",\"publisher\":{\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/#organization\",\"name\":\"Sketch2React Blog\",\"url\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/wp-content\\\/uploads\\\/2021\\\/10\\\/cropped-S2R2021Icon.png\",\"contentUrl\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/wp-content\\\/uploads\\\/2021\\\/10\\\/cropped-S2R2021Icon.png\",\"width\":512,\"height\":512,\"caption\":\"Sketch2React Blog\"},\"image\":{\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/#\\\/schema\\\/person\\\/d452067d5528ce6cda4be87f136cf664\",\"name\":\"Fredrik Ward\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/91605aba05531b0d98ed254dc314b74be1800d1086302db1454b4489c128e3e1?s=96&d=wavatar&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/91605aba05531b0d98ed254dc314b74be1800d1086302db1454b4489c128e3e1?s=96&d=wavatar&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/91605aba05531b0d98ed254dc314b74be1800d1086302db1454b4489c128e3e1?s=96&d=wavatar&r=g\",\"caption\":\"Fredrik Ward\"},\"url\":\"https:\\\/\\\/sketch2react.io\\\/blog\\\/author\\\/sewk9wxw3g\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Fredrik\u2019s front-end quick read #2 | Sketch2React Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/","og_locale":"en_US","og_type":"article","og_title":"Fredrik\u2019s front-end quick read #2 - Sketch2React Blog","og_description":"Content: What Happens When You Launch A Browser for The First Time? All the New ES2019 Tips and Tricks Native lazy-loading for the web Microsoft Web Template Studio Version Museum: A Visual History of Your Favorite Technology 1. What Happens When You Launch A Browser for The First&nbsp;Time? https:\/\/frontendfoc.us\/link\/68998\/6ab331ce8a This is a collection of interesting&hellip;&nbsp;Read More &raquo;Fredrik\u2019s front-end quick read #2","og_url":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/","og_site_name":"Sketch2React Blog","article_published_time":"2019-09-02T12:46:18+00:00","article_modified_time":"2020-06-18T07:16:56+00:00","og_image":[{"url":"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/ebb18-1l3rf2ytsvsy3bgartd3j1a.jpeg","type":"","width":"","height":""}],"author":"Fredrik Ward","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Fredrik Ward","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/#article","isPartOf":{"@id":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/"},"author":{"name":"Fredrik Ward","@id":"https:\/\/sketch2react.io\/blog\/#\/schema\/person\/d452067d5528ce6cda4be87f136cf664"},"headline":"Fredrik\u2019s front-end quick read #2","datePublished":"2019-09-02T12:46:18+00:00","dateModified":"2020-06-18T07:16:56+00:00","mainEntityOfPage":{"@id":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/"},"wordCount":504,"commentCount":0,"publisher":{"@id":"https:\/\/sketch2react.io\/blog\/#organization"},"image":{"@id":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/#primaryimage"},"thumbnailUrl":"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/ebb18-1l3rf2ytsvsy3bgartd3j1a.jpeg","keywords":["Bouvet","Front End Development","JavaScript"],"articleSection":["Fredrik's Front-end Quick Read"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/","url":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/","name":"Fredrik\u2019s front-end quick read #2 - Sketch2React Blog","isPartOf":{"@id":"https:\/\/sketch2react.io\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/#primaryimage"},"image":{"@id":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/#primaryimage"},"thumbnailUrl":"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/ebb18-1l3rf2ytsvsy3bgartd3j1a.jpeg","datePublished":"2019-09-02T12:46:18+00:00","dateModified":"2020-06-18T07:16:56+00:00","breadcrumb":{"@id":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/#primaryimage","url":"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/ebb18-1l3rf2ytsvsy3bgartd3j1a.jpeg","contentUrl":"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/ebb18-1l3rf2ytsvsy3bgartd3j1a.jpeg"},{"@type":"BreadcrumbList","@id":"https:\/\/sketch2react.io\/blog\/fredriks-front-end-quick-read-2\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/sketch2react.io\/blog\/"},{"@type":"ListItem","position":2,"name":"Fredrik\u2019s front-end quick read #2"}]},{"@type":"WebSite","@id":"https:\/\/sketch2react.io\/blog\/#website","url":"https:\/\/sketch2react.io\/blog\/","name":"Sketch2React Blog","description":"Articles, tutorials, tips &amp; tricks","publisher":{"@id":"https:\/\/sketch2react.io\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/sketch2react.io\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/sketch2react.io\/blog\/#organization","name":"Sketch2React Blog","url":"https:\/\/sketch2react.io\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/sketch2react.io\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/sketch2react.io\/blog\/wp-content\/uploads\/2021\/10\/cropped-S2R2021Icon.png","contentUrl":"https:\/\/sketch2react.io\/blog\/wp-content\/uploads\/2021\/10\/cropped-S2R2021Icon.png","width":512,"height":512,"caption":"Sketch2React Blog"},"image":{"@id":"https:\/\/sketch2react.io\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/sketch2react.io\/blog\/#\/schema\/person\/d452067d5528ce6cda4be87f136cf664","name":"Fredrik Ward","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/91605aba05531b0d98ed254dc314b74be1800d1086302db1454b4489c128e3e1?s=96&d=wavatar&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/91605aba05531b0d98ed254dc314b74be1800d1086302db1454b4489c128e3e1?s=96&d=wavatar&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/91605aba05531b0d98ed254dc314b74be1800d1086302db1454b4489c128e3e1?s=96&d=wavatar&r=g","caption":"Fredrik Ward"},"url":"https:\/\/sketch2react.io\/blog\/author\/sewk9wxw3g\/"}]}},"_links":{"self":[{"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/posts\/257","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/comments?post=257"}],"version-history":[{"count":1,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/posts\/257\/revisions"}],"predecessor-version":[{"id":306,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/posts\/257\/revisions\/306"}],"wp:attachment":[{"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/media?parent=257"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/categories?post=257"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/tags?post=257"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}