{"id":49085,"date":"2019-12-03T21:25:47","date_gmt":"2019-12-03T13:25:47","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=49085"},"modified":"2025-04-21T19:46:46","modified_gmt":"2025-04-21T11:46:46","slug":"designers-developers-monthly-12-2019","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/","title":{"rendered":"Fresh Resources for Web Designers and Developers (December 2019)"},"content":{"rendered":"<p>Time flies. We are nearing the end of a decade. Nonetheless, we continue to share valuable resources with our fellow web developers. In this installment of our series, we have carefully curated some tools, a handful of JavaScript libraries, and a couple of new CMS platforms. Without further ado, let\u2019s explore the complete list below.<\/p>\n<div class=\"ref-block ref-block--tax noLinks\" id=\"ref-block-tax-49085-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-49085-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\/muhammed\/vue-interactive-paycard\">Vue.js Interactive Paycard<\/a><\/h2>\n<p>A Vue.js library that allows you to build UI for credit card input form. As you type in the input, it can immediately identify the type of your card whether it\u2019s Visa, MasterCard, or Amex. It looks fancy and quite smart.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Vue Interactive Paycard\" height=\"480\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/vue-interactive-paycard.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.keystonejs.com\">KeystoneJS<\/a><\/h2>\n<p>KeystoneJS is modern CMS built with Node.js and a superior GraphQL support. KeystoneJS provides an extensive API to build the CMS of your own. You can add custom fields, field adapters, and authentication as well as configure the access limit.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"KeystoneJS\" height=\"480\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/keystonejs.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/mermaid-js.github.io\/mermaid\/\">Mermaid<\/a><\/h2>\n<p>MermaidJS is a JavaScript library in its own category. With MermaidJS, you can create flowcharts and diagrams using just a Markdown-like syntax. It\u2019s a really cool idea!<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Mermaid\" height=\"480\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/mermaidjs.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/jesseduffield\/lazygit\">LazyGit<\/a><\/h2>\n<p>Git is installed with its <code>git<\/code> CLI. Although the <code>git<\/code> CLI is really powerful, it is, in many cases, not quite intuitive to use. LazyGit provides an intuitive UI on the Terminal to operate with Git. You can view the modified files, status, stash, list of branches and diff.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"LazyGit\" height=\"480\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/lazygit.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/TanStack\/table\">React Table<\/a><\/h2>\n<p>A React.js library to create table easily. It also provides interactivity to the table in which you can add pagination to navigate long list of table, sorting, drag-n-drop interface, resizing, grouping and filtering, and set editable data.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"React Table\" height=\"480\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/react-table.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/ryanmcdermott\/clean-code-javascript\">Clean Code JavaScript<\/a><\/h2>\n<p>A collection of good advice to write clean JavaScript codes adapted from Robert C. Martin\u2019s book <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.amazon.com\/Clean-Code-Handbook-Software-Craftsmanship\/dp\/0132350882\">Clean Code<\/a>. Clean JavaScript codes make the code more readable. It\u2019s also easier to review as it\u2019s easier to understand how the code works at a glimpse.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Clean Code JavaScript\" height=\"480\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/clean-code-javascript.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/marketplace\/actions\/wordpress-plugin-deploy\">WP Plugin Deploy<\/a><\/h2>\n<p>WordPress.org repository is using SVN host and handle the plugin versioning. We mostly are now using Git to manage and host our code, so converting our repository to SVN to deploying is a lot hassle. WP Plugin Deploy aims to make this process easier through the new Github Action.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"WP Plugin Deploy\" height=\"480\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/deploy-wordpress-action.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=firefox-devtools.vscode-firefox-debug\">VSCode Firefox Debug<\/a><\/h2>\n<p>A plugin extension that connects Visual Studio Code to Firefox DevTools. It provides convenience to performe advanced debugging in Firefox. You can set breakpoints, logging, variables output right from your Visual Studio Code.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"VSCode Firefox Debug\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/firefox-debugger-vscode.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/mobile\">Github Mobile<\/a><\/h2>\n<p>Github has finally launced it\u2019s first mobile: Github Mobile. With the app, you can manage notificatio, collaborate, as well as search and browse repositories. Github Mobile app is in public beta phase and only avaiable in iOS. You can sign-up to get the invitation to install the app.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Github Mobile\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/github-mobile.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/phpcheatsheets.com\">PHP Cheat Sheet<\/a><\/h2>\n<p>A huge collection of cheatsheet for PHP. We can find cheatsheet for Comparison, Arithmetic (<code>+<\/code>, <code>-<\/code>, etc.) and a lot more. We can switch from PHP5 to the latest PHP7 version to see<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"PHP Cheat Sheet\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/phpcheatsheets.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/vlucas\/frisby\">Frisby<\/a><\/h2>\n<p>Built on top of <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/jestjs.io\/\">Jest<\/a>, Frisby is a JavaScript library that makes it easy to test API endpoint calls. You can check the call status code, respons headers, body content, etc.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Frisby\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/frisby.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/jackocnr\/intl-tel-input\">International Telephone Input<\/a><\/h2>\n<p>A JavaScript library to add input field for international phone number. The input will provide the country list, the international code number, as well as provide the validation on the format number.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"International Telephone Input\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/intl-phone-number.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/bagisto.com\/en\">Bagisto<\/a><\/h2>\n<p>An e-Commerce CMS built Laravel and Vue.js. It comes with a lot of features to run a professional e-Commerce platform including the product catalogue, sales management, access control, sales report, multi-store inventory, shipping and payment, SEO, and a lot more. I think this could be a good alternative to Magento<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Bagisto\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/bagisto.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/typecho\/typecho\">Typecho<\/a><\/h2>\n<p>Typecho is a simple blogging platform built with PHP. It reminds me of the good old days with WordPress, and in fact can be a good alternative if you\u2019d like to host just a blog.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Typecho\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/typecho.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/getmedis.com\">Medis<\/a><\/h2>\n<p>A desktop application of macOS to access and view <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/redis.io\/\">Redis<\/a> data with convenience similar to the phpMyAdmin for MySQL. The app can be downloaded from the App Store.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Medis\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/medis.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2>FreemiumCC<\/h2>\n<p>A huge collection of services and tool that provide free tier of their service. This is a good resource to look at, if you\u2019d like run an online business on budget. Or, if you have business that also provide free tier, you can submit yours to FremiumCC as well.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"FreemiumCC\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/freemium.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/hat.sh\">HatSH<\/a><\/h2>\n<p>An online tool to encrypt and decrypt almost any type of files. You can simply upload the file to encrypt the file. HatSH will provide the unique key which then you can use to decrypt the file.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"HatSH\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/hatsh.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/chatwoot\/chatwoot\">Chatwoot<\/a><\/h2>\n<p>Chatwoot was initially built as business for live chat support system, but did not take off well. The team decided to open the project. Now everyone can install live chat application in your own server<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Chatwoot\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/chatwood.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/thien-do\/typed.tw\">Typed TailwindCSS<\/a><\/h2>\n<p>An extension to implement static type to TailwindCSS with <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.typescriptlang.org\/\">TypeScript<\/a>. In React.js, you can write something like <code>Tw().text32().font500()<\/code> to increase the font size and font-weight. The static type from TypeScript allows will provide better autocompletion when writing the styles and catch error earlier.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Typed TailwindCSS\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/type-tailwindcss.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/daybrush.com\/moveable\/\">Moveable<\/a><\/h2>\n<p>A JavaScript library to add interactivity to an HTML element. With this, you can rorate, transform, skew, resize, drag, snap, grouping elements, and a lot more. A perfect library to build an online graphic editor.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Moveable\" height=\"469\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/moveable.jpg\" width=\"750\"><\/figure>\n<hr>","protected":false},"excerpt":{"rendered":"<p>Time flies. We are nearing the end of a decade. Nonetheless, we continue to share valuable resources with our fellow web developers. In this installment of our series, we have carefully curated some tools, a handful of JavaScript libraries, and a couple of new CMS platforms. Without further ado, let\u2019s explore the complete list below.&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":[],"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 (December 2019) - Hongkiat<\/title>\n<meta name=\"description\" content=\"Time flies. We are nearing the end of a decade. Nonetheless, we continue to share valuable resources with our fellow web developers. In this installment\" \/>\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-2019\/\" \/>\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 2019)\" \/>\n<meta property=\"og:description\" content=\"Time flies. We are nearing the end of a decade. Nonetheless, we continue to share valuable resources with our fellow web developers. In this installment\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/\" \/>\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=\"2019-12-03T13:25:47+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-21T11:46:46+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/vue-interactive-paycard.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-2019\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2019\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"Fresh Resources for Web Designers and Developers (December 2019)\",\"datePublished\":\"2019-12-03T13:25:47+00:00\",\"dateModified\":\"2025-04-21T11:46:46+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2019\\\/\"},\"wordCount\":911,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2019\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-12-2019\\\/vue-interactive-paycard.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-2019\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2019\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2019\\\/\",\"name\":\"Fresh Resources for Web Designers and Developers (December 2019) - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2019\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2019\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-12-2019\\\/vue-interactive-paycard.jpg\",\"datePublished\":\"2019-12-03T13:25:47+00:00\",\"dateModified\":\"2025-04-21T11:46:46+00:00\",\"description\":\"Time flies. We are nearing the end of a decade. Nonetheless, we continue to share valuable resources with our fellow web developers. In this installment\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2019\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2019\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2019\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-12-2019\\\/vue-interactive-paycard.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-12-2019\\\/vue-interactive-paycard.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-12-2019\\\/#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 2019)\"}]},{\"@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 2019) - Hongkiat","description":"Time flies. We are nearing the end of a decade. Nonetheless, we continue to share valuable resources with our fellow web developers. In this installment","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-2019\/","og_locale":"en_US","og_type":"article","og_title":"Fresh Resources for Web Designers and Developers (December 2019)","og_description":"Time flies. We are nearing the end of a decade. Nonetheless, we continue to share valuable resources with our fellow web developers. In this installment","og_url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2019-12-03T13:25:47+00:00","article_modified_time":"2025-04-21T11:46:46+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/vue-interactive-paycard.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-2019\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"Fresh Resources for Web Designers and Developers (December 2019)","datePublished":"2019-12-03T13:25:47+00:00","dateModified":"2025-04-21T11:46:46+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/"},"wordCount":911,"commentCount":1,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/vue-interactive-paycard.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-2019\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/","url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/","name":"Fresh Resources for Web Designers and Developers (December 2019) - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/vue-interactive-paycard.jpg","datePublished":"2019-12-03T13:25:47+00:00","dateModified":"2025-04-21T11:46:46+00:00","description":"Time flies. We are nearing the end of a decade. Nonetheless, we continue to share valuable resources with our fellow web developers. In this installment","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/vue-interactive-paycard.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-12-2019\/vue-interactive-paycard.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2019\/#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 2019)"}]},{"@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-cLH","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/49085","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=49085"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/49085\/revisions"}],"predecessor-version":[{"id":73992,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/49085\/revisions\/73992"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=49085"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=49085"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=49085"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=49085"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}