{"id":252,"date":"2019-09-18T08:41:18","date_gmt":"2019-09-18T06:41:18","guid":{"rendered":"https:\/\/sketch2react.wordpress.com\/2019\/09\/18\/my-2-cents-about-the-web-in-2020\/"},"modified":"2020-06-18T07:42:34","modified_gmt":"2020-06-18T07:42:34","slug":"my-2-cents-about-the-web-in-2020","status":"publish","type":"post","link":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/","title":{"rendered":"My 2 cents about the web in 2020"},"content":{"rendered":"<p>This might someday be based on a true story. No one can predict the future, but if what I write here comes to pass.. then this article is indeed based on a true story and we will all be dead-ish.<\/p>\n<figure class=\"wp-caption\"><img decoding=\"async\" data-width=\"3456\" data-height=\"2897\" src=\"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/5bd35-1qran4wcsoj8ozpplesayeg.jpeg\"><figcaption class=\"wp-caption-text\">Photo by <a href=\"https:\/\/unsplash.com\/@judeussamson?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText\" target=\"_blank\" rel=\"noopener noreferrer\">Judeus Samson<\/a> on&nbsp;<a href=\"https:\/\/unsplash.com\/search\/photos\/futuristic?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText\" target=\"_blank\" rel=\"noopener noreferrer\">Unsplash<\/a><\/figcaption><\/figure>\n<ul>\n<li>Development will move towards modularity, reusability and standardization. Composition of components will be the new black. We\u2019ll see the beginning of the steep rise of web components.<\/li>\n<li>We will see a lot of design systems based on Design-Code-components\u200a\u2014\u200acomponents that are 1:1 code and design.<\/li>\n<li>We fight zombies (those sneaky bastards) and eventually kinda loose\u2026<\/li>\n<\/ul>\n<h3>You\u2019re still reading?&nbsp;Good!<\/h3>\n<p>Design systems, which are ever increasing in popularity, brings to the table the idea of modular, reusable, design assets that are being composed into application UIs.<\/p>\n<p>Modern javascript frameworks\/libraries like e.g. React with its component-based approach is well suited to \u201dtranslate\u201d these design assets into code components.<\/p>\n<p>However, React components doesn\u2019t work well in Ember and Ember components doesn\u2019t play nice with Vue.js and so on and so forth.. soooo we are back to the eternal questions: \u201cWhich framework is the best\u201d, \u201cWhich framework should I learn?\u201d, \u201cWhich framework will last the longest\/become the biggest?\u201d <em>(Don\u2019t mind the zombies)<\/em>. Combine these questions with all the new libraries, code style options and tools that keep spawning at an ever increasing pace. This is why the term \u201cjavascript fatigue\u201d is so common.<\/p>\n<p>What to do? What to do?<\/p>\n<p><strong>Me:<\/strong> Mirror, mirror on the wall, tell me which framework will be the fairest of them all.<\/p>\n<p><strong>Mirror:<\/strong> <em>React will still be the the most popular, but Vue.js will be a closer and closer second. May I suggest a more standardized way?<\/em><\/p>\n<p><strong>Me:<\/strong> How do we create modular, reusable code components that can be used with any framework (or even without a framework) and aligns with the idea of design systems?<\/p>\n<blockquote><p>One standardized way to rule them all and in the ShadowDOM bind&nbsp;them.<\/p><\/blockquote>\n<p><strong>Mirror: <\/strong><em>Web components. They are like universal puzzle-pieces.<\/em><\/p>\n<p><strong>Mirror: <\/strong><em>Web components consists of three main technologies: <\/em>Custom elements<em>, <\/em>Shadow DOM<em> and <\/em>HTML templates<em>. These can be used together to create versatile custom elements with encapsulated functionality that can be reused wherever you like without fear of code collisions. It allows you to create new HTML tags, fine-tune their properties\u200a\u2014\u200afrom the look, to the internal mechanisms and features of working with Shadow DOM.<\/em><\/p>\n<p><em>Since Web components act exactly like built-in HTML elements they should work within any framework. If your framework can render arbitrary HTML elements, then it can render a custom HTML element. If you\u2019re building an app; Just render the HTML that you want in your template language.<\/em><\/p>\n<p><em>The first to adopt the usage of web components will be the library authors because instead of targeting a specific framework; why not target them all at once?!<\/em><\/p>\n<p><strong>Me: <\/strong>But wait a second! What if we could export design assets from Sketch, Figma, Invision or Adobe Xd as a library of web components?! These Design-components will then be 1:1 design-to-code!<\/p>\n<p><strong>Mirror:<\/strong> <em>Yes. The way of creating web applications in 2020 will most likely be to have one of the big frameworks as a backbone (React, Vue.js, Angular, Ember) and have modules and libraries of web components based on e.g. StencilJS or LitElement making up different parts of the UI (I know, I know, I called React a framework).<\/em><\/p>\n<p><em>Even if a company (or project) has invested heavily in one specific framework, it can add new functionality as web components and over time replace bigger and bigger parts of their applications with components built as web components.<\/em><\/p>\n<p><em>Web components will also add re-usability of components among applications build on the micro-front-ends architecture. Applications who\u2019s architecture is based on many smaller teams creating individual parts of the application, each using their own toolsets and frameworks.<\/em><\/p>\n<p><em>It\u2019s a lot of controversy around web components. Just have a look at <\/em><a href=\"https:\/\/dev.to\/richharris\/why-i-don-t-use-web-components-2cia\" target=\"_blank\" rel=\"noopener noreferrer\"><em>this article<\/em><\/a><em> (especially the comments-section). You probably shouldn\u2019t build a complete framework based on web components just yet.<\/em><\/p>\n<p><strong>Me:<\/strong> *Mind-blown*<\/p>\n<hr>\n<p>There is a lot of talk going on about design system and ultimately where to keep the \u201cSingle-Source-Of-Truth\u201d of the design. Should it be in the design tool or in the code base, or somewhere else completely like design-tokens in a cloud-hosted database imported from application X and then consumed by both design tools and apps?<\/p>\n<p>To achieve a complete two-way sync between design and code, the design-tool must be build on an architecture that, from the start, supports two-way sync. It\u2019s going to be really hard (maybe even impossible?) to implement it into an already existing application like Sketch.<\/p>\n<p>At the time of writing the only design-tool with properly integrated two-way sync design-to-code is Framer X.<\/p>\n<p>We are seeing more and more design-to-code third party applications such as Sketch2React, Anima App and Haiku Animator (to a certain extent). However, these applications are only \u201done-way\u201d.<\/p>\n<p>Different companies will choose different design-flow directions. Some will use Framer X, others will use Design-to-code (e.g. Sketch2React) while others will use Code-to-design (e.g. Airbnb).<\/p>\n<p>Just make sure that it leads to closer collaboration between designers and developers and mutual respect for each others crafts. This will lead to a much needed hand-over optimization and a lot less friction between developers and designers.<\/p>\n<p>When Sketch2React releases version 2.x \u2013 Sketch, Figma and InVision Studio will have (one-way) design-to-code support; all from within one and the same app! Sketch2React will also provide the output-option of web components!<\/p>\n<blockquote><p>Design systems will keep growing in popularity which in turn will help to speed up the evolution of design-to-code.<\/p><\/blockquote>\n<hr>\n<h3>Conclusion:<\/h3>\n<p>Because of the ever increasing popularity of design systems we will see a fast evolution of Design-Code-components which are either:<\/p>\n<p>1. Code components imported into the design-tool for reuse in design-documents.<\/p>\n<p>2. Design assets exported from the design-tool as code components* for reuse in applications.<\/p>\n<p>* gradually shifting from framework specific components to Web components<\/p>\n<p>These Design-Code-components can then be composed into bigger applications. \u201cComponent compositioning\u201d will be a common-place term in the years to come.<\/p>\n<p>This shift in how we design and develop our applications and libraries will not happen over-night. We are at the dawn of a new era when it comes to web development. Enjoy the ride. It\u2019s going to be legendary.<\/p>\n<p><strong>Mirror: <\/strong><em>Look behind you!<\/em><\/p>\n<p>Then we battle the zombie-invasion that snuck up on us while we were bickering about front-end frameworks. We win, but only because we team up with the vampires. The vampires betray us at the end and we all become cool vampire-zombies with awesome futuristic assault-rifles.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>This might someday be based on a true story. No one can predict the future, but if what I write here comes to pass.. then this article is indeed based on a true story and we will all be dead-ish. Photo by Judeus Samson on&nbsp;Unsplash Development will move towards modularity, reusability and standardization. Composition of&hellip;&nbsp;<a href=\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/\" class=\"\" rel=\"bookmark\">Read More &raquo;<span class=\"screen-reader-text\">My 2 cents about the web in 2020<\/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":[168],"tags":[125,159,160,161,31],"class_list":["post-252","post","type-post","status-publish","format-standard","hentry","category-miscellaneous","tag-design-systems","tag-front-end-development","tag-future","tag-trends","tag-web-development"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>My 2 cents about the web in 2020 | 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\/my-2-cents-about-the-web-in-2020\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"My 2 cents about the web in 2020 - Sketch2React Blog\" \/>\n<meta property=\"og:description\" content=\"This might someday be based on a true story. No one can predict the future, but if what I write here comes to pass.. then this article is indeed based on a true story and we will all be dead-ish. Photo by Judeus Samson on&nbsp;Unsplash Development will move towards modularity, reusability and standardization. Composition of&hellip;&nbsp;Read More &raquo;My 2 cents about the web in 2020\" \/>\n<meta property=\"og:url\" content=\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/\" \/>\n<meta property=\"og:site_name\" content=\"Sketch2React Blog\" \/>\n<meta property=\"article:published_time\" content=\"2019-09-18T06:41:18+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-06-18T07:42:34+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/5bd35-1qran4wcsoj8ozpplesayeg.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=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/\"},\"author\":{\"name\":\"Fredrik Ward\",\"@id\":\"https:\/\/sketch2react.io\/blog\/#\/schema\/person\/d452067d5528ce6cda4be87f136cf664\"},\"headline\":\"My 2 cents about the web in 2020\",\"datePublished\":\"2019-09-18T06:41:18+00:00\",\"dateModified\":\"2020-06-18T07:42:34+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/\"},\"wordCount\":1122,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#primaryimage\"},\"thumbnailUrl\":\"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/5bd35-1qran4wcsoj8ozpplesayeg.jpeg\",\"keywords\":[\"Design Systems\",\"Front End Development\",\"Future\",\"Trends\",\"Web Development\"],\"articleSection\":[\"Miscellaneous\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/\",\"url\":\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/\",\"name\":\"My 2 cents about the web in 2020 - Sketch2React Blog\",\"isPartOf\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#primaryimage\"},\"thumbnailUrl\":\"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/5bd35-1qran4wcsoj8ozpplesayeg.jpeg\",\"datePublished\":\"2019-09-18T06:41:18+00:00\",\"dateModified\":\"2020-06-18T07:42:34+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#primaryimage\",\"url\":\"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/5bd35-1qran4wcsoj8ozpplesayeg.jpeg\",\"contentUrl\":\"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/5bd35-1qran4wcsoj8ozpplesayeg.jpeg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/sketch2react.io\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"My 2 cents about the web in 2020\"}]},{\"@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:\/\/sketch2react.io\/blog\/#\/schema\/person\/image\/\",\"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":"My 2 cents about the web in 2020 | 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\/my-2-cents-about-the-web-in-2020\/","og_locale":"en_US","og_type":"article","og_title":"My 2 cents about the web in 2020 - Sketch2React Blog","og_description":"This might someday be based on a true story. No one can predict the future, but if what I write here comes to pass.. then this article is indeed based on a true story and we will all be dead-ish. Photo by Judeus Samson on&nbsp;Unsplash Development will move towards modularity, reusability and standardization. Composition of&hellip;&nbsp;Read More &raquo;My 2 cents about the web in 2020","og_url":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/","og_site_name":"Sketch2React Blog","article_published_time":"2019-09-18T06:41:18+00:00","article_modified_time":"2020-06-18T07:42:34+00:00","og_image":[{"url":"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/5bd35-1qran4wcsoj8ozpplesayeg.jpeg","type":"","width":"","height":""}],"author":"Fredrik Ward","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Fredrik Ward","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#article","isPartOf":{"@id":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/"},"author":{"name":"Fredrik Ward","@id":"https:\/\/sketch2react.io\/blog\/#\/schema\/person\/d452067d5528ce6cda4be87f136cf664"},"headline":"My 2 cents about the web in 2020","datePublished":"2019-09-18T06:41:18+00:00","dateModified":"2020-06-18T07:42:34+00:00","mainEntityOfPage":{"@id":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/"},"wordCount":1122,"commentCount":0,"publisher":{"@id":"https:\/\/sketch2react.io\/blog\/#organization"},"image":{"@id":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#primaryimage"},"thumbnailUrl":"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/5bd35-1qran4wcsoj8ozpplesayeg.jpeg","keywords":["Design Systems","Front End Development","Future","Trends","Web Development"],"articleSection":["Miscellaneous"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/","url":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/","name":"My 2 cents about the web in 2020 - Sketch2React Blog","isPartOf":{"@id":"https:\/\/sketch2react.io\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#primaryimage"},"image":{"@id":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#primaryimage"},"thumbnailUrl":"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/5bd35-1qran4wcsoj8ozpplesayeg.jpeg","datePublished":"2019-09-18T06:41:18+00:00","dateModified":"2020-06-18T07:42:34+00:00","breadcrumb":{"@id":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#primaryimage","url":"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/5bd35-1qran4wcsoj8ozpplesayeg.jpeg","contentUrl":"http:\/\/sketch2react.files.wordpress.com\/2019\/09\/5bd35-1qran4wcsoj8ozpplesayeg.jpeg"},{"@type":"BreadcrumbList","@id":"https:\/\/sketch2react.io\/blog\/my-2-cents-about-the-web-in-2020\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/sketch2react.io\/blog\/"},{"@type":"ListItem","position":2,"name":"My 2 cents about the web in 2020"}]},{"@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:\/\/sketch2react.io\/blog\/#\/schema\/person\/image\/","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\/252","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=252"}],"version-history":[{"count":1,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/posts\/252\/revisions"}],"predecessor-version":[{"id":375,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/posts\/252\/revisions\/375"}],"wp:attachment":[{"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/media?parent=252"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/categories?post=252"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/tags?post=252"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}