{"id":29023,"date":"2017-01-24T21:01:26","date_gmt":"2017-01-24T13:01:26","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=29023"},"modified":"2022-08-02T17:56:49","modified_gmt":"2022-08-02T09:56:49","slug":"fresh-resources-for-web-developers-january-2017","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/","title":{"rendered":"Fresh Resources for Web Designers and Developers (January 2017)"},"content":{"rendered":"<p>This series has come a long way through which we have witnessed <strong>web development tools come and go<\/strong>; one time they shine, a few months later they are made obsolete with other latest tools. Nonetheless, we have some fresh tools on the list for our developers to explore this month which include <strong>JavaScript libraries, a Sketch plugin for responsive UI design<\/strong>, and a couple of CSS frameworks.<\/p>\n<div class=\"ref-block ref-block--tax noLinks\" id=\"ref-block-tax-29023-1\">\n\t\t<a href=\"https:\/\/www.hongkiat.com\/blog\/tag\/fresh-resources-developers\/\" target=\"_blank\" class=\"ref-block__link\" title=\"Read More: Click for More Resources\" rel=\"bookmark\"><span class=\"screen-reader-text\">Click for More Resources<\/span><\/a>\n<div class=\"ref-block__thumbnail img-thumb img-thumb--jumbo\" data-img='{ \"src\" : \"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/related\/tag-fresh-resources-developers.jpg\" }'>\n\t\t\t<noscript>\n<style>.no-js #ref-block-tax-29023-1 .ref-block__thumbnail {\n\t\t\t\t\tbackground-image: url( \"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/related\/tag-fresh-resources-developers.jpg\" );\n\t\t\t\t}<\/style>\n<p>\t\t\t<\/p><\/noscript>\n\t\t<\/div>\n<div class=\"ref-block__summary\">\n<h4 class=\"ref-title\">Click for More Resources<\/h4>\n<div class=\"ref-description\">\n<p>Find our entire collection of recommended resources and the best web design and development tools available.<\/p>\n<\/div><\/div>\n<\/div>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/luisvinicius167\/ityped\">iTyped<\/a><\/h2>\n<p>A JavaScript <strong>library that allows you to present <em>typing<\/em> effects of a list of text<\/strong>; a kind of effect that you might have seen on the web lately. This JavaScript library is <strong>easy to implement with a handful of options to customize the effect<\/strong>. You can install this library thru <a href=\"https:\/\/www.npmjs.com\/package\/ityped\" rel=\"nofollow\">NPM<\/a> or load it via the CDN at <code>https:\/\/unpkg.com\/ityped@0.0.7<\/code>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/ityped.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/opera-neon\/\" rel=\"noopener\">Opera Neon<\/a><\/h2>\n<p>Opera used to be the first to introduce tab-based browser, and since then we have <strong>browsers with so-called Tabs and Speed Dial<\/strong>. Opera has recently released its new initiative, named Opera Neon. A new browser with fresher interface such as so-called <strong>omnibox, split-screen mode, and beautiful wallpaper<\/strong> selections. So, can Opera Neon change the browser space once again? This we\u2019ll have to see.<\/p>\n<figure><a href=\"https:\/\/www.hongkiat.com\/blog\/opera-neon\/\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/opera-neon.jpg\" alt=\"\" width=\"750\" height=\"469\"><\/a><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/ichord\/At.js\">At.js<\/a><\/h2>\n<p>At.js is JavaScript library that allows you to <strong>add smileys, mention friends, or tagging<\/strong>; something like we have seen on Slack, Twitter, and Facebook. This plugin requires jQuery, which allows it to <strong>work on Internet Explorer 7<\/strong> and perhaps <strong>Internet Explore 6 too<\/strong>. Fantastic!<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/atjs.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/vercel\/release\">Release<\/a><\/h2>\n<p>Release makes <strong>creating a new version release of a software in Github<\/strong> more efficient. A new release is usually accompanied with a changelog, and this module <strong>allows you to populate the changelog<\/strong> automatically derived from the Git commit messages.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/release.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/prettier\/prettier\">Prettier<\/a><\/h2>\n<p>A JavaScript <em>beautifier<\/em> <strong>ensuring our JavaScript code is formatted in a consistent way<\/strong>. It supports ES2017 and JSX.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/prettier.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/dempfi\/ayu\">Ayu<\/a><\/h2>\n<p>Ayu is <strong>Sublime Text theme with a fresh and modern appeal<\/strong>. It comes with 2 tones dark and light. Ayu means beautiful in Indonesia, and so to speak; it <strong>makes Sublime Text UI more beautiful<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/ayu.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/wellsjo\/JSON-Splora\">JSON Splora<\/a><\/h2>\n<p>A <strong>lightweight application for editing, and visualizing JSON data<\/strong>. The app compatible with Windows, Linux, and MacOS.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/json-splora.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/kingdido999\/zooming\">Zooming<\/a><\/h2>\n<p>A JavaScript to zoom image gracefully. <strong>Optimized for mobile, works nicely in the hi-def screen, and is easily customizable<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/zooming.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/terkelg\/ramme\">Ramme<\/a><\/h2>\n<p>Ramme is an <strong>Instagram desktop client<\/strong>. Though it is unofficial, but maybe you can learn a couple of <strong>new things from the source code<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/ramme.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/dannyvankooten\/change-username\">Change Username<\/a><\/h2>\n<p>A WordPress plugin that once activated, <strong>adds a \u201cchange\u201d link<\/strong> beside the username input and <strong>allows you to change the username<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/change-username.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/10up\/nodeifywp\">NodeifyWP<\/a><\/h2>\n<p>NodeifyWP is a quite unique WordPress plugin. It allows you to use WordPress as usual then <strong>output the content using a Node.js module<\/strong>. I haven\u2019t yet tried this plugin on any project. But the presentation I saw in WordCamp Denpasar 2016, <strong>this plugin looks very promising to modernize WordPress development<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/nodeify.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/colorme.io\/\">ColorMe<\/a><\/h2>\n<p>ColorMe is quite unlike other color generator apps that I\u2019ve seen before. Aside from generating color codes, the app also gives <strong>control over adjusting the color brightness, shade, hue, saturation, contrast, etc<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/colorme.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/wp-cli.org\/package-index\/\">WP-CLI Packages<\/a><\/h2>\n<p>A <strong>collection of extensions of WP-CLI<\/strong> that adds extra command lines and parameters to perform additional tasks such as one for <strong>deploying WordPress to remote server, migrating a WordPress site, flushing caches<\/strong>, and a lot more.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/wp-cli-packages.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/wordpress.org\/plugins\/tailor\/\">Tailor Page Builder<\/a><\/h2>\n<p>A WordPress plugin that enables you to <strong>create non-linear content with a drag-n-drop interface<\/strong>. The plugin is extensible for a new component to add unique content type. <strong>It provides WP-API to manage these content as well<\/strong>. Tailor Page Builder is by far the best plugin on this category.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/tailor-page-builder.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/xvg.now.sh\/\">XVG<\/a><\/h2>\n<p>XVG is a Chrome extension that <strong>displays SVG graphic outlines and anchors<\/strong> that can help you to debug the SVG objects easily.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/xvg.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/git.hust.cc\/ribbon.js\/\">RibbonJS<\/a><\/h2>\n<p>RibbonJS is a JavaScript library that enables you to <strong>generate decorative ribbons on your website<\/strong>, as you can see the following screenshot. It is just 1kb in size, and <strong>easy to customize<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/ribbonjs.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/animaapp.github.io\/Auto-Layout\/\">Auto Layout<\/a><\/h2>\n<p>Auto-Layout is a <strong>Sketch plugin that provides a number of preset screen sizes to test your UI design<\/strong>. So you can assure the design looks equally good whether it is viewed on iPhone 5, iPhone 6, etc. The plugin also allows you to <strong>define custom sizes in case it is not available in the preset<\/strong>. See how the plugin in action <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.youtube.com\/watch?v=v393LgriWCs\">in this video<\/a>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/auto-layout.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/funcssion.com\/\">Funcssions<\/a><\/h2>\n<p>Funcssion is a <strong>collection of CSS classes<\/strong> that follows <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/en.wikipedia.org\/wiki\/Pure_function\">Pure Function<\/a> principle. Each CSS class defines a single purpose of styling. This CSS Framework is currently a work in progress with more features to introduce in the future such as <strong>responsive Grid, Buttons, etc<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/funcssion.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/webslides.tv\/\">Webslides<\/a><\/h2>\n<p>A lightweight and <strong>easy to use framework to build presentation slides<\/strong> using just HTML and CSS. Webslides currently provides a couple of nice <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/webslides.tv\/demos\/\">slide templates<\/a> where you can <strong>start your slide presentation immediately<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/webslides.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/resilientwebdesign.com\/\">Resilient Web Design<\/a><\/h2>\n<p>Resilient Web Design is an online book. This book is nothing technical, instead, it covers <strong>histories, principles, and inventions that shape the Web<\/strong> as we know in today\u2019s world. I think it is a great read for the weekend.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/resilientwebdesign.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>","protected":false},"excerpt":{"rendered":"<p>This series has come a long way through which we have witnessed web development tools come and go; one time they shine, a few months later they are made obsolete with other latest tools. Nonetheless, we have some fresh tools on the list for our developers to explore this month which include JavaScript libraries, a&hellip;<\/p>\n","protected":false},"author":113,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[352],"tags":[2539],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.8 (Yoast SEO v27.6) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Fresh Resources for Web Designers and Developers (January 2017) - Hongkiat<\/title>\n<meta name=\"description\" content=\"This series has come a long way through which we have witnessed web development tools come and go; one time they shine, a few months later they are made\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Fresh Resources for Web Designers and Developers (January 2017)\" \/>\n<meta property=\"og:description\" content=\"This series has come a long way through which we have witnessed web development tools come and go; one time they shine, a few months later they are made\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2017-01-24T13:01:26+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-08-02T09:56:49+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/ityped.jpg\" \/>\n<meta name=\"author\" content=\"Thoriq Firdaus\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@tfirdaus\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Thoriq Firdaus\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"Fresh Resources for Web Designers and Developers (January 2017)\",\"datePublished\":\"2017-01-24T13:01:26+00:00\",\"dateModified\":\"2022-08-02T09:56:49+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/\"},\"wordCount\":873,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-01-2017\\\/ityped.jpg\",\"keywords\":[\"Tools for Designers &amp; Developers\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/\",\"name\":\"Fresh Resources for Web Designers and Developers (January 2017) - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-01-2017\\\/ityped.jpg\",\"datePublished\":\"2017-01-24T13:01:26+00:00\",\"dateModified\":\"2022-08-02T09:56:49+00:00\",\"description\":\"This series has come a long way through which we have witnessed web development tools come and go; one time they shine, a few months later they are made\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-01-2017\\\/ityped.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-01-2017\\\/ityped.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/fresh-resources-for-web-developers-january-2017\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Fresh Resources for Web Designers and Developers (January 2017)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\",\"name\":\"Thoriq Firdaus\",\"description\":\"Thoriq is a writer for Hongkiat.com with a passion for web design and development. He is the author of Responsive Web Design by Examples, where he covered his best approaches in developing responsive websites quickly with a framework.\",\"sameAs\":[\"https:\\\/\\\/thoriq.com\",\"https:\\\/\\\/x.com\\\/tfirdaus\"],\"jobTitle\":\"Web Developer\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/thoriq\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Fresh Resources for Web Designers and Developers (January 2017) - Hongkiat","description":"This series has come a long way through which we have witnessed web development tools come and go; one time they shine, a few months later they are made","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:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/","og_locale":"en_US","og_type":"article","og_title":"Fresh Resources for Web Designers and Developers (January 2017)","og_description":"This series has come a long way through which we have witnessed web development tools come and go; one time they shine, a few months later they are made","og_url":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2017-01-24T13:01:26+00:00","article_modified_time":"2022-08-02T09:56:49+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/ityped.jpg","type":"","width":"","height":""}],"author":"Thoriq Firdaus","twitter_card":"summary_large_image","twitter_creator":"@tfirdaus","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Thoriq Firdaus","Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"Fresh Resources for Web Designers and Developers (January 2017)","datePublished":"2017-01-24T13:01:26+00:00","dateModified":"2022-08-02T09:56:49+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/"},"wordCount":873,"commentCount":1,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/ityped.jpg","keywords":["Tools for Designers &amp; Developers"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/","url":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/","name":"Fresh Resources for Web Designers and Developers (January 2017) - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/ityped.jpg","datePublished":"2017-01-24T13:01:26+00:00","dateModified":"2022-08-02T09:56:49+00:00","description":"This series has come a long way through which we have witnessed web development tools come and go; one time they shine, a few months later they are made","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/ityped.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2017\/ityped.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/fresh-resources-for-web-developers-january-2017\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Fresh Resources for Web Designers and Developers (January 2017)"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807","name":"Thoriq Firdaus","description":"Thoriq is a writer for Hongkiat.com with a passion for web design and development. He is the author of Responsive Web Design by Examples, where he covered his best approaches in developing responsive websites quickly with a framework.","sameAs":["https:\/\/thoriq.com","https:\/\/x.com\/tfirdaus"],"jobTitle":"Web Developer","url":"https:\/\/www.hongkiat.com\/blog\/author\/thoriq\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-7y7","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/29023","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/113"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=29023"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/29023\/revisions"}],"predecessor-version":[{"id":61026,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/29023\/revisions\/61026"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=29023"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=29023"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=29023"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=29023"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}