Jonathan Suhhttps://jonsuh.com/icon.png2018-08-20T08:02:26-05:00https://jonsuh.com/blog/feed.xmlAnimated Toggle in React Native2018-08-20T06:00:00-05:002018-08-20T06:00:00-05:00
Animating elements in React Native isn’t as straight forward as you may expect—you can’t animate with vanilla CSS in React Native. Let’s explore the `Animated` library to achieve the results of CSS transitions and transforms, and use it to create an animated toggle component. <p><a href="https://jonsuh.com/blog/animated-toggle-react-native/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/animated-toggle-react-native/Jonathan SuhSlow Down—You Need It2017-11-03T06:00:00-05:002017-11-03T06:00:00-05:00
Workaholism is too often synonymized with productivity when it couldn’t be further from the truth. <p><a href="https://jonsuh.com/blog/slow-down-you-need-it/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/slow-down-you-need-it/Jonathan SuhJavaScript Templating Without a Library2015-11-13T06:00:00-06:002015-11-13T06:00:00-06:00
<p><img alt="" src="https://jonsuh.com/assets/images/blog/javascript-templating-without-a-library/share.png"/></p>
<p>You may have heard of or even used JavaScript templating engines such as <a href="http://handlebarsjs.com/">Handlebars.js</a>, <a href="https://github.com/janl/mustache.js/">Mustache.js</a> or <a href="http://underscorejs.org/">Underscore.js</a>. They can make rendering and updating dynamic content on your website a breeze, but if your needs are dead simple, you might not need a library.</p>
<p><a href="https://jonsuh.com/blog/javascript-templating-without-a-library/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/javascript-templating-without-a-library/Jonathan SuhThe Story Behind “100 Days of Scriptures”2015-10-29T06:00:00-05:002015-10-29T06:00:00-05:00
<p><img alt="" src="https://jonsuh.com/assets/images/blog/the-story-behind-100-days-of-scriptures/share.jpg?v2"/></p>
<p>Since starting <a href="/100-days-of-scriptures/">100 Days of Scriptures</a>, several people have asked me about it. Now that it’s come to an end, I’d like to share its story, the process, lessons learned, and the effect its had on me.</p>
<p><a href="https://jonsuh.com/blog/the-story-behind-100-days-of-scriptures/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/the-story-behind-100-days-of-scriptures/Jonathan SuhUgmonk Waxed Canvas Messenger Bag Review2015-10-05T06:00:00-05:002015-10-05T06:00:00-05:00
<p><img alt="" src="https://c1.staticflickr.com/1/587/21843146625_aae5cc15b3_c.jpg"/></p>
<p>I spent several weeks of scouring the web and reading gobs of sites and reviews in search for the right laptop messenger bag before pulling the trigger on the <a href="http://shop.ugmonk.com/collections/lifestyle-bags">Ugmonk Messenger Bag</a>. After 4 months of using it daily and putting it through its paces, I’m here to tell you that it was worth the investment.</p>
<p><a href="https://jonsuh.com/blog/ugmonk-messenger-bag/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/ugmonk-messenger-bag/Jonathan SuhIntegrating React with gulp2015-09-29T08:00:00-05:002015-09-29T08:00:00-05:00
<p><img alt="" src="https://jonsuh.com/assets/images/blog/integrating-react-with-gulp/share.png"/></p>
<p><em>Note: This post was updated to (1) accommodate the change in React 0.14 where they split up React into a core library and a DOM adapter (ReactDOM) and (2) remove Bower in favor of npm.</em></p>
<p>I’ve been learning <a href="https://facebook.github.io/react">React</a>, a JavaScript library by Facebook for building user interfaces, for the past few days during my commute—it’s been challenging, but a lot of fun. After a couple of days of learning the basics (reading their <a href="https://facebook.github.io/react/docs/getting-started.html">Getting Started</a> introduction to React and following their <a href="https://facebook.github.io/react/docs/tutorial.html">tutorial</a>), I reconfigured my <code class="highlighter-rouge">gulpfile.js</code> to include React in my local development environment.</p>
<p><a href="https://jonsuh.com/blog/integrating-react-with-gulp/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/integrating-react-with-gulp/Jonathan SuhAugust Connect Review2015-05-26T22:00:00-05:002015-05-26T22:00:00-05:00
<p><img alt="" src="https://farm8.staticflickr.com/7796/17953759288_37f3ed367b_c.jpg"/></p>
<p>August Connect is a device that allows you to remotely connect to and control the <a href="/blog/august-smart-lock/">August Smart Lock</a>. It bridges your Wi-Fi connection and August Smart Lock’s Bluetooth connection. Without it, you can only connect to the August Smart Lock via Bluetooth. I’ve been using the August Connect with my August Smart Lock for 3 months now, and here’s my review.</p>
<p><a href="https://jonsuh.com/blog/august-connect/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/august-connect/Jonathan SuhManaging Responsive Breakpoints with Sass Maps2015-05-13T00:20:00-05:002015-05-13T00:20:00-05:00
<p><a href="/blog/sass-maps/">Sass maps</a> are handy for organizing values used repeatedly throughout a project (e.g. <a href="/blog/sass-maps/#loops-and-maps">colors</a>, <a href="/blog/organizing-z-index-with-sass/">z-index values</a>). They can also help manage responsive breakpoints, and, with the help of a custom mixin, even make generating media queries a breeze.</p>
<p><a href="https://jonsuh.com/blog/managing-responsive-breakpoints-with-sass-maps/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/managing-responsive-breakpoints-with-sass-maps/Jonathan SuhNeed for Speed 2: Improving Front-End Performance2015-04-22T05:00:00-05:002015-04-22T05:00:00-05:00
<p><img alt="" src="https://jonsuh.com/assets/images/blog/need-for-speed-2/unoptimized-vs-optimized.png"/></p>
<p>Last year I wrote a post, <a href="/blog/need-for-speed/">Need for Speed</a>, where I shared my workflows and techniques along with the tools involved in the development of my site. Since then my site has gone through another redesign, and although I made various workflow and server-side improvements, I gave front-end performance extra attention. Here’s what I did, why I did it, and the tools I used to optimize front-end performance on my site.</p>
<p><a href="https://jonsuh.com/blog/need-for-speed-2/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/need-for-speed-2/Jonathan SuhFaster Font Loading with Font Events2015-03-28T01:30:00-05:002015-03-28T01:30:00-05:00
<p><img alt="" src="https://jonsuh.com/assets/images/blog/font-loading-with-font-events/foit-solved.jpg"/></p>
<p>Web fonts are great and make the web a more beautiful space; however, loading them can be slow, which results in an unwanted side effect: FOIT (Flash of Invisible Text). I’ve experienced FOIT on my website, particular on mobile connections, but with the help of some homework and fantastic resources, plus some JavaScript and CSS, I managed to fix it.</p>
<p><a href="https://jonsuh.com/blog/font-loading-with-font-events/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/font-loading-with-font-events/Jonathan SuhCanary All-in-One Home Security Device Review2015-03-25T17:30:00-05:002015-03-25T17:30:00-05:00
<p><img alt="" src="https://farm9.staticflickr.com/8629/16277701766_ffb6d14c7a_c.jpg"/></p>
<p>Canary is an all-in-one home security device that’ll watch your home and make sure everything is OK. It’s packed with features like motion detection and video recording, temperature and air-quality sensors, and remote access to control it, see recorded videos, and watch live.</p>
<p><a href="https://jonsuh.com/blog/canary-home-security-device/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/canary-home-security-device/Jonathan SuhEnhance Google Search Results with Rich Snippets2015-03-20T10:00:00-05:002015-03-20T10:00:00-05:00
<p><img alt="" src="https://jonsuh.com/assets/images/blog/enhance-google-search-results-rich-snippets/search-result.png"/></p>
<p>Allow Google to create and provide rich snippets—detailed, relevant information for users based on their search queries, such as the average rating of a product or restaurant, or preparation time and rating of a recipe.</p>
<p><a href="https://jonsuh.com/blog/enhance-google-search-results-rich-snippets/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/enhance-google-search-results-rich-snippets/Jonathan SuhGit Command-Line Shortcuts2015-02-13T08:00:00-06:002015-02-13T08:00:00-06:00
<p><img alt="" src="https://jonsuh.com/assets/images/blog/git-command-line-shortcuts/git-log-graph.gif"/></p>
<p>A lot of my time is spent in Terminal and a majority of it is spent typing Git commands. I created a set of keyboard shortcuts with Bash aliases and functions to speed up my workflow and save me hundreds of keystrokes every day.</p>
<p><a href="https://jonsuh.com/blog/git-command-line-shortcuts/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/git-command-line-shortcuts/Jonathan SuhTerminal/Bash Command-Line Shortcuts with Aliases2015-02-12T16:30:00-06:002015-02-12T16:30:00-06:00
<p>Keystrokes are valuable especially if you live in the command line, and thankfully Bash (Terminal’s default command-line interpreter) allows you to create shortcuts using aliases.</p>
<p><a href="https://jonsuh.com/blog/bash-command-line-shortcuts/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/bash-command-line-shortcuts/Jonathan SuhResponsible Social Share Links2015-02-01T08:00:00-06:002015-02-01T08:00:00-06:00
<p>Social share scripts are convenient and easy to copy & paste but rely on JavaScript and add additional overhead to your site, which means more HTTP requests and slower load times. Instead, use share links that don’t require you to load scripts for each social site.</p>
<p><a href="https://jonsuh.com/blog/social-share-links/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/social-share-links/Jonathan SuhFinding the Right Development Tools2015-01-27T10:00:00-06:002015-01-27T10:00:00-06:00
<p>Modern web development is rich with an endless stream of new technologies, frameworks, tools and resources available at our fingertips. With new tools becoming available seemingly every day, it’s easy to dive in and get lost in trying them out, but once you’ve found the right ones, there’s a lot of value in developing consistency and sticking with what works.</p>
<p><a href="https://jonsuh.com/blog/finding-the-right-development-tools/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/finding-the-right-development-tools/Jonathan SuhAugust Smart Lock Review2015-01-19T09:17:00-06:002015-01-19T09:17:00-06:00
<p><img alt="" src="https://farm8.staticflickr.com/7503/16117739367_d99ab6ace8_c.jpg"/></p>
<p>Spend less time fiddling with keys when unlocking your door; instead, unlock your door with an app on your smartphone; better yet, have it unlock as you’re walking up to it. August Smart Locks allows you to do just that. Well… sometimes.</p>
<p><a href="https://jonsuh.com/blog/august-smart-lock/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/august-smart-lock/Jonathan SuhMujjo Leather Wallet Case for iPhone 6 Review2015-01-16T09:17:00-06:002015-01-16T09:17:00-06:00
<p><img alt="" src="https://farm9.staticflickr.com/8612/16108648579_f1bce4940b_c.jpg"/></p>
<p>Couple iPhone 6’s Apple Pay and Mujjo’s Leather Wallet Case together, and you’ll find yourself carrying fewer cards. Not only is the case functional, but it’s also pretty—it’s bound to catch eyes and start conversations.</p>
<p><a href="https://jonsuh.com/blog/mujjo-leather-wallet-case-iphone-6/"><b>Continue reading</b></a></p>https://jonsuh.com/blog/mujjo-leather-wallet-case-iphone-6/Jonathan Suh