{"id":84,"date":"2019-04-15T11:40:34","date_gmt":"2019-04-15T09:40:34","guid":{"rendered":"https:\/\/sketch2react.wordpress.com\/2019\/04\/15\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/"},"modified":"2020-06-18T07:27:00","modified_gmt":"2020-06-18T07:27:00","slug":"10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb","status":"publish","type":"post","link":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/","title":{"rendered":"10 More Great Sketch2React Tips from the Team????\u200d???\u200d?"},"content":{"rendered":"<figure class=\"wp-caption\">\n<p><img decoding=\"async\" data-width=\"1920\" data-height=\"1080\" src=\"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*R2x0NwDhACGswDsh_Vj-pQ.jpeg\"><figcaption class=\"wp-caption-text\">Wooo-pi-do here we go again\u00a0?<\/figcaption><\/figure>\n<p><a href=\"https:\/\/link.medium.com\/LAZPea6SLW\">https:\/\/link.medium.com\/LAZPea6SLW<\/a><br \/>\n<a href=\"https:\/\/link.medium.com\/LAZPea6SLW\">https:\/\/link.medium.com\/LAZPea6SLW<\/a><\/p>\n<h3>10 More Great Sketch2React Tips from the Team????\u200d???\u200d?<\/h3>\n<h4>This is Cold Spring 2019\u00a0Edition<\/h4>\n<p>Hey and welcome to another round of our very best Skech2React Tips from the team. Let\u2019s go people!<\/p>\n<p>The previous one was back in <a href=\"https:\/\/link.medium.com\/P4ptP5ONOV\" target=\"_blank\" rel=\"noopener noreferrer\">December<\/a> and the one before that all the way back in time to <a href=\"https:\/\/link.medium.com\/UmxEn2rHPV\" target=\"_blank\" rel=\"noopener noreferrer\">September<\/a> 2018.<\/p>\n<hr>\n<blockquote class=\"twitter-tweet\" data-width=\"550\" data-dnt=\"true\">\n<p lang=\"en\" dir=\"ltr\">Thanks for watching this very interesting <a href=\"https:\/\/twitter.com\/hashtag\/sketch2react?src=hash&amp;ref_src=twsrc%5Etfw\">#sketch2react<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/protip?src=hash&amp;ref_src=twsrc%5Etfw\">#protip<\/a> instead of that boring <a href=\"https:\/\/twitter.com\/hashtag\/PowerPoint?src=hash&amp;ref_src=twsrc%5Etfw\">#PowerPoint<\/a> you\u2019re forced to watch by your <a href=\"https:\/\/twitter.com\/hashtag\/boss?src=hash&amp;ref_src=twsrc%5Etfw\">#boss<\/a> ????\u2620\ufe0f <a href=\"https:\/\/t.co\/G1qf6zpcz3\">pic.twitter.com\/G1qf6zpcz3<\/a><\/p>\n<p>&mdash; Team Sketch2React (@Sketch2R) <a href=\"https:\/\/twitter.com\/Sketch2R\/status\/1116350378054963200?ref_src=twsrc%5Etfw\">April 11, 2019<\/a><\/p><\/blockquote>\n<p><script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>\n<h3>Pro Tip #1\u200a\u2014\u200aUsing Sketch Cloud together with Sketch2React<\/h3>\n<p><a href=\"https:\/\/sketch.cloud\/signup\" target=\"_blank\" rel=\"noopener noreferrer\">Sketch Cloud<\/a> is great. It\u2019s included in your Sketch license, it\u2019s becoming better and better with each iteration, and it makes sharing Sketch2React code components really easy.<\/p>\n<h4><strong>Limitations to\u00a0consider<\/strong><\/h4>\n<p><strong>One very important thing to remember:<\/strong> once you have linked\/downloaded the Sketch library file and inserted your shared components you will need to unlink them, or they will not work inside our code app. This limitation is due to that we need our components to be inside your Sketch file and not linked to a cloud service.<\/p>\n<hr>\n<blockquote class=\"twitter-tweet\" data-width=\"550\" data-dnt=\"true\">\n<p lang=\"en\" dir=\"ltr\">Once you have done all of that hard work setting everything up, save your <a href=\"https:\/\/twitter.com\/hashtag\/code?src=hash&amp;ref_src=twsrc%5Etfw\">#code<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/components?src=hash&amp;ref_src=twsrc%5Etfw\">#components<\/a> as <a href=\"https:\/\/twitter.com\/hashtag\/sketchapp?src=hash&amp;ref_src=twsrc%5Etfw\">#sketchapp<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/symbols?src=hash&amp;ref_src=twsrc%5Etfw\">#symbols<\/a> and shed many many happy tears ? <a href=\"https:\/\/twitter.com\/hashtag\/Sketch2React?src=hash&amp;ref_src=twsrc%5Etfw\">#Sketch2React<\/a> <a href=\"https:\/\/t.co\/6stpoiHjei\">pic.twitter.com\/6stpoiHjei<\/a><\/p>\n<p>&mdash; Team Sketch2React (@Sketch2R) <a href=\"https:\/\/twitter.com\/Sketch2R\/status\/1116053092938678273?ref_src=twsrc%5Etfw\">April 10, 2019<\/a><\/p><\/blockquote>\n<p><script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>\n<h3>Pro Tip #2\u200a\u2014\u200aConvert your components to\u00a0symbols<\/h3>\n<p>You know, if you use <a href=\"https:\/\/sketch2react.io\" target=\"_blank\" rel=\"noopener noreferrer\">Sketch2React<\/a> you have probably put in some considerable time crafting your components. We know we do. And it really sucks<em> not using<\/em> the amazing Symbols system inside of Sketch for saving you eons of time. It really is an amazing feeling to drop real code components (once designed) here and there inside your artboards and seeing them come alive in our code app. We never get tired of this. ? ?<\/p>\n<hr>\n<blockquote class=\"twitter-tweet\" data-width=\"550\" data-dnt=\"true\">\n<p lang=\"en\" dir=\"ltr\"><a href=\"https:\/\/twitter.com\/hashtag\/protip?src=hash&amp;ref_src=twsrc%5Etfw\">#protip<\/a> Here\u2019s a smart way of using <a href=\"https:\/\/twitter.com\/hashtag\/flaticons?src=hash&amp;ref_src=twsrc%5Etfw\">#flaticons<\/a> together with <a href=\"https:\/\/twitter.com\/hashtag\/Sketch2React?src=hash&amp;ref_src=twsrc%5Etfw\">#Sketch2React<\/a> and <a href=\"https:\/\/twitter.com\/sketch?ref_src=twsrc%5Etfw\">@sketch<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/css?src=hash&amp;ref_src=twsrc%5Etfw\">#css<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/fonts?src=hash&amp;ref_src=twsrc%5Etfw\">#fonts<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/reactjs?src=hash&amp;ref_src=twsrc%5Etfw\">#reactjs<\/a> <a href=\"https:\/\/t.co\/fs8SPBplUr\">pic.twitter.com\/fs8SPBplUr<\/a><\/p>\n<p>&mdash; Team Sketch2React (@Sketch2R) <a href=\"https:\/\/twitter.com\/Sketch2R\/status\/1115604857308581890?ref_src=twsrc%5Etfw\">April 9, 2019<\/a><\/p><\/blockquote>\n<p><script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>\n<h3>Pro Tip #3\u200a\u2014\u200aHow to work with icon\u00a0fonts<\/h3>\n<p>Icon fonts are really clever to use together with our framework since it gives you a very fast and flexible way of working with vectors. In fact it\u2019s the only way of working with vector illustrations without the need to convert them into image assets. So go ahead, dooooo it. Here\u2019s a brief tutorial showing you how-to, with in example given <a href=\"https:\/\/www.flaticon.com\" target=\"_blank\" rel=\"noopener noreferrer\">Flaticon icons<\/a> ??\u2705<\/p>\n<div class=\"nv-iframe-embed\"><iframe loading=\"lazy\" title=\"Sketch2React Pro Tip \u2013 Working with Icon Fonts\" width=\"1200\" height=\"675\" src=\"https:\/\/www.youtube.com\/embed\/6_SCA4JGl5M?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe><\/div>\n<hr>\n<blockquote class=\"twitter-tweet\" data-width=\"550\" data-dnt=\"true\">\n<p lang=\"en\" dir=\"ltr\">Jump over to our <a href=\"https:\/\/twitter.com\/hashtag\/website?src=hash&amp;ref_src=twsrc%5Etfw\">#website<\/a> and <a href=\"https:\/\/twitter.com\/hashtag\/download?src=hash&amp;ref_src=twsrc%5Etfw\">#download<\/a> our latest <a href=\"https:\/\/twitter.com\/hashtag\/sketch2react?src=hash&amp;ref_src=twsrc%5Etfw\">#sketch2react<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/freebie?src=hash&amp;ref_src=twsrc%5Etfw\">#freebie<\/a> Just Add Water Animations &#8211; A Sketchfile filled with awesome <a href=\"https:\/\/twitter.com\/hashtag\/animatecss?src=hash&amp;ref_src=twsrc%5Etfw\">#animatecss<\/a> ready-to-use <a href=\"https:\/\/twitter.com\/hashtag\/animations?src=hash&amp;ref_src=twsrc%5Etfw\">#animations<\/a> Your welcome ?????\u200d?<a href=\"https:\/\/twitter.com\/hashtag\/designtocode?src=hash&amp;ref_src=twsrc%5Etfw\">#designtocode<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/framework?src=hash&amp;ref_src=twsrc%5Etfw\">#framework<\/a> for <a href=\"https:\/\/twitter.com\/sketchapp?ref_src=twsrc%5Etfw\">@sketchapp<\/a> <a href=\"https:\/\/t.co\/RTwCFVnzfX\">pic.twitter.com\/RTwCFVnzfX<\/a><\/p>\n<p>&mdash; Team Sketch2React (@Sketch2R) <a href=\"https:\/\/twitter.com\/Sketch2R\/status\/1114207437685514240?ref_src=twsrc%5Etfw\">April 5, 2019<\/a><\/p><\/blockquote>\n<p><script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>\n<h3>Pro Tip #4\u200a\u2014\u200aWork with CSS\u00a0plugins<\/h3>\n<p>Do not miss the spellbinding mix of Sketch layers and applying CSS plugins to them. ? Once you start you just can\u2019t stop. We have a brand new freebie that will jumpstart you using the amazing Animate.css library of \u201cjust add water\u201d animations.<\/p>\n<figure class=\"wp-caption\">\n<p><img decoding=\"async\" data-width=\"1024\" data-height=\"1024\" src=\"https:\/\/cdn-images-1.medium.com\/max\/800\/1*_3keg8fviisonCORbB_mNw@2x.png\"><figcaption class=\"wp-caption-text\"><a href=\"https:\/\/sketch2react.io\/resources\/S2RJustAddWaterAnimations.zip\" target=\"_blank\" rel=\"noopener noreferrer\">Click here for direct download of our latest\u00a0freebie<\/a><\/figcaption><\/figure>\n<hr>\n<blockquote class=\"twitter-tweet\" data-width=\"550\" data-dnt=\"true\">\n<p lang=\"en\" dir=\"ltr\">Best thing about <a href=\"https:\/\/twitter.com\/hashtag\/sideprojects?src=hash&amp;ref_src=twsrc%5Etfw\">#sideprojects<\/a> is being able to write silly headlines and no one even bothers hahaha ?\u2705<a href=\"https:\/\/twitter.com\/hashtag\/designtocode?src=hash&amp;ref_src=twsrc%5Etfw\">#designtocode<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/component?src=hash&amp;ref_src=twsrc%5Etfw\">#component<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/framework?src=hash&amp;ref_src=twsrc%5Etfw\">#framework<\/a> for <a href=\"https:\/\/twitter.com\/sketch?ref_src=twsrc%5Etfw\">@sketch<\/a> <a href=\"https:\/\/twitter.com\/AnimaApp?ref_src=twsrc%5Etfw\">@AnimaApp<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/devsigner?src=hash&amp;ref_src=twsrc%5Etfw\">#devsigner<\/a> <a href=\"https:\/\/t.co\/9VNWQEJ7Wi\">pic.twitter.com\/9VNWQEJ7Wi<\/a><\/p>\n<p>&mdash; Team Sketch2React (@Sketch2R) <a href=\"https:\/\/twitter.com\/Sketch2R\/status\/1114154025233072129?ref_src=twsrc%5Etfw\">April 5, 2019<\/a><\/p><\/blockquote>\n<p><script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>\n<h3>Pro Tip #5\u200a\u2014\u200aUse {group} and {group-fixed} for amazing responsive card\u00a0making<\/h3>\n<p>Our most advanced layout component is without any doubt {group} and {group-fixed}. Needs to be seen in action to be believed. It makes creating superb responsive card elements a breeze.<\/p>\n<hr>\n<blockquote class=\"twitter-tweet\" data-width=\"550\" data-dnt=\"true\">\n<p lang=\"en\" dir=\"ltr\">This was a nice surprise! <a href=\"https:\/\/twitter.com\/hashtag\/imageoverrides?src=hash&amp;ref_src=twsrc%5Etfw\">#imageoverrides<\/a> now works again as of <a href=\"https:\/\/twitter.com\/sketch?ref_src=twsrc%5Etfw\">@sketch<\/a> v54 Beta 4 ???Don&#39;t forget to relink your <a href=\"https:\/\/twitter.com\/hashtag\/sketchfile?src=hash&amp;ref_src=twsrc%5Etfw\">#sketchfile<\/a> for the image to load into our <a href=\"https:\/\/twitter.com\/hashtag\/codeapp?src=hash&amp;ref_src=twsrc%5Etfw\">#codeapp<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/reactjs?src=hash&amp;ref_src=twsrc%5Etfw\">#reactjs<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/bootstrap4?src=hash&amp;ref_src=twsrc%5Etfw\">#bootstrap4<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/devsigner?src=hash&amp;ref_src=twsrc%5Etfw\">#devsigner<\/a> <a href=\"https:\/\/t.co\/NIvYC94qnj\">pic.twitter.com\/NIvYC94qnj<\/a><\/p>\n<p>&mdash; Team Sketch2React (@Sketch2R) <a href=\"https:\/\/twitter.com\/Sketch2R\/status\/1115289251837554695?ref_src=twsrc%5Etfw\">April 8, 2019<\/a><\/p><\/blockquote>\n<p><script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>\n<h3>Pro Tip #6\u200a\u2014\u200aImage Overrides in Sketch2React symbols now work again ?\u00a0?<\/h3>\n<p>Early in our alpha this worked fine. Then somehow it stopped working. Then it started working again. We are not sure when but I tested this in the very latest version of Sketch 54 and it works really well. It makes the whole process of creating reusable components that include images so much easier.<\/p>\n<p>Well done Bohemian Coding, whatever you did, works ??<\/p>\n<hr>\n<blockquote class=\"twitter-tweet\" data-width=\"550\" data-dnt=\"true\">\n<p lang=\"en\" dir=\"ltr\">After export remember to <a href=\"https:\/\/twitter.com\/hashtag\/compress?src=hash&amp;ref_src=twsrc%5Etfw\">#compress<\/a> your <a href=\"https:\/\/twitter.com\/hashtag\/Sketch2React?src=hash&amp;ref_src=twsrc%5Etfw\">#Sketch2React<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/image?src=hash&amp;ref_src=twsrc%5Etfw\">#image<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/assets?src=hash&amp;ref_src=twsrc%5Etfw\">#assets<\/a> with something like <a href=\"https:\/\/twitter.com\/tinypng?ref_src=twsrc%5Etfw\">@tinypng<\/a> ???<a href=\"https:\/\/twitter.com\/sketch?ref_src=twsrc%5Etfw\">@sketch<\/a> <a href=\"https:\/\/t.co\/vQ4KIDbW9d\">pic.twitter.com\/vQ4KIDbW9d<\/a><\/p>\n<p>&mdash; Team Sketch2React (@Sketch2R) <a href=\"https:\/\/twitter.com\/Sketch2R\/status\/1116698288709877762?ref_src=twsrc%5Etfw\">April 12, 2019<\/a><\/p><\/blockquote>\n<p><script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>\n<h3>Pro Tip #7\u200a\u2014\u200aCompress your\u00a0images<\/h3>\n<p>You know how it goes. You just design along not worrying about things like image compression, how large images are on your artboard etc. Actually you can do all of that worrying when your done \u2705<\/p>\n<p>Even if you\u2019re just building a real code proto you want your prototype to feel snappy and fast, don\u2019t you?<\/p>\n<hr>\n<blockquote class=\"twitter-tweet\" data-width=\"550\" data-dnt=\"true\">\n<p lang=\"en\" dir=\"ltr\">ProTip! By having the <a href=\"https:\/\/twitter.com\/hashtag\/image?src=hash&amp;ref_src=twsrc%5Etfw\">#image<\/a> semi transparent you can really quickly achive interesting <a href=\"https:\/\/twitter.com\/hashtag\/design?src=hash&amp;ref_src=twsrc%5Etfw\">#design<\/a> variations <a href=\"https:\/\/twitter.com\/hashtag\/sketch2react?src=hash&amp;ref_src=twsrc%5Etfw\">#sketch2react<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/cardcomponent?src=hash&amp;ref_src=twsrc%5Etfw\">#cardcomponent<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/designtocode?src=hash&amp;ref_src=twsrc%5Etfw\">#designtocode<\/a> <a href=\"https:\/\/twitter.com\/sketch?ref_src=twsrc%5Etfw\">@sketch<\/a> <a href=\"https:\/\/t.co\/D2idMlK4Yz\">pic.twitter.com\/D2idMlK4Yz<\/a><\/p>\n<p>&mdash; Team Sketch2React (@Sketch2R) <a href=\"https:\/\/twitter.com\/Sketch2R\/status\/1113804985060470784?ref_src=twsrc%5Etfw\">April 4, 2019<\/a><\/p><\/blockquote>\n<p><script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>\n<h3>Pro Tip #8 \u2013\u200aUse semi transparent images together with our {BG} component<\/h3>\n<p>A very effective way of getting really interesting imagery effects is to have a {image} on top of a {BG} component and use a bit of transparency on the image. Experiment also with blend modes to get really far out results.<\/p>\n<hr>\n<blockquote class=\"twitter-tweet\" data-width=\"550\" data-dnt=\"true\">\n<p lang=\"en\" dir=\"ltr\">??ProTip! Keep things neat and tidy inside <a href=\"https:\/\/twitter.com\/sketch?ref_src=twsrc%5Etfw\">@sketch<\/a> with <a href=\"https:\/\/twitter.com\/AnimaApp?ref_src=twsrc%5Etfw\">@AnimaApp<\/a> As long as you rename the Stacked Group accordingly it still works in <a href=\"https:\/\/twitter.com\/hashtag\/code?src=hash&amp;ref_src=twsrc%5Etfw\">#code<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/sketch2react?src=hash&amp;ref_src=twsrc%5Etfw\">#sketch2react<\/a> <a href=\"https:\/\/t.co\/3Qj6JeOkZV\">pic.twitter.com\/3Qj6JeOkZV<\/a><\/p>\n<p>&mdash; Team Sketch2React (@Sketch2R) <a href=\"https:\/\/twitter.com\/Sketch2R\/status\/1113701118159224832?ref_src=twsrc%5Etfw\">April 4, 2019<\/a><\/p><\/blockquote>\n<p><script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>\n<h3>Pro Tip #9\u200a\u2014\u200aUse Anima Stacks to keep things\u00a01:1<\/h3>\n<p>Use <a href=\"https:\/\/www.animaapp.com\" target=\"_blank\" rel=\"noopener noreferrer\">Anima Stacks<\/a> to keep things 1:1 between how things look inside of Sketch and how they actually look in code. <strong>Important: <\/strong>This is merely cosmetics for Sketch you still need to match your Stacks settings to those you write with real code (padding, margins, classes etc).<\/p>\n<hr>\n<blockquote class=\"twitter-tweet\" data-width=\"550\" data-dnt=\"true\">\n<p lang=\"en\" dir=\"ltr\">??ProTip! It takes seconds to <a href=\"https:\/\/twitter.com\/hashtag\/customize?src=hash&amp;ref_src=twsrc%5Etfw\">#customize<\/a> your <a href=\"https:\/\/twitter.com\/hashtag\/bootstrap4?src=hash&amp;ref_src=twsrc%5Etfw\">#bootstrap4<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/powered?src=hash&amp;ref_src=twsrc%5Etfw\">#powered<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/navigation?src=hash&amp;ref_src=twsrc%5Etfw\">#navigation<\/a> with some clever uses of <a href=\"https:\/\/twitter.com\/hashtag\/classes?src=hash&amp;ref_src=twsrc%5Etfw\">#classes<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/sketch2react?src=hash&amp;ref_src=twsrc%5Etfw\">#sketch2react<\/a> <a href=\"https:\/\/t.co\/BC0AeMhP1a\">https:\/\/t.co\/BC0AeMhP1a<\/a> <a href=\"https:\/\/twitter.com\/getbootstrap?ref_src=twsrc%5Etfw\">@getbootstrap<\/a> <a href=\"https:\/\/twitter.com\/sketch?ref_src=twsrc%5Etfw\">@sketch<\/a> <a href=\"https:\/\/t.co\/reD7su83Vl\">pic.twitter.com\/reD7su83Vl<\/a><\/p>\n<p>&mdash; Team Sketch2React (@Sketch2R) <a href=\"https:\/\/twitter.com\/Sketch2R\/status\/1111621836943577088?ref_src=twsrc%5Etfw\">March 29, 2019<\/a><\/p><\/blockquote>\n<p><script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>\n<h3>Pro Tip #10\u200a\u2014\u200aExperiment with Bootstrap Classes<\/h3>\n<p>Since we run Bootstrap 4 in the background we support way more things than the components that we support <strong><em>styling inside of Sketch. <\/em><\/strong>Need a <a href=\"https:\/\/getbootstrap.com\/docs\/4.0\/components\/navs\/#vertical\" target=\"_blank\" rel=\"noopener noreferrer\">vertical nav menu<\/a>? Just add<strong> [flex-column]<\/strong> to the {nav} as a class. Do you need a <a href=\"https:\/\/getbootstrap.com\/docs\/4.0\/components\/navs\/#tabs\" target=\"_blank\" rel=\"noopener noreferrer\">tabbed interface<\/a>? Just add <strong>[nav-tabs]<\/strong> to the {nav-item} and your done!<\/p>\n<hr>\n<h3>Bonus Beats!<\/h3>\n<p>Here\u2019s an extra tip for you ? ?<\/p>\n<blockquote class=\"twitter-tweet\" data-width=\"550\" data-dnt=\"true\">\n<p lang=\"en\" dir=\"ltr\">It literally takes seconds to connect <a href=\"https:\/\/twitter.com\/Typekit?ref_src=twsrc%5Etfw\">@Typekit<\/a> <a href=\"https:\/\/twitter.com\/hashtag\/fonts?src=hash&amp;ref_src=twsrc%5Etfw\">#fonts<\/a> to <a href=\"https:\/\/twitter.com\/hashtag\/Sketch2React?src=hash&amp;ref_src=twsrc%5Etfw\">#Sketch2React<\/a> <\/p>\n<p>1\ufe0f\u20e3Copy the url from Typekit<br \/>2\ufe0f\u20e3Paste into {externalasset.css}<br \/>3\ufe0f\u20e3Done! \u2705To be sure ?Check in code <a href=\"https:\/\/twitter.com\/ChromeDevTools?ref_src=twsrc%5Etfw\">@ChromeDevTools<\/a> <\/p>\n<p>??????\u200d???\u200d??<a href=\"https:\/\/twitter.com\/sketch?ref_src=twsrc%5Etfw\">@sketch<\/a> <a href=\"https:\/\/t.co\/awUEZo2RWE\">pic.twitter.com\/awUEZo2RWE<\/a><\/p>\n<p>&mdash; Team Sketch2React (@Sketch2R) <a href=\"https:\/\/twitter.com\/Sketch2R\/status\/1120783334592978950?ref_src=twsrc%5Etfw\">April 23, 2019<\/a><\/p><\/blockquote>\n<p><script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>\n<h3>Pro Tip #11\u200a\u2014\u200aHow to add Adobe Typekit\u00a0fonts<\/h3>\n<p><a href=\"https:\/\/fonts.adobe.com\/typekit\" target=\"_blank\" rel=\"noopener noreferrer\">Adobe Typekit<\/a> is a wonderful resource of fonts if you also have an Adobe CC license. You embed the fonts very similar to how you embed Google Fonts.<\/p>\n<hr>\n<p><em>That\u2019s it folks, have a great easter! Eat many eggs, hunt for easter candy eggs with your kids and have a great one <\/em>?<\/p>\n<p>Juan, <em>Team Sketch2React &amp; Designforventures<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Wooo-pi-do here we go again\u00a0? 10 More Great Sketch2React Tips from the Team????\u200d???\u200d? This is Cold Spring 2019\u00a0Edition Hey and welcome to another round of our very best Skech2React Tips from the team. Let\u2019s go people! The previous one was back in December and the one before that all the way back in time to&hellip;&nbsp;<a href=\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/\" class=\"\" rel=\"bookmark\">Read More &raquo;<span class=\"screen-reader-text\">10 More Great Sketch2React Tips from the Team????\u200d???\u200d?<\/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":[166],"tags":[10,55,9,26],"class_list":["post-84","post","type-post","status-publish","format-standard","hentry","category-tutorials","tag-sketch","tag-sketch2react","tag-tutorial","tag-workflow"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>10 More Great Sketch2React Tips from the Team????\u200d???\u200d? | 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\/10-more-great-sketch2react-tips-from-the-team\ud83e\udd47\ud83d\udcaa\ud83d\udc68\ud83c\udffb\u200d\ud83d\udcbb\ud83d\udc68\ud83c\udffb\u200d\ud83d\udcbb\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"10 More Great Sketch2React Tips from the Team????\u200d???\u200d? - Sketch2React Blog\" \/>\n<meta property=\"og:description\" content=\"Wooo-pi-do here we go again\u00a0? 10 More Great Sketch2React Tips from the Team????\u200d???\u200d? This is Cold Spring 2019\u00a0Edition Hey and welcome to another round of our very best Skech2React Tips from the team. Let\u2019s go people! The previous one was back in December and the one before that all the way back in time to&hellip;&nbsp;Read More &raquo;10 More Great Sketch2React Tips from the Team????\u200d???\u200d?\" \/>\n<meta property=\"og:url\" content=\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team\ud83e\udd47\ud83d\udcaa\ud83d\udc68\ud83c\udffb\u200d\ud83d\udcbb\ud83d\udc68\ud83c\udffb\u200d\ud83d\udcbb\/\" \/>\n<meta property=\"og:site_name\" content=\"Sketch2React Blog\" \/>\n<meta property=\"article:published_time\" content=\"2019-04-15T09:40:34+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-06-18T07:27:00+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*R2x0NwDhACGswDsh_Vj-pQ.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=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/\"},\"author\":{\"name\":\"Juan Maguid\",\"@id\":\"https:\/\/sketch2react.io\/blog\/#\/schema\/person\/7fc8fe20e137be20a66bc8634c059f4e\"},\"headline\":\"10 More Great Sketch2React Tips from the Team????\u200d???\u200d?\",\"datePublished\":\"2019-04-15T09:40:34+00:00\",\"dateModified\":\"2020-06-18T07:27:00+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/\"},\"wordCount\":915,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*R2x0NwDhACGswDsh_Vj-pQ.jpeg\",\"keywords\":[\"Sketch\",\"Sketch2react\",\"Tutorial\",\"Workflow\"],\"articleSection\":[\"Tutorials\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/\",\"url\":\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/\",\"name\":\"10 More Great Sketch2React Tips from the Team????\u200d???\u200d? - Sketch2React Blog\",\"isPartOf\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*R2x0NwDhACGswDsh_Vj-pQ.jpeg\",\"datePublished\":\"2019-04-15T09:40:34+00:00\",\"dateModified\":\"2020-06-18T07:27:00+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#primaryimage\",\"url\":\"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*R2x0NwDhACGswDsh_Vj-pQ.jpeg\",\"contentUrl\":\"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*R2x0NwDhACGswDsh_Vj-pQ.jpeg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/sketch2react.io\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"10 More Great Sketch2React Tips from the Team????\u200d???\u200d?\"}]},{\"@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":"10 More Great Sketch2React Tips from the Team????\u200d???\u200d? | 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\/10-more-great-sketch2react-tips-from-the-team\ud83e\udd47\ud83d\udcaa\ud83d\udc68\ud83c\udffb\u200d\ud83d\udcbb\ud83d\udc68\ud83c\udffb\u200d\ud83d\udcbb\/","og_locale":"en_US","og_type":"article","og_title":"10 More Great Sketch2React Tips from the Team????\u200d???\u200d? - Sketch2React Blog","og_description":"Wooo-pi-do here we go again\u00a0? 10 More Great Sketch2React Tips from the Team????\u200d???\u200d? This is Cold Spring 2019\u00a0Edition Hey and welcome to another round of our very best Skech2React Tips from the team. Let\u2019s go people! The previous one was back in December and the one before that all the way back in time to&hellip;&nbsp;Read More &raquo;10 More Great Sketch2React Tips from the Team????\u200d???\u200d?","og_url":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team\ud83e\udd47\ud83d\udcaa\ud83d\udc68\ud83c\udffb\u200d\ud83d\udcbb\ud83d\udc68\ud83c\udffb\u200d\ud83d\udcbb\/","og_site_name":"Sketch2React Blog","article_published_time":"2019-04-15T09:40:34+00:00","article_modified_time":"2020-06-18T07:27:00+00:00","og_image":[{"url":"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*R2x0NwDhACGswDsh_Vj-pQ.jpeg","type":"","width":"","height":""}],"author":"Juan Maguid","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Juan Maguid","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#article","isPartOf":{"@id":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/"},"author":{"name":"Juan Maguid","@id":"https:\/\/sketch2react.io\/blog\/#\/schema\/person\/7fc8fe20e137be20a66bc8634c059f4e"},"headline":"10 More Great Sketch2React Tips from the Team????\u200d???\u200d?","datePublished":"2019-04-15T09:40:34+00:00","dateModified":"2020-06-18T07:27:00+00:00","mainEntityOfPage":{"@id":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/"},"wordCount":915,"commentCount":0,"publisher":{"@id":"https:\/\/sketch2react.io\/blog\/#organization"},"image":{"@id":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*R2x0NwDhACGswDsh_Vj-pQ.jpeg","keywords":["Sketch","Sketch2react","Tutorial","Workflow"],"articleSection":["Tutorials"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/","url":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/","name":"10 More Great Sketch2React Tips from the Team????\u200d???\u200d? - Sketch2React Blog","isPartOf":{"@id":"https:\/\/sketch2react.io\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#primaryimage"},"image":{"@id":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*R2x0NwDhACGswDsh_Vj-pQ.jpeg","datePublished":"2019-04-15T09:40:34+00:00","dateModified":"2020-06-18T07:27:00+00:00","breadcrumb":{"@id":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#primaryimage","url":"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*R2x0NwDhACGswDsh_Vj-pQ.jpeg","contentUrl":"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*R2x0NwDhACGswDsh_Vj-pQ.jpeg"},{"@type":"BreadcrumbList","@id":"https:\/\/sketch2react.io\/blog\/10-more-great-sketch2react-tips-from-the-team%f0%9f%a5%87%f0%9f%92%aa%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb%f0%9f%91%a8%f0%9f%8f%bb%e2%80%8d%f0%9f%92%bb\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/sketch2react.io\/blog\/"},{"@type":"ListItem","position":2,"name":"10 More Great Sketch2React Tips from the Team????\u200d???\u200d?"}]},{"@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\/84","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=84"}],"version-history":[{"count":1,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/posts\/84\/revisions"}],"predecessor-version":[{"id":330,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/posts\/84\/revisions\/330"}],"wp:attachment":[{"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/media?parent=84"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/categories?post=84"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sketch2react.io\/blog\/wp-json\/wp\/v2\/tags?post=84"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}