{"id":74425,"date":"2026-06-30T21:00:34","date_gmt":"2026-06-30T13:00:34","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=74425"},"modified":"2026-06-30T18:01:18","modified_gmt":"2026-06-30T10:01:18","slug":"designers-developers-monthly-06-2026","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/","title":{"rendered":"Fresh Resources for Web Designers and Developers (June 2026)"},"content":{"rendered":"

June is as good a time as any to highlight new tools and resources for our fellow web developers.<\/p>\n

This month\u2019s batch covers everything from GPU-accelerated terminal emulators to AI-powered code audit agents, from declarative document typesetting to terminal-based spreadsheets. Whether you\u2019re doing front-end or backend, I believe there\u2019s something on the list you might be interested in.<\/p>\n

Let\u2019s dive in!<\/p>\n

Lumen<\/a><\/h2>\n

Lumen<\/strong> is a browser-based shader playground for creating looping abstract art with WebGL. It runs client-side with zero dependencies, uses a seed system for sharing, and exports to PNG, video, or GIF. A handy tool for frontend developers and artists exploring generative art.<\/p>\n

\n \"LUMEN\n <\/figure>\n

TextMotion<\/a><\/h2>\n

TextMotion<\/strong> is a dependency-free text roll animation library that creates slot-machine-style label transitions with pure CSS transforms. It supports React and Vue out of the box and can be easily installed via NPM<\/a>. This library is for UI developers who want polished micro-interactions without a full animation library.<\/p>\n

\n \"slot-text\n <\/figure>\n

shadcn\/improve<\/a><\/h2>\n

shadcn\/improve<\/strong> is a skill for AI coding agents that audits your codebase and writes implementation plans for cheaper models to execute. Run \/improve<\/code> for a prioritized findings table, pick items to plan, and get markdown specs under plans\/<\/code>. It works with any Agent Skills-compatible agent and a perfect tool for teams that need to optimize AI agent costs while still maintaining quality.<\/p>\n

\n \"shadcn\/improve\n <\/figure>\n

Paseo<\/a><\/h2>\n

Paseo<\/strong> is a self-hosted orchestrator for running Claude Code<\/a>, Codex, Copilot, OpenCode<\/a>, and Pi agents<\/a> from desktop, mobile, or CLI. It runs a local daemon, supports voice dictation on iOS or Android, and it also works offline with no telemetry. A handy tool for developers juggling multiple AI coding tools who want one dashboard.<\/p>\n

\n \"Paseo\n <\/figure>\n

Coder<\/a><\/h2>\n

Coder<\/strong> is a self-hosted platform for cloud dev environments defined in Terraform<\/a> and connected via WireGuard<\/a>. Workspaces run on EC2, K8s, or Docker and auto-shutdown when idle. Includes Coder Agents for AI coding without exposing API keys in workspaces. For teams needing reproducible environments with built-in AI agent support.<\/p>\n

\n \"Coder\n <\/figure>\n

Apple Container<\/a><\/h2>\n

Container<\/strong> is Apple\u2019s official tool for running Linux containers as lightweight VMs on Apple Silicon. It is written in Swift, produces OCI-compatible images<\/a>, and requires macOS 26. If you develop on a Mac and need native Linux container support without Docker Desktop<\/a>, this is a promising option to explore.<\/p>\n

\n \"Apple\n <\/figure>\n

GatherOS<\/a><\/h2>\n

GatherOS<\/strong> is a Mac app for capturing, organizing, and finding design references from your desktop. Drag images, sync X bookmarks, and search by color or AI visual search. Local-first with unlimited libraries and auto-tagging. A great tool for designers and developers who want a personal design inspiration manager without cloud lock-in.<\/p>\n

\n \"Gatheros\n <\/figure>\n

Image Compression by MakingSoftware<\/a><\/h2>\n

An illustrated chapter from the Making Software book<\/a> on how image compression exploits human vision to shrink files. Covers bits, entropy, and the tricks behind JPEG, PNG, and modern codecs. Visual and accessible. I think this is a must-read for frontend developers who want to understand how image formats work under the hood.<\/p>\n

\n \"Making\n <\/figure>\n

Devbox<\/a><\/h2>\n

DevBox<\/strong> creates isolated, reproducible dev environments without Docker or Nix language<\/a> knowledge. Define packages in a JSON config, run devbox shell<\/code>, and get an ephemeral environment with 400,000+ package versions. Syncs via Git. If you want portable, version-controlled dev environments without the overhead of Dockerfiles or Nix expressions, this tool is worth a look.<\/p>\n

\n \"Devbox\n <\/figure>\n

Typst<\/a><\/h2>\n

Typst<\/strong> is a markup-based typesetting system that compiles to PDF, images, or websites. Built-in support for math, plots, tables, bibliographies, and slides. Runs in the browser or locally with scripting for automation. A solid LaTeX<\/a> alternative for students, researchers, and technical writers.<\/p>\n

\n \"Typst\n <\/figure>\n

WebCheck<\/a><\/h2>\n

WebCheck<\/strong> analyzes any URL and reveals what attackers already know about your site in under 20 seconds. It checks headers, SSL, DNS, open ports, and vulnerabilities through one interface. No signup needed. A handy tool for developers and security-conscious site owners who want a quick external audit without complex tools.<\/p>\n

\n \"Web\n <\/figure>\n

Alacritty<\/a><\/h2>\n

Alacritty<\/strong> is a cross-platform terminal emulator with OpenGL-accelerated rendering for smooth performance. Features Vi mode<\/a>, RegEx hints, multi-window support, and YAML config. Runs on BSD, Linux, macOS, and Windows. For developers who spend all day in the terminal and want sub-millisecond rendering.<\/p>\n

\n \"Alacritty\n <\/figure>\n

Restic<\/a><\/h2>\n

Restic<\/strong> is a backup tool that encrypts, deduplicates, and verifies files across Linux, macOS, and Windows. Single binary with no server. Supports local drives, SFTP, S3, and more. If you want a simple, secure, and cross-platform backup solution without cloud lock-in, I think Restic can be a solid choice.<\/p>\n

\n \"Restic\n <\/figure>\n

Ferret<\/a><\/h2>\n

Ferret<\/strong> is an open-source web scraping tool with FQL, a declarative language for describing what data you need rather than how to extract it. Runs against documents, pages, and APIs through an embeddable Go runtime. Same FQL works in browser, CLI, or as a worker. A great option if you want a more intuitive way to scrape data without writing imperative code or dealing with anti-bot measures.<\/p>\n

\n \"Ferret\n <\/figure>\n

html-video<\/a><\/h2>\n

HTML Video<\/strong> is a meta-layer over Hyperframes<\/a>, Remotion<\/a>, and Motion Canvas<\/a> that allows AI agents to turn prompts, articles, or repos into MP4 files. Describe the video, the agent storyboards it as animated HTML, and headless Chromium renders locally. A great tool for anyone exploring AI-generated video without cloud lock-in or complex pipelines.<\/p>\n

\n \"html-video\n <\/figure>\n

ForesightJS<\/a><\/h2>\n

ForesightJS<\/strong> is a lightweight JS library that predicts user intent from mouse movements and keyboard navigation to prefetch content. Zero config, separate strategies for desktop and mobile, with React and Vue packages. If you want to optimize perceived performance, this library can be a simple addition to your frontend toolkit.<\/p>\n

\n \"ForesightJS\n <\/figure>\n

Botasaurus<\/a><\/h2>\n

Botasaurus<\/strong> is a Python framework for web scraping with built-in anti-blocking, account generation, temp email, and CSV\/JSON export. Handles Cloudflare and PerimeterX evasion automatically, keeps the browser open on errors for debugging. For Python developers who want a batteries-included scraper, this framework can save you time and headaches compared to building your own from scratch.<\/p>\n

\n \"Botasaurus\n <\/figure>\n

bottom (btm)<\/a><\/h2>\n

bottom (btm)<\/strong> is a cross-platform terminal system monitor with CPU, memory, disk, network, and process widgets. Richer TUI than htop with mouse and keyboard support, theming, and cross-platform. For developers who want more visual system insight without leaving the terminal.<\/p>\n

\n \"bottom\n <\/figure>\n

Zoxide<\/a><\/h2>\n

Zoxide<\/strong> is a Rust-based cd<\/code> replacement that learns your directory habits and jumps to any folder with a fuzzy match. Inspired by z<\/code> and autojump<\/code> but faster, with shell integrations for Bash, Zsh, Fish<\/a>, and PowerShell<\/a>. This is a handy CLI for developers who want to navigate their filesystem more efficiently without typing full paths.<\/p>\n

\n \"zoxide\n <\/figure>\n

Sheets<\/a><\/h2>\n

Sheets<\/strong> is a terminal spreadsheet app in Go lang<\/a> with Vim-style keybindings for editing CSV files. Read and write cells or ranges, search with regex, pipe through stdin\/stdout. For developers who need to inspect or edit CSV data without a GUI.<\/p>\n

\n \"sheets\n <\/figure>","protected":false},"excerpt":{"rendered":"

June is as good a time as any to highlight new tools and resources for our fellow web developers. This month\u2019s batch covers everything from GPU-accelerated terminal emulators to AI-powered code audit agents, from declarative document typesetting to terminal-based spreadsheets. Whether you\u2019re doing front-end or backend, I believe there\u2019s something on the list you might…<\/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":"\nFresh Resources for Web Designers and Developers (June 2026) - Hongkiat<\/title>\n<meta name=\"description\" content=\"June is as good a time as any to highlight new tools and resources for our fellow web developers. This month's batch covers everything from\" \/>\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-06-2026\/\" \/>\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 (June 2026)\" \/>\n<meta property=\"og:description\" content=\"June is as good a time as any to highlight new tools and resources for our fellow web developers. This month's batch covers everything from\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/\" \/>\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=\"2026-06-30T13:00:34+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-06-2026\/lumenshaders.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-06-2026\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-06-2026\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"Fresh Resources for Web Designers and Developers (June 2026)\",\"datePublished\":\"2026-06-30T13:00:34+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-06-2026\\\/\"},\"wordCount\":1101,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-06-2026\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-06-2026\\\/lumenshaders.jpg\",\"keywords\":[\"Tools for Designers & Developers\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-06-2026\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-06-2026\\\/\",\"name\":\"Fresh Resources for Web Designers and Developers (June 2026) - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-06-2026\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-06-2026\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-06-2026\\\/lumenshaders.jpg\",\"datePublished\":\"2026-06-30T13:00:34+00:00\",\"description\":\"June is as good a time as any to highlight new tools and resources for our fellow web developers. This month's batch covers everything from\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-06-2026\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-06-2026\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-06-2026\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-06-2026\\\/lumenshaders.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-06-2026\\\/lumenshaders.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-06-2026\\\/#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 (June 2026)\"}]},{\"@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 (June 2026) - Hongkiat","description":"June is as good a time as any to highlight new tools and resources for our fellow web developers. This month's batch covers everything from","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-06-2026\/","og_locale":"en_US","og_type":"article","og_title":"Fresh Resources for Web Designers and Developers (June 2026)","og_description":"June is as good a time as any to highlight new tools and resources for our fellow web developers. This month's batch covers everything from","og_url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2026-06-30T13:00:34+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-06-2026\/lumenshaders.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-06-2026\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"Fresh Resources for Web Designers and Developers (June 2026)","datePublished":"2026-06-30T13:00:34+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/"},"wordCount":1101,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-06-2026\/lumenshaders.jpg","keywords":["Tools for Designers & Developers"],"articleSection":["Web Design"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/","url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/","name":"Fresh Resources for Web Designers and Developers (June 2026) - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-06-2026\/lumenshaders.jpg","datePublished":"2026-06-30T13:00:34+00:00","description":"June is as good a time as any to highlight new tools and resources for our fellow web developers. This month's batch covers everything from","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-06-2026\/lumenshaders.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-06-2026\/lumenshaders.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-06-2026\/#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 (June 2026)"}]},{"@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-jmp","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/74425","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=74425"}],"version-history":[{"count":1,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/74425\/revisions"}],"predecessor-version":[{"id":74426,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/74425\/revisions\/74426"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=74425"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=74425"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=74425"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=74425"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}