{"id":121,"date":"2018-04-20T14:34:10","date_gmt":"2018-04-20T12:34:10","guid":{"rendered":"https:\/\/sketch2react.wordpress.com\/2018\/04\/20\/%f0%9f%9b%a3-my-path-from-design-to-code\/"},"modified":"2020-06-18T07:42:39","modified_gmt":"2020-06-18T07:42:39","slug":"%f0%9f%9b%a3-my-path-from-design-to-code","status":"publish","type":"post","link":"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/","title":{"rendered":"? My path from design to {code}"},"content":{"rendered":"<h4>How my deeper understanding for code has elevated and is taking me to places I never thought were even possible.<\/h4>\n<figure>\n<p><img decoding=\"async\" data-width=\"1920\" data-height=\"1080\" src=\"https:\/\/cdn-images-1.medium.com\/max\/2560\/1*U0oGfNk4-IwriEIjp7Vm6g.jpeg\"><br \/>\n<\/figure>\n<p><strong>Code.<\/strong> Ah yes. That four-letter word that holds so much power. And to be honest; <em>fear<\/em>. Because we\/I fear what we\/I don\u2019t understand.<\/p>\n<p>But when you realize that the only way of climbing further up that imaginative ladder in most companies <em>is<\/em> becoming a manager, sit in endless meetings and only use Microsoft Office for the rest of your miserable life the prospect of learning more about code suddenly feels really important. <em>Please managers take no offense I\u2019m happy for your sake, it\u2019s just not my way to work-happiness.<\/em><\/p>\n<h3>? A bit of background to this\u00a0story<\/h3>\n<p>I have been building websites with WYSIWYG editors for more than 15 years. Started with DreamWeaver in 1999\/2000 and used it for a while but was always really frustrated. Then I discovered another weaver, (RapidWeaver) in about 2011\u20132012 I don\u2019t remember well (I\u2019m old get over it). But I always felt that nagging feeling. Me talking to myself:<em> \u201d-You should learn how to code or you will get a pile of <\/em>?<em> thrown at you, you will get unemployed and your children will suffer. Also their future children will become mutants.\u201d<\/em><\/p>\n<p><a href=\"https:\/\/tenor.com\/x7Tc.gif\">https:\/\/tenor.com\/x7Tc.gif<\/a><\/p>\n<p>Yikes.<\/p>\n<p><strong>So, I tried to learn code. <\/strong>Didn\u2019t go<strong> <\/strong>so well. Uninspiring tutorials, even more uninspiring design examples\/assets that came with them. I care about s<em>tuff <\/em>like that you know.<\/p>\n<h3>? Then this happened {in no particular order}<\/h3>\n<p>\u2022 I discovered <a href=\"https:\/\/designcode.io\/\" target=\"_blank\" rel=\"noopener noreferrer\">Design+Code<\/a> \u2013 Finally, beautiful design together with great content. It\u2019s more than a course, it\u2019s a whole learning platform and they keep on adding new content on a regular basis. Highly recommended!<br \/>\u2022 I started learning how to animate with <a href=\"https:\/\/www.keyshapeapp.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Keyshape<\/a>. Keyshape is really simple. But when you want to input your exported code-friendly animations and have them behave nicely in RapidWeaver (or other framework) you will need to do some editing to your code. Very small edits but some. <em>So, I learned.<\/em><br \/>\u2022 I got a really <strong>great developer friend<\/strong> whom I ask a lot of questions (poor guy, luckily he\u2019s like the most patient dude in the galaxy).<br \/>\u2022 I started <strong>writing stuff <\/strong>like this article. See I\u2019m a designer, very visual, not used to words. And you know where else you type a lot of stuff. C-O-D-E. Yup.??\u200d?\u2b50\ufe0f<br \/>\u2022 I started <a href=\"http:\/\/www.designforventures.co\/\" target=\"_blank\" rel=\"noopener noreferrer\">Designforventures.co<\/a> as a side-project<br \/>\u2013 Which led up to releasing stuff like a <a href=\"https:\/\/beta.designforventures.co\/Free-Animated-SVG-Icons\/Animated-Fonts\/\" target=\"_blank\" rel=\"noopener noreferrer\">free pre-animated SVG-alphabet<\/a>. <em>See?<\/em> Coooode.<\/p>\n<figure class=\"wp-caption\">\n<p><img decoding=\"async\" data-width=\"800\" data-height=\"450\" src=\"https:\/\/cdn-images-1.medium.com\/max\/800\/1*1x1K6p6fCpP6LJrejjUc3w.gif\"><figcaption class=\"wp-caption-text\">Created with Keyshape. Upcoming tutorial will show you to do exactly this ??\u200d?? Btw the GIF is super optimized, the original SVG is much much smoooother<\/figcaption><\/figure>\n<h3>? Tips for designers<\/h3>\n<p>\u2022 <strong>Learn while working.<\/strong> Say that you are designing a website or an app or whatever that would really benefit from a couple of animated thingies. You don\u2019t need to have a degree in motion design to animate an icon. Just watch my tutorials (ha! got ya). Or other people\u2019s tutorials they also have great ones.??<br \/>\u2022 <strong>Ask a lot of questions!<\/strong><br \/>\u2022 Experiment with apps like Keyshape, <a href=\"https:\/\/www.haiku.ai\/\" target=\"_blank\" rel=\"noopener noreferrer\">Haiku<\/a>, <a href=\"https:\/\/framer.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Framer<\/a> that (in a way) forces you to get a better understanding of code<br \/>\u2022 By getting a deeper understanding of how code works you will get even better at your own job as a designer.<br \/>\u2022 Your dev team will get a lot happier and a happy dev team is stellar for the final output, trust me on this one<br \/>\u2022 It\u2019s really empowering to be able to build your own prototypes with real code. The key thing is to know when to code and when to use simpler prototyping apps like Flinto, InVision, Marvel etc. I read a great article about it <a href=\"https:\/\/medium.freecodecamp.org\/harnessing-the-power-of-react-in-design-prototyping-4a74e70db5f5\" target=\"_blank\" rel=\"noopener noreferrer\">here<\/a>.<\/p>\n<h3>? Afterthoughts<\/h3>\n<p><strong>I love being a designer.<\/strong> I will always love crafting things together that actually makes sense and helps other people do their work better. But by getting closer to the code I\u2019m in fact becoming even better at my job. Which is crafting beautiful and meaningful user experiences.<\/p>\n<p><strong>Important!<\/strong> I\u2019m not trying to convert all designers into developers, god no. But I think that we need to work much closer to stay relevant ?<\/p>\n<p>Wow thanks for reading this far!<\/p>\n<p>Now a little something ??<\/p>\n<figure class=\"wp-caption\">\n<p><img decoding=\"async\" data-width=\"600\" data-height=\"370\" src=\"https:\/\/cdn-images-1.medium.com\/max\/800\/1*Mw6lP5AvDBcQ1-vg8KKJYQ.gif\"><figcaption class=\"wp-caption-text\">Drag and drop your Sketch files! Sketch2React yes!<\/figcaption><\/figure>\n<h3>? Just one more\u00a0thing<\/h3>\n<p>Me and my friend Fredrik are working on a really cool thing. Basically it\u2019s <strong>Sketch to React<\/strong>. Right now it\u2019s just for building prototypes that live on your computer but we don\u2019t want to stop there. The cool thing is; it forces you as a designer to think more like a developer. It\u2019s not magic. You will need to follow certain structures inside of Sketch for it to even work. You will need to learn a very basic version of Atomic CSS. Trust me, it\u2019s really simple. <em>I learned it <\/em>?<br \/>Our goal is to be able to copy\/paste the code generated like this into a real React application or website.<\/p>\n<p><em>Disclaimer: We don\u2019t know if this is ever going to be released to the public or if we even succeed with what we want to achieve. <\/em>Keep you posted as they say.<\/p>\n<p><strong>???\u200d?? Edit: <\/strong>We created a very <a href=\"https:\/\/sketch2react.io\/\" target=\"_blank\" rel=\"noopener noreferrer\">simple workshop website<\/a> for our project where you guys can sign-up to be included when we roll this out to more people.<\/p>\n<p>?<\/p>\n<figure>\n<p><img decoding=\"async\" data-width=\"800\" data-height=\"400\" src=\"https:\/\/cdn-images-1.medium.com\/max\/800\/1*CRr6d9kbhPi6bQjEReyHGQ@2x.png\"><br \/>\n<\/figure>\n","protected":false},"excerpt":{"rendered":"<p>How my deeper understanding for code has elevated and is taking me to places I never thought were even possible. Code. Ah yes. That four-letter word that holds so much power. And to be honest; fear. Because we\/I fear what we\/I don\u2019t understand. But when you realize that the only way of climbing further up&hellip;&nbsp;<a href=\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/\" class=\"\" rel=\"bookmark\">Read More &raquo;<span class=\"screen-reader-text\">? My path from design to {code}<\/span><\/a><\/p>\n","protected":false},"author":2,"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":[4,67,43,59,34],"class_list":["post-121","post","type-post","status-publish","format-standard","hentry","category-miscellaneous","tag-animation","tag-learn-code","tag-prototyping","tag-react","tag-ux-design"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>? My path from design to {code} | 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\/\ud83d\udee3-my-path-from-design-to-code\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"? My path from design to {code} - Sketch2React Blog\" \/>\n<meta property=\"og:description\" content=\"How my deeper understanding for code has elevated and is taking me to places I never thought were even possible. Code. Ah yes. That four-letter word that holds so much power. And to be honest; fear. Because we\/I fear what we\/I don\u2019t understand. But when you realize that the only way of climbing further up&hellip;&nbsp;Read More &raquo;? My path from design to {code}\" \/>\n<meta property=\"og:url\" content=\"https:\/\/sketch2react.io\/blog\/\ud83d\udee3-my-path-from-design-to-code\/\" \/>\n<meta property=\"og:site_name\" content=\"Sketch2React Blog\" \/>\n<meta property=\"article:published_time\" content=\"2018-04-20T12:34:10+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-06-18T07:42:39+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cdn-images-1.medium.com\/max\/2560\/1*U0oGfNk4-IwriEIjp7Vm6g.jpeg\" \/>\n<meta name=\"author\" content=\"Juan Maguid\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Juan Maguid\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/\"},\"author\":{\"name\":\"Juan Maguid\",\"@id\":\"https:\/\/sketch2react.io\/blog\/#\/schema\/person\/7fc8fe20e137be20a66bc8634c059f4e\"},\"headline\":\"? My path from design to {code}\",\"datePublished\":\"2018-04-20T12:34:10+00:00\",\"dateModified\":\"2020-06-18T07:42:39+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/\"},\"wordCount\":899,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/cdn-images-1.medium.com\/max\/2560\/1*U0oGfNk4-IwriEIjp7Vm6g.jpeg\",\"keywords\":[\"Animation\",\"Learn Code\",\"Prototyping\",\"React\",\"UX Design\"],\"articleSection\":[\"Miscellaneous\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/\",\"url\":\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/\",\"name\":\"? My path from design to {code} - Sketch2React Blog\",\"isPartOf\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/cdn-images-1.medium.com\/max\/2560\/1*U0oGfNk4-IwriEIjp7Vm6g.jpeg\",\"datePublished\":\"2018-04-20T12:34:10+00:00\",\"dateModified\":\"2020-06-18T07:42:39+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#primaryimage\",\"url\":\"https:\/\/cdn-images-1.medium.com\/max\/2560\/1*U0oGfNk4-IwriEIjp7Vm6g.jpeg\",\"contentUrl\":\"https:\/\/cdn-images-1.medium.com\/max\/2560\/1*U0oGfNk4-IwriEIjp7Vm6g.jpeg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/sketch2react.io\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"? My path from design to {code}\"}]},{\"@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\/7fc8fe20e137be20a66bc8634c059f4e\",\"name\":\"Juan Maguid\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/sketch2react.io\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/eac199ca87b7cbb76863825e2f447fafd34ac3b7c4a03c94f499103333c24832?s=96&d=wavatar&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/eac199ca87b7cbb76863825e2f447fafd34ac3b7c4a03c94f499103333c24832?s=96&d=wavatar&r=g\",\"caption\":\"Juan Maguid\"},\"url\":\"https:\/\/sketch2react.io\/blog\/author\/sketch2react\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"? My path from design to {code} | 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\/\ud83d\udee3-my-path-from-design-to-code\/","og_locale":"en_US","og_type":"article","og_title":"? My path from design to {code} - Sketch2React Blog","og_description":"How my deeper understanding for code has elevated and is taking me to places I never thought were even possible. Code. Ah yes. That four-letter word that holds so much power. And to be honest; fear. Because we\/I fear what we\/I don\u2019t understand. But when you realize that the only way of climbing further up&hellip;&nbsp;Read More &raquo;? My path from design to {code}","og_url":"https:\/\/sketch2react.io\/blog\/\ud83d\udee3-my-path-from-design-to-code\/","og_site_name":"Sketch2React Blog","article_published_time":"2018-04-20T12:34:10+00:00","article_modified_time":"2020-06-18T07:42:39+00:00","og_image":[{"url":"https:\/\/cdn-images-1.medium.com\/max\/2560\/1*U0oGfNk4-IwriEIjp7Vm6g.jpeg","type":"","width":"","height":""}],"author":"Juan Maguid","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Juan Maguid","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#article","isPartOf":{"@id":"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/"},"author":{"name":"Juan Maguid","@id":"https:\/\/sketch2react.io\/blog\/#\/schema\/person\/7fc8fe20e137be20a66bc8634c059f4e"},"headline":"? My path from design to {code}","datePublished":"2018-04-20T12:34:10+00:00","dateModified":"2020-06-18T07:42:39+00:00","mainEntityOfPage":{"@id":"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/"},"wordCount":899,"commentCount":0,"publisher":{"@id":"https:\/\/sketch2react.io\/blog\/#organization"},"image":{"@id":"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn-images-1.medium.com\/max\/2560\/1*U0oGfNk4-IwriEIjp7Vm6g.jpeg","keywords":["Animation","Learn Code","Prototyping","React","UX Design"],"articleSection":["Miscellaneous"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/","url":"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/","name":"? My path from design to {code} - Sketch2React Blog","isPartOf":{"@id":"https:\/\/sketch2react.io\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#primaryimage"},"image":{"@id":"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn-images-1.medium.com\/max\/2560\/1*U0oGfNk4-IwriEIjp7Vm6g.jpeg","datePublished":"2018-04-20T12:34:10+00:00","dateModified":"2020-06-18T07:42:39+00:00","breadcrumb":{"@id":"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#primaryimage","url":"https:\/\/cdn-images-1.medium.com\/max\/2560\/1*U0oGfNk4-IwriEIjp7Vm6g.jpeg","contentUrl":"https:\/\/cdn-images-1.medium.com\/max\/2560\/1*U0oGfNk4-IwriEIjp7Vm6g.jpeg"},{"@type":"BreadcrumbList","@id":"https:\/\/sketch2react.io\/blog\/%f0%9f%9b%a3-my-path-from-design-to-code\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/sketch2react.io\/blog\/"},{"@type":"ListItem","position":2,"name":"? My path from design to {code}"}]},{"@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\/7fc8fe20e137be20a66bc8634c059f4e","name":"Juan Maguid","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/sketch2react.io\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/eac199ca87b7cbb76863825e2f447fafd34ac3b7c4a03c94f499103333c24832?s=96&d=wavatar&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/eac199ca87b7cbb76863825e2f447fafd34ac3b7c4a03c94f499103333c24832?s=96&d=wavatar&r=g","caption":"Juan Maguid"},"url":"https:\/\/sketch2react.io\/blog\/author\/sketch2react\/"}]}},"_links":{"self":[{"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/posts\/121","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\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/comments?post=121"}],"version-history":[{"count":1,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/posts\/121\/revisions"}],"predecessor-version":[{"id":408,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/posts\/121\/revisions\/408"}],"wp:attachment":[{"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/media?parent=121"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/categories?post=121"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/tags?post=121"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}