{"id":72907,"date":"2024-09-25T23:00:43","date_gmt":"2024-09-25T15:00:43","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=72907"},"modified":"2025-04-21T18:07:27","modified_gmt":"2025-04-21T10:07:27","slug":"designers-developers-monthly-09-2024","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/","title":{"rendered":"Fresh Resources for Web Designers and Developers (September 2024)"},"content":{"rendered":"<p>It\u2019s September, and we\u2019ve got a fresh set of resources for our fellow web developers.<\/p>\n<p>This month, we\u2019ve got tools from various categories, including a plugin to check WordPress plugins, a React component library for WordPress admin applications, a collection of Laravel Blade components, a <a href=\"https:\/\/www.hongkiat.com\/blog\/static-site-generators\/\">static site generator<\/a> written in Rust, and a few more interesting things that you might find useful.<\/p>\n<p>Let\u2019s get started!<\/p>\n<div class=\"ref-block ref-block--tax noLinks\" id=\"ref-block-tax-72907-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-72907-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:\/\/wordpress.org\/plugins\/plugin-check\/\">Plugin Check<\/a><\/h2>\n<p><strong>Plugin Check<\/strong> is a WordPress tool to help you ensure your plugin meets the standards required for the <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/wordpress.org\/plugins\/\">WordPress.org plugin directory<\/a> . It checks for compliance with best practices, covering areas like performance, security, <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.i18next.com\/\">i18n<\/a>, <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.a11yproject.com\/\">A11y<\/a>, and flagging any violations or concerns to help improve your plugin.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Plugin Check\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/wp-pcp.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/kubrick.syntatis.com\/\">Kubrick UI<\/a><\/h2>\n<p><strong>Kubrick UI<\/strong> is an open-source React component library built on top of <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/react-spectrum.adobe.com\/react-aria\/getting-started.html\">react-aria<\/a>, designed for creating custom WordPress admin applications. It helps developers to ensure their WordPress Admin applications are consistent, accessible, and seamlessly blend with the familiar WordPress Admin interface.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Kubrick UI\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/kubrick.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/react-symbols.vercel.app\">React Symbols<\/a><\/h2>\n<p><strong>react-symbols<\/strong> is a lightweight <a href=\"https:\/\/www.hongkiat.com\/blog\/react-js-web-developers-toolkit\/\">React library<\/a> providing over 100 files and folder icons. Built with TypeScript, it supports React Server Components (RSC) and provides optimized, minified SVGs. The icons are originally designed and created for the VSCode theme, <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=miguelsolorio.symbols\">Symbols<\/a>, but I think it\u2019s perfectly good for any project.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"React Symbols\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/react-symbols.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/getzola\/zola\">Zola<\/a><\/h2>\n<p><strong>Zola<\/strong> is a <a href=\"https:\/\/www.hongkiat.com\/blog\/static-site-generators\/\">static site generator (SSG)<\/a> written in <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.rust-lang.org\">Rust<\/a>, similar to Hugo and Jekyll, that uses the <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/Keats\/tera\">Tera template engine<\/a>. It supports <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/commonmark.org\/\">CommonMark<\/a>, and provides features like GitHub-flavored tables and task lists out-of-the-box. A great tool for developers looking to build fast, secure, and flexible websites.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Zola\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/zola.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/mary-ui.com\">MaryUI<\/a><\/h2>\n<p><strong>MaryUI<\/strong> is a collection of <a rel=\"nofollow noopener\" target=\"_blank\" href=\"http:\/\/\">Laravel Blade<\/a> components for Livewire 3. It offers pre-designed UI elements that help Laravel developers quickly and easily build UIs and pages for their apps. It is built using daisyUI and Tailwind CSS for styling, giving you flexible customization with tools you\u2019re already familiar with.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Mary UI\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/mary-ui.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/expressive-code.com\">Expressive Code<\/a><\/h2>\n<p><strong>Expressive Code<\/strong> makes it easy to display code blocks on your content or page. It supports VS Code themes with accurate syntax highlighting, and includes features like editor frames, copy-to-clipboard buttons, text markers, and collapsible sections. Best of all, it doesn\u2019t rely on any front-end frameworks like React or Vue, and works with popular site generators like Astro and Next.js, as well as plain Markdown and MDX.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Expressive Code\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/expressive-code.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/shoelace.style\">Shoelace<\/a><\/h2>\n<p><strong>Shoelace<\/strong> is an open-source, framework-agnostic library of customizable web components. It offers accessible, modern UI elements like buttons and dialogs, with easy theming and integration into any project, making it ideal for building responsive, flexible web interfaces.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Shoelace\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/shoelace-styles.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.blog\/news-insights\/product-news\/introducing-github-copilot-extensions\/\">GitHub Copilot Extensions<\/a><\/h2>\n<p>GitHub has recently announced <strong>GitHub Copilot Extensions<\/strong>, that enables developers to develop and deploy using natural language within VS Code and GitHub. It allows you to tap into specific tools, like Docker, Azure, Stripe, and MongoDB, that provide you better tools and context to fix or solve problems within your app in one streamlined process.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"GitHub Copilot Extensions\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/github-copilot-extensions.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/dioxuslabs.com\/\">Dioxus<\/a><\/h2>\n<p><strong>Dioxus<\/strong> is a Rust library that lets you build apps for desktop, web, mobile, and more\u2014all from a single codebase. Inspired by React, it focuses on making development for cross-platform applications faster and easier. A great tool if you\u2019re looking to build apps for multiple platforms.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Dioxus\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/dioxus.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/motion-primitives.com\">Motion Primitives<\/a><\/h2>\n<p><strong>Motion Primitives<\/strong> is a collection of React components built with Framer Motion and <a href=\"https:\/\/www.hongkiat.com\/blog\/tailwind-css\/\">Tailwind CSS<\/a>. It makes it easy for you to add <a href=\"https:\/\/www.hongkiat.com\/blog\/creative-css-animations\/\">smooth animations<\/a> to your websites. A perfect library for both developers and designers looking to make websites more alive.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Motion Primitives\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/motion-primitives.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/rclone.org\/\">Rclone<\/a><\/h2>\n<p><strong>Rclone<\/strong> is a command-line tool that helps you <a href=\"https:\/\/www.hongkiat.com\/blog\/icloud-gdrive-onedrive-dropbox\/\">manage files on cloud storage<\/a> easily. It serves as an alternative to the web interfaces provided by the cloud vendors. It supports over 70 different cloud storage services, including S3 object stores and various file storage options. It makes it easier to transfer and organize your files across multiple platforms.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Rclone\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/rclone.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/notion-helper.framer.website\">Notion Helper<\/a><\/h2>\n<p><strong>Notion Helper<\/strong> is a <a href=\"https:\/\/www.hongkiat.com\/blog\/node-js-server-side-javascript\/\">Node.js library<\/a> that simplifies working with the Notion API. It\u2019s easy to use, has no dependencies, and provides full JSDoc support for IntelliSense. An overall great tool for developers looking to integrate <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.notion.so\/?cookie_sync_completed_exp=true\">Notion<\/a> into their projects.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Notion Helper\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/notion-helper.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/wagtail\/wagtail\">Wagtail<\/a><\/h2>\n<p><strong>Wagtail<\/strong> is an open-source content management system (CMS) built on Django, designed with a focus on user experience. It provides designers and developers with fine control over content and design. It makes it easy and flexible to create websites. If your Python project is looking for a CMS that is easy to use and customize, I think Wagtail is a great choice.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Wagtail\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/wagtail.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/pmndrs\/uikit\">UIKit<\/a><\/h2>\n<p>UIKit is a toolkit designed for building fast, responsive 3D user interfaces using react-three-fiber. It provides pre-styled, customizable components that make it easier for you to create interactive layouts and interfaces. A great library for developing UIs in web-based 3D apps, such as games or virtual\/augmented reality (VR\/AR) projects.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"UI Kit\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/uikit.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/supernotes.app\/open-source\/sn-pro\/\">SN Pro<\/a><\/h2>\n<p><strong>SN Pro<\/strong> is a free, open-source typeface based on <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/fonts.google.com\/specimen\/Nunito\">Nunito<\/a>. It refines each character for better readability, improving kerning and ligature support, while tweaking specific letters like Q and t. I think it\u2019s a good-looking font for any type of website. It looks clean and feels more polished.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"SN Pro\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/sn-pro.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/wordpress.org\/plugins\/dominant-color-images\/\">Image Placeholders<\/a><\/h2>\n<p><strong>Image Placeholders<\/strong> is a WordPress plugin, part of WordPress\u2019s effort to improve performance. It works by determining and storing the dominant color for newly uploaded images in the media library, and uses it to create a placeholder background of the color on the frontend that would be visible until the related image is loaded.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Image Placeholders\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/image-placeholders.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/atomicojs.dev\">Atomico<\/a><\/h2>\n<p><strong>Atomico<\/strong> is a lightweight library for building web components using functions, hooks, and a virtual DOM, similar to React. It is also framework-agnostic, meaning your components will work with libraries like React, Vue, Svelte, or Angular. I think it is a great library for developers looking to build web components that are fast and easy to use.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Atomico\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/atomico.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=chrisrhymes.gutenburg-comment-highlight\">Gutenberg Comment Highlight<\/a><\/h2>\n<p><strong>Gutenberg Comment Highlight<\/strong> is a VSCode extension that improves readability for WordPress Gutenberg block meta data. It highlights block names starting with <code>wp:<\/code> as variables and applies basic JSON syntax highlighting to any JSON strings, making comments easier to read than the default greyed-out look of standard HTML comments.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Gutenberg Comment Highlight\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/gutenberg-comment-highlight.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/sst.dev\">SST<\/a><\/h2>\n<p><strong>SST<\/strong> is a framework that simplifies building full-stack applications on your own AWS infrastructure. With a single configuration, you can deploy everything your app needs. It supports a wide range of AWS services, including Lambda, API Gateway, and S3, as well as supports popular frameworks like Next.js, Nuxt, Solid, Astro, etc. A really handy tool for deploying your application.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"SST\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/sst.jpg\" width=\"750\"><\/figure>\n<hr>\n<h2><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/github.com\/web-infra-dev\/rspack\">Rspack<\/a><\/h2>\n<p><strong>Rspack<\/strong> is a high-performance JavaScript bundler written in Rust, designed to be a faster alternative to Webpack. It offers fast build performance, Hot Module Replacement (HMR), and full compatibility with Webpack plugins and loaders. Rspack also supports built-in optimizations like tree shaking, and is framework-agnostic, giving developers flexibility with large-scale projects. A great tool for developers looking to improve their build performance in their projects and applications.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" alt=\"Rspack\" height=\"450\" src=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/rspack.jpg\" width=\"750\"><\/figure>","protected":false},"excerpt":{"rendered":"<p>It\u2019s September, and we\u2019ve got a fresh set of resources for our fellow web developers. This month, we\u2019ve got tools from various categories, including a plugin to check WordPress plugins, a React component library for WordPress admin applications, a collection of Laravel Blade components, a static site generator written in Rust, and a few more&hellip;<\/p>\n","protected":false},"author":113,"featured_media":0,"comment_status":"closed","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.5) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Fresh Resources for Web Designers and Developers (September 2024) - Hongkiat<\/title>\n<meta name=\"description\" content=\"It&#039;s September, and we&#039;ve got a fresh set of resources for our fellow web developers. This month, we&#039;ve got tools from various categories, including 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-09-2024\/\" \/>\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 (September 2024)\" \/>\n<meta property=\"og:description\" content=\"It&#039;s September, and we&#039;ve got a fresh set of resources for our fellow web developers. This month, we&#039;ve got tools from various categories, including a\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/\" \/>\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=\"2024-09-25T15:00:43+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-21T10:07:27+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/wp-pcp.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<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-09-2024\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-09-2024\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"Fresh Resources for Web Designers and Developers (September 2024)\",\"datePublished\":\"2024-09-25T15:00:43+00:00\",\"dateModified\":\"2025-04-21T10:07:27+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-09-2024\\\/\"},\"wordCount\":1160,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-09-2024\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-09-2024\\\/wp-pcp.jpg\",\"keywords\":[\"Tools for Designers &amp; Developers\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-09-2024\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-09-2024\\\/\",\"name\":\"Fresh Resources for Web Designers and Developers (September 2024) - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-09-2024\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-09-2024\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-09-2024\\\/wp-pcp.jpg\",\"datePublished\":\"2024-09-25T15:00:43+00:00\",\"dateModified\":\"2025-04-21T10:07:27+00:00\",\"description\":\"It's September, and we've got a fresh set of resources for our fellow web developers. This month, we've got tools from various categories, including a\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-09-2024\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-09-2024\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-09-2024\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-09-2024\\\/wp-pcp.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-09-2024\\\/wp-pcp.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-09-2024\\\/#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 (September 2024)\"}]},{\"@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 (September 2024) - Hongkiat","description":"It's September, and we've got a fresh set of resources for our fellow web developers. This month, we've got tools from various categories, including 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-09-2024\/","og_locale":"en_US","og_type":"article","og_title":"Fresh Resources for Web Designers and Developers (September 2024)","og_description":"It's September, and we've got a fresh set of resources for our fellow web developers. This month, we've got tools from various categories, including a","og_url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2024-09-25T15:00:43+00:00","article_modified_time":"2025-04-21T10:07:27+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/wp-pcp.jpg","type":"","width":"","height":""}],"author":"Thoriq Firdaus","twitter_card":"summary_large_image","twitter_creator":"@tfirdaus","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Thoriq Firdaus"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"Fresh Resources for Web Designers and Developers (September 2024)","datePublished":"2024-09-25T15:00:43+00:00","dateModified":"2025-04-21T10:07:27+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/"},"wordCount":1160,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/wp-pcp.jpg","keywords":["Tools for Designers &amp; Developers"],"articleSection":["Web Design"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/","url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/","name":"Fresh Resources for Web Designers and Developers (September 2024) - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/wp-pcp.jpg","datePublished":"2024-09-25T15:00:43+00:00","dateModified":"2025-04-21T10:07:27+00:00","description":"It's September, and we've got a fresh set of resources for our fellow web developers. This month, we've got tools from various categories, including a","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/wp-pcp.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-09-2024\/wp-pcp.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-09-2024\/#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 (September 2024)"}]},{"@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-iXV","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/72907","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=72907"}],"version-history":[{"count":2,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/72907\/revisions"}],"predecessor-version":[{"id":73896,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/72907\/revisions\/73896"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=72907"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=72907"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=72907"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=72907"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}