{"id":58755,"date":"2022-01-28T21:01:59","date_gmt":"2022-01-28T13:01:59","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=58755"},"modified":"2022-01-29T13:15:00","modified_gmt":"2022-01-29T05:15:00","slug":"designers-developers-monthly-01-2022","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/","title":{"rendered":"Fresh Resources for Web Designers and Developers (Jan 2022)"},"content":{"rendered":"<p>Many people typically start their new year with new goals or resolutions. But the developers start their new year by seeking new problems to solve or a new open-source or tool to develop. That\u2019s why there are hundreds of <a href=\"https:\/\/www.hongkiat.com\/blog\/tag\/open-source\/\">open-source tools<\/a> being actively developed, some of which you will find on the list along with other <a href=\"https:\/\/www.hongkiat.com\/blog\/tag\/fresh-resources-developers\/\">new resources<\/a>.<\/p>\n<p>In this round of the series, we have tools to develop CLI, learn advanced CSS, and <a href=\"https:\/\/www.hongkiat.com\/blog\/tag\/productivity\/\">improve productivity<\/a>. Without further ado, let\u2019s jump to the full list<\/p>\n<div class=\"ref-block ref-block--post\" id=\"ref-post-1\">\n\t\t\t\t\t<a href=\"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-12-2021\/\" class=\"ref-block__link\" title=\"Read More: Fresh Resources for Web Designers and Developers (December 2021)\" rel=\"bookmark\"><span class=\"screen-reader-text\">Fresh Resources for Web Designers and Developers (December 2021)<\/span><\/a>\n<div class=\"ref-block__thumbnail img-thumb img-thumb--jumbo\" data-img='{ \"src\" : \"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/designers-developers-monthly-12-2021.jpg\" }'>\n\t\t\t\t\t\t\t<noscript>\n<style>.no-js #ref-block-post-58519 .ref-block__thumbnail { background-image: url(\"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/designers-developers-monthly-12-2021.jpg\"); }<\/style>\n<\/noscript>\n\t\t\t\t\t\t<\/div>\n<div class=\"ref-block__summary\">\n<h4 class=\"ref-title\">Fresh Resources for Web Designers and Developers (December 2021)<\/h4>\n<p class=\"ref-description\">\n\t\t\t\t\t\tWe have reached the end of 2021! Time has flown by, and the world is still recovering from...\t\t\t\t\t\t<span>Read more<\/span><\/p>\n<\/div>\n<\/div>\n<h2><a target=\"_blank\" href=\"https:\/\/github.com\/chevere\/xr\" rel=\"noopener\">XR<\/a><\/h2>\n<p>XR is a <strong>debugging tool for PHP<\/strong>. It provides some helper functions where you can pass variables to debug, dump the output on a localhost address in real-time and present the debugging message in a nice layout.<\/p>\n<p>The tool is available as <strong>Composer package as well as Docker image<\/strong> which makes it easy to integrate with your existing project.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/xr.jpg\" alt=\"XR\" width=\"750\" height=\"480\"><\/figure>\n<h2><a target=\"_blank\" href=\"https:\/\/github.com\/microsoft\/lage\" rel=\"noopener\">Lage<\/a><\/h2>\n<p>Lage is a new initiative from Microsoft to <strong>manage large repositories with multiple packages<\/strong>, also known as monorepo, more efficiently. It provides the configuration and commands that let you type a command once and handle the rest on the other packages on the repository.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/lage.jpg\" alt=\"Lage\" width=\"750\" height=\"480\"><\/figure>\n<h2><a target=\"_blank\" href=\"https:\/\/github.com\/syncthing\/syncthing-macos\" rel=\"noopener\">Syncthing<\/a><\/h2>\n<p>Syncthing is a <strong>utility tool to synchronize files<\/strong> on your computer. It is quite similar to Dropbox, except that it is hosted in your own computer and can be connected to LAN or over the Internet.<\/p>\n<p>Moreover, you don\u2019t have to share your data with third-parties. It works with many platforms including <strong>macOS X, Windows, Linux, FreeBSD<\/strong>, and many others.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/syncthing.jpg\" alt=\"Syncthing\" width=\"750\" height=\"480\"><\/figure>\n<h2><a target=\"_blank\" href=\"https:\/\/unlighthouse.dev\/\" rel=\"noopener\">Unlighthouse<\/a><\/h2>\n<p>An open-source tool that allows you to <strong>test your web pages with Lighthouse for performance, SEO, and accesibility<\/strong>. It organises these tests in a nice modern UI where you can see, search, sort, or re-run the tests on individual pages and much more.<\/p>\n<p>It\u2019s currently in active development and looks very promising as it would make these audits easily manageable.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/unlighthouse.jpg\" alt=\"Unlighthouse\" width=\"750\" height=\"480\"><\/figure>\n<h2><a target=\"_blank\" href=\"https:\/\/smolcss.dev\/\" rel=\"noopener\">SmolCSS<\/a><\/h2>\n<p>A collection of CSS snippets to address common problems with modern CSS features such as <strong>setting aspect ratio, centering elements, creating stack layout, responsive padding, scroll snap<\/strong>, and a lot more. A really great source for anyone who would like to upgrade their CSS skill.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/smolcss.jpg\" alt=\"SmolCSS\" width=\"750\" height=\"480\"><\/figure>\n<h2><a target=\"_blank\" href=\"https:\/\/stylestage.dev\/\" rel=\"noopener\">StyleStage<\/a><\/h2>\n<p>A tool that aims to rekindle the <a target=\"_blank\" href=\"http:\/\/www.csszengarden.com\/\" rel=\"noopener\">CSS Zen Garden<\/a>, <strong>StyleStage<\/strong> provides the medium for developers to explore and show what modern CSS can do to styles HTML. It\u2019s an overall <strong>great source to learn CSS whether you\u2019re just starting out<\/strong>, as you will find beautiful unique layouts, styles, and inspirations.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/stylestage.jpg\" alt=\"StyleStage\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/Textualize\/rich\">Rich<\/a><\/h2>\n<p><strong>Rich<\/strong> is a <strong>Python library to create a rich Terminal or Shell applications<\/strong>. It provides an API for easily styling output with colors, render tables, progress bars, handle markdown, and even highlight source code. It works on macOS, Windows, and Linux.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/rich.jpg\" alt=\"Rich\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/leonardodino\/rci\">RCI<\/a><\/h2>\n<p>Have you seen some websites where it asks for the 2FA (Two-Factor Authentication) with multiple small inputs? It\u2019s a common UI pattern that we can find on the Web today, and RCI aims to make it easy to create one. It\u2019s a <strong>React component that provides the base structure for the input with improved accessibility<\/strong>. You can <a href=\"https:\/\/codesandbox.io\/s\/rci-codeinput-812up?file=\/src\/Example.tsx\" target=\"_blank\" rel=\"noopener nofollow\">check the demo here<\/a>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/rci.jpg\" alt=\"RCI\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/www.vantajs.com\/\">VantaJS<\/a><\/h2>\n<p>A <strong>JavaScript library to create animated interactive backgrounds<\/strong>. The library is pretty easy to use. It provides configurations for adjusting colors, speed, scale, etc. It\u2019s lightweight, fast, and an overall cool library to add to your website.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/vanta.jpg\" alt=\"VantaJS\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/tkellogg\/dura\">Dura<\/a><\/h2>\n<p>Dura is a clever <strong>tool that runs in the background to watch your Git repositories and commit the uncommitted changes<\/strong> without affecting the actual Git tree. It\u2019s like an autosave feature and TimeMachine combined, so you will never accidentally lose your work.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/dura.jpg\" alt=\"Dura\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/fffuel.co\/ffflux\/\">Ffflux<\/a><\/h2>\n<p>Ffflux is  not a typical gradient tool. Aside from generating simple gradients, it can also <strong>generate complex gradient compositions<\/strong>. You can adjust the colors, blend mode, angle, etc. to create a unique gradient and then export it to PNG or SVG.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/ffflux.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/chrome.google.com\/webstore\/detail\/omni-bookmark-history-tab\/mapjgeachilmcbbokkgcbgpbakaaeehi?hl=en&authuser=0\">Omni<\/a><\/h2>\n<p>Omni is a <strong>Chrome extension to improve your workflow working in the browser<\/strong>. It takes a similar concept as <a href=\"https:\/\/www.alfredapp.com\/\" target=\"_blank\" rel=\"noopener\">Alfred<\/a> in macOS but it runs in the browser instead.<\/p>\n<p>Similarly, with Omni, you can <strong>navigate tabs and history, browse and manage bookmarks<\/strong>, as well as do some actions like creating a new Github repo, new document, and others that boost your productivity.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/omni.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/medusajs\/medusa\">Medusa<\/a><\/h2>\n<p>A <strong>headless open-source commerce engine<\/strong> that allows you to create any digital commerce whether it\u2019s a traditional e-commerce site, marketplace, or just using it as the backend for an app.<\/p>\n<p>Medusa is packed with features needed to run the e-commerce business like <strong>shopping carts, product cataglogues, order management<\/strong>, as well as APIs for developers to extend the features.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/medusa.jpg\" alt=\"Medusa\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/sqlpad\/sqlpad\">SQLPad<\/a><\/h2>\n<p>SQLPad is a <strong>SQL editor that you can host on your own server<\/strong>. It allows you to write and execute SQL queries and visualize the results. It supports database types including MySQL, Cassandra, SQLite, and even Google BigQuery.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/sqlpad.jpg\" alt=\"SQLPad\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/discordjs\/discord.js\">Discord.js<\/a><\/h2>\n<p>A <strong>Discord Node.js SDK to interact with Discord platforms<\/strong>. It covers all Discord APIs wrapped in object-oriented code structure. It allows you to do some operations like <strong>getting a channel, getting user information, creating a DM<\/strong>, and ultimately enables you to create a fully integrated application for Discord.js.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/discord-js.jpg\" alt=\"Discord.js\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/getcandy\/getcandy\">GetCandy<\/a><\/h2>\n<p>A Laravel package that brings e-commerce functionality similar to Shopify. It provides the <strong>Admin Dashboard<\/strong> where you can add products, see orders, and other administrative operations. At the time of the writing, it is in active development with more features to come such as API and add-ons.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/getcandy.jpg\" alt=\"GetCandy\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/serversideup.net\/open-source\/spin\/\">Spin<\/a><\/h2>\n<p>A <strong>Bash utility that aims to improve and simplify Docker to manage development<\/strong> and production environments regardless of the programming language. Instead of writing <code>docker-compose<\/code> with all the confusing arguments, you can just write <code>spin up<\/code> and be done. It also <strong>manages compatibility with Windows, macOS, and Linux<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/spin.jpg\" alt=\"Spin\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/github.com\/ospfranco\/sol\">Sol<\/a><\/h2>\n<p>Developed as an alternative for Alfred and Spotlight, Sol aims to <strong>improve your productivity with keyboard shortcuts<\/strong>. This tool is also currently in active development and I\u2019m looking forward to how it evolves in the future.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/sol.jpg\" alt=\"\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/www.fastify.io\/\">Fastify<\/a><\/h2>\n<p>A <strong>Node.js framework to build web applications with a focus on developer experience<\/strong>. Designed to serve as many requests in low-cost infrastructure. It\u2019s extensible through hooks and plugins with <strong>around 200 plugins in the ecosystem<\/strong>.<\/p>\n<p>It\u2019s part of OpenJS and backed by some big names in tech like Microsoft. Fastify is a very well-established framework.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/fastify.jpg\" alt=\"Fastify\" width=\"750\" height=\"480\"><\/figure>\n<h2><a href=\"https:\/\/free-for.dev\/#\/\">FreeForDev<\/a><\/h2>\n<p>The Internet is full of free stuff like tools, articles, and other resources. This website is specifically built to <strong>organize these free stuff in well-organized sections<\/strong> so you can easily navigate and easily find the frees stuff you\u2019re looking.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/free-dev.jpg\" alt=\"FreeForDev\" width=\"750\" height=\"480\"><\/figure>","protected":false},"excerpt":{"rendered":"<p>Many people typically start their new year with new goals or resolutions. But the developers start their new year by seeking new problems to solve or a new open-source or tool to develop. That\u2019s why there are hundreds of open-source tools being actively developed, some of which you will find on the list along with&hellip;<\/p>\n","protected":false},"author":113,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_post_was_ever_published":false},"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.9) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Fresh Resources for Web Designers and Developers (Jan 2022) - Hongkiat<\/title>\n<meta name=\"description\" content=\"Many people typically start their new year with new goals or resolutions. But the developers start their new year by seeking new problems to solve or a\" \/>\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-01-2022\/\" \/>\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 (Jan 2022)\" \/>\n<meta property=\"og:description\" content=\"Many people typically start their new year with new goals or resolutions. But the developers start their new year by seeking new problems to solve or a\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/\" \/>\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=\"2022-01-28T13:01:59+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-01-29T05:15:00+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/xr.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-01-2022\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-01-2022\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"Fresh Resources for Web Designers and Developers (Jan 2022)\",\"datePublished\":\"2022-01-28T13:01:59+00:00\",\"dateModified\":\"2022-01-29T05:15:00+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-01-2022\\\/\"},\"wordCount\":1106,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-01-2022\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-01-2022\\\/xr.jpg\",\"keywords\":[\"Tools for Designers &amp; Developers\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-01-2022\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-01-2022\\\/\",\"name\":\"Fresh Resources for Web Designers and Developers (Jan 2022) - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-01-2022\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-01-2022\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-01-2022\\\/xr.jpg\",\"datePublished\":\"2022-01-28T13:01:59+00:00\",\"dateModified\":\"2022-01-29T05:15:00+00:00\",\"description\":\"Many people typically start their new year with new goals or resolutions. But the developers start their new year by seeking new problems to solve or a\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-01-2022\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-01-2022\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-01-2022\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-01-2022\\\/xr.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-01-2022\\\/xr.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-01-2022\\\/#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 (Jan 2022)\"}]},{\"@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 (Jan 2022) - Hongkiat","description":"Many people typically start their new year with new goals or resolutions. But the developers start their new year by seeking new problems to solve or a","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-01-2022\/","og_locale":"en_US","og_type":"article","og_title":"Fresh Resources for Web Designers and Developers (Jan 2022)","og_description":"Many people typically start their new year with new goals or resolutions. But the developers start their new year by seeking new problems to solve or a","og_url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2022-01-28T13:01:59+00:00","article_modified_time":"2022-01-29T05:15:00+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/xr.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-01-2022\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"Fresh Resources for Web Designers and Developers (Jan 2022)","datePublished":"2022-01-28T13:01:59+00:00","dateModified":"2022-01-29T05:15:00+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/"},"wordCount":1106,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/xr.jpg","keywords":["Tools for Designers &amp; Developers"],"articleSection":["Web Design"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/","url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/","name":"Fresh Resources for Web Designers and Developers (Jan 2022) - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/xr.jpg","datePublished":"2022-01-28T13:01:59+00:00","dateModified":"2022-01-29T05:15:00+00:00","description":"Many people typically start their new year with new goals or resolutions. But the developers start their new year by seeking new problems to solve or a","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/xr.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-01-2022\/xr.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-01-2022\/#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 (Jan 2022)"}]},{"@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-fhF","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/58755","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=58755"}],"version-history":[{"count":1,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/58755\/revisions"}],"predecessor-version":[{"id":58756,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/58755\/revisions\/58756"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=58755"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=58755"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=58755"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=58755"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}