{"id":28803,"date":"2016-12-26T23:01:42","date_gmt":"2016-12-26T15:01:42","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=28803"},"modified":"2025-04-21T18:19:44","modified_gmt":"2025-04-21T10:19:44","slug":"designers-developers-monthly-12-2016","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/","title":{"rendered":"Fresh Resources for Web Designers and Developers (December 2016)"},"content":{"rendered":"<p>We are nearing the end of 2016, and it has been a thrilling year for many, including web developers. This year, <strong>ReactJS\u2019s popularity has soared exponentially<\/strong>, with new ReactJS extensions being released and frequently appearing on <strong>GitHub\u2019s trending repositories<\/strong> list.<\/p>\n<p><strong>PHP7 was also released this year<\/strong>, offering significant improvements in speed, along with the release of <strong>WordPress 4.7 featuring the long-awaited WP-API<\/strong> functionality, and <strong>Facebook introduced the Yarn Package<\/strong> that may challenge NPM.<\/p>\n<div class=\"ref-block ref-block--tax noLinks\" id=\"ref-block-tax-28803-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 Here for More Resources\" rel=\"bookmark\"><span class=\"screen-reader-text\">Click Here 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-28803-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 Here for More Resources<\/h4>\n<div class=\"ref-description\">\n<p>Check out our complete collection of hand-picked tools for designers and developers.<\/p>\n<\/div><\/div>\n<\/div>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/GoogleChrome\/lighthouse\">LightHouse<\/a><\/h2>\n<p>LightHouse is a <strong>handy tool from Google<\/strong> to examine your websites against modern web development metrics, which include <strong>page load performance<\/strong>, caching with <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/web.dev\/learn\/pwa\/service-workers\">Service Workers<\/a>, <strong>server time response<\/strong> and so forth. These tools come in two forms, the <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.npmjs.com\/package\/lighthouse-cli\">CLI (Command Line Interface)<\/a> and <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/chrome.google.com\/webstore\/detail\/lighthouse\/blipmdconlkpinefehnmjammfjpmpbjk\">Google Chrome extension<\/a>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"LightHouse\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/lighthouse.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/fusejs.io\/\">FuseJS<\/a><\/h2>\n<p>Fuzzy-search is a type of search completion where it <strong>returns a number possibilities even if it does not exactly match the search arguments<\/strong>. For example, if you search \u2018to\u2019 the resultant may return <code>todo<\/code>, <code>robot<\/code>, and <code>foot<\/code>. This is a <strong>popular search performance<\/strong> in today\u2019s web applications. FuseJS is a <strong>lightweight JavaScript library<\/strong> that allows you to implement it on your website easily.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"FuseJS\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/fusejs.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/yarnpkg\/yarn\">Yarn Package<\/a><\/h2>\n<p>Yarn is a <strong>Node package manager built by Facebook<\/strong>. It basically performs similar to <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.npmjs.com\/\">NPM<\/a> albeit with advancements in several areas such as speeds, <strong>\u2018offline mode\u2019 which allows you to install the packages without connecting to the Internet<\/strong>, and security as well as reliability.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Yarn Package\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/yarnpkg.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/inpsyde\/menu-cache\">Menu Cache<\/a><\/h2>\n<p>A handy WordPress plugin <strong>to cache WordPress Menu<\/strong> using <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/codex.wordpress.org\/Transients_API\">Transient API<\/a> to improve database query speed. The plugin comes with a number of <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/codex.wordpress.org\/Plugin_API\">Filters<\/a> to <strong>customize the caching period<\/strong> and perform other stuff. It can be installed using <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/getcomposer.org\/\">Composer<\/a> or as a <strong>regular WordPress plugin<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Menu Cache\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/menu-cache.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/kamranahmedse\/githunt\">Githunt<\/a><\/h2>\n<p>Githunt is a Google Chrome extension that <strong>replaces Chrome homepage with Github trending repository<\/strong>. You can sort the result out based on the period and the programming language. It is, I think, <strong>a must-install utility<\/strong> for every developer to stay updated with the shiniest tools around.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Githunt\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/githunt.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/giuseppeg\/ffocus\">FFocus<\/a><\/h2>\n<p>Can\u2019t focus on your work and want to get your job done quickly? Try FFocus. It is <strong>a CLI that allows you to block website for a set duration through Terminal<\/strong>. FFocus can be <strong>installed through NPM<\/strong> by running the <code>npm i ffocus -g<\/code> command.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"FFocus\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/ffocus.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/accesslint\/accesslint.js\">Accesslint<\/a><\/h2>\n<p>AccesslintJS is a <strong>JavaScript library to validate your website<\/strong> for <a href=\"https:\/\/www.hongkiat.com\/blog\/accessibility-design-needs\/\">accessibility<\/a>. Using this library is as easy as loading it before the <code>&lt;\/body&gt;<\/code> tag, and you will get <strong>all the warnings and errors<\/strong> right at the <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/developer.chrome.com\/docs\/devtools\/console\">DevTools Console<\/a>.<\/p>\n<p class=\"recommended_top\"><strong>Recommended:<\/strong> <a href=\"https:\/\/www.hongkiat.com\/blog\/accessibility-design-needs\/\">How to Design For People With Accessibility Needs<\/a><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Accesslint\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/accesslint.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/colorable.jxnblk.com\/\">Colorable<\/a><\/h2>\n<p>Colorable is a <strong>handy web application<\/strong> that allows you to generate color combination that complies with <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/webaim.org\/blog\/wcag-2-0-and-link-colors\/\">WCAG Guidelines<\/a>, and also makes your website <strong>accesible to users with a visual impairment<\/strong> like color blindness.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Colorable\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/colorable.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/xtoolkit.github.io\/Micon\/\">Micon<\/a><\/h2>\n<p>Micon is a <strong>font icon of selected Microsoft Windows 10 pictographics<\/strong>. This can be a <strong>great replacement of FontAwesome<\/strong> which I think is already overused.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Micon\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/micon.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/cssreference.io\/\">CSS Reference<\/a><\/h2>\n<p>The name says it all. It is <strong>a CSS Reference to look up CSS syntax<\/strong>. It is also presented in a nice pleasant way which make it a <strong>great alternative for <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/CSS\">CSS documentation at MDN<\/a><\/strong>, if you think it\u2019s too boring.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"CSS Reference\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/cssreference.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/local.getflywheel.com\">Local by Flywheel<\/a><\/h2>\n<p>This is <strong>GUI App that makes setting up a local WordPress website in your macOS so easy<\/strong>. The app is jam-packed with great utilities for developers, such as; <strong>\u201cOne-click\u201d WordPress installation<\/strong>, SSH access, easy SSL setup, site blueprint, and XIP.io. The app was priced at around 149USD, but is <strong>now given for free ever since acquired by Flywheel<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Local by Flywheel\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/local.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.freecodecamp.com\/\">FreeCodeCamp<\/a><\/h2>\n<p>It is a <strong>free resource to learn code for the Web<\/strong>. The subjects include HTML, CSS, JavaScript, and a <strong>few libraries like ReactJS and D3<\/strong>. It provides <strong>challenges or project examples<\/strong> while you are taking the courses, as well as tutorials to <strong>help you comprehend the subject better<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"FreeCodeCamp\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/freecodecamp.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/overpassfont.org\/\">OverPass Font<\/a><\/h2>\n<p>OverPass font is a font family consisting of <strong>eight weights (200-900), true italic, and monospace typeface<\/strong>. The font can be loaded as a web font <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/overpass-30e2.kxcdn.com\/overpass.css\">from KeyCDN<\/a> as well as <strong>installed for Desktop use<\/strong>. It is free and <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/RedHatOfficial\/Overpass\">open source<\/a>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"OverPass Font\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/overpass.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/electerious\/formbase\">Form Base<\/a><\/h2>\n<p>Form base is a <strong>set of CSS style rules<\/strong> that reset form elements which include <code>input<\/code>, <code>checkbox<\/code>, <code>select<\/code>, and <code>textarea<\/code> <strong>with basic yet beatiful styles<\/strong>. This CSS library is a good <strong>use in conjunction with another \u201cCSS resetter\u201d<\/strong> like <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/necolas.github.io\/normalize.css\/\">Normalize.css<\/a>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Form Base\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/formbase.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/24ways\/frontend\">FrontEnd<\/a><\/h2>\n<p>it is a framwork that is used to build <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/24ways.org\/\">24ways.org<\/a>; <strong>a great resource<\/strong> that you may look into <strong>to learn advanced CSS techniques<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"FrontEnd\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/24ways.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/FormidableLabs\/victory\">Victory<\/a><\/h2>\n<p>ReactJS is on the rise, and with that comes <strong>a great number of extensions to support it<\/strong>. Victory is a <strong>ReactJS component<\/strong> to add intercative and charts or data visualization.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Victory\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/victory.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/infernojs\/inferno\">Inferno<\/a><\/h2>\n<p>Inferno is a <strong>JavaScript library to build web interface on mobile devices<\/strong>. It is <strong>inspired from ReactJS<\/strong> hence inherts similar syntax conventions. The difference, however, is that Inferno is <strong>built with performance in-mind<\/strong> which makes it <strong>much smaller in size<\/strong> and also gives it a <strong>faster rendering time<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Inferno\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/inferno.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/mathisonian.github.io\/premonish\/\">Premonish<\/a><\/h2>\n<p>Permonish is library that is able to <strong>predict users\u2019 next interaction<\/strong>. This will allow you to <strong>prepare the user interface (UI) more perfectly<\/strong> before the actual user interacts with your website.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Premonish\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/premonish.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/codecasts\/spa-starter-kit\">SPA Starter Kit<\/a><\/h2>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"SPA Starter Kit\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/vue-laravel-spa.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/egoist\/docute\">Docute<\/a><\/h2>\n<p>Docute is <strong>JavaScript library for building a single page documentation<\/strong>. It is powered with VueJS and shipped with a number of Node utilities that allow you <strong>set up and run your documentation quickly<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Docute\" height=\"430\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/docute.jpg\" width=\"750\"><\/figure>\n<hr>\n<p class=\"recommended_top\">\n\t\t\t\t\t<strong>Read Also:<\/strong>\u00a0\n\t\t\t\t\t<a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/5-tips-to-simplify-your-web-design\/\">5 Tips to Simplify Your Web Design<\/a>\n\t\t\t\t<\/p>","protected":false},"excerpt":{"rendered":"<p>We are nearing the end of 2016, and it has been a thrilling year for many, including web developers. This year, ReactJS\u2019s popularity has soared exponentially, with new ReactJS extensions being released and frequently appearing on GitHub\u2019s trending repositories list. PHP7 was also released this year, offering significant improvements in speed, along with the release&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.5) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Fresh Resources for Web Designers and Developers (December 2016) - Hongkiat<\/title>\n<meta name=\"description\" content=\"We are nearing the end of 2016, and it has been a thrilling year for many, including web developers. This year, ReactJS&#039;s popularity has soared\" \/>\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\/designers-developers-monthly-12-2016\/\" \/>\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 (December 2016)\" \/>\n<meta property=\"og:description\" content=\"We are nearing the end of 2016, and it has been a thrilling year for many, including web developers. This year, ReactJS&#039;s popularity has soared\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/\" \/>\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=\"2016-12-26T15:01:42+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-21T10:19:44+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/lighthouse.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=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"Fresh Resources for Web Designers and Developers (December 2016)\",\"datePublished\":\"2016-12-26T15:01:42+00:00\",\"dateModified\":\"2025-04-21T10:19:44+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/\"},\"wordCount\":914,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-12-2016\\\/lighthouse.jpg\",\"keywords\":[\"Tools for Designers &amp; Developers\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/\",\"name\":\"Fresh Resources for Web Designers and Developers (December 2016) - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-12-2016\\\/lighthouse.jpg\",\"datePublished\":\"2016-12-26T15:01:42+00:00\",\"dateModified\":\"2025-04-21T10:19:44+00:00\",\"description\":\"We are nearing the end of 2016, and it has been a thrilling year for many, including web developers. This year, ReactJS's popularity has soared\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-12-2016\\\/lighthouse.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-12-2016\\\/lighthouse.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2016\\\/#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 (December 2016)\"}]},{\"@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 (December 2016) - Hongkiat","description":"We are nearing the end of 2016, and it has been a thrilling year for many, including web developers. This year, ReactJS's popularity has soared","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\/designers-developers-monthly-12-2016\/","og_locale":"en_US","og_type":"article","og_title":"Fresh Resources for Web Designers and Developers (December 2016)","og_description":"We are nearing the end of 2016, and it has been a thrilling year for many, including web developers. This year, ReactJS's popularity has soared","og_url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2016-12-26T15:01:42+00:00","article_modified_time":"2025-04-21T10:19:44+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/lighthouse.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":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"Fresh Resources for Web Designers and Developers (December 2016)","datePublished":"2016-12-26T15:01:42+00:00","dateModified":"2025-04-21T10:19:44+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/"},"wordCount":914,"commentCount":1,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/lighthouse.jpg","keywords":["Tools for Designers &amp; Developers"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/","url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/","name":"Fresh Resources for Web Designers and Developers (December 2016) - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/lighthouse.jpg","datePublished":"2016-12-26T15:01:42+00:00","dateModified":"2025-04-21T10:19:44+00:00","description":"We are nearing the end of 2016, and it has been a thrilling year for many, including web developers. This year, ReactJS's popularity has soared","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/lighthouse.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2016\/lighthouse.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2016\/#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 (December 2016)"}]},{"@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-7uz","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/28803","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=28803"}],"version-history":[{"count":4,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/28803\/revisions"}],"predecessor-version":[{"id":73912,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/28803\/revisions\/73912"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=28803"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=28803"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=28803"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=28803"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}