{"id":2,"date":"2025-06-25T14:33:30","date_gmt":"2025-06-25T14:33:30","guid":{"rendered":"https:\/\/www.shawntgray.com\/blog\/?page_id=2"},"modified":"2025-07-01T15:04:45","modified_gmt":"2025-07-01T19:04:45","slug":"home","status":"publish","type":"page","link":"https:\/\/www.shawntgray.com\/blog\/","title":{"rendered":"Homepage"},"content":{"rendered":"\n<p class=\"has-border-color has-primary-color has-neutral-background-color has-text-color has-background has-link-color has-large-font-size wp-elements-dde399a6d6a7f7fd2768d5800aa2223e\" style=\"border-color:#f96e46;border-style:dotted;border-radius:10px;padding-top:var(--wp--preset--spacing--small);padding-right:var(--wp--preset--spacing--small);padding-bottom:var(--wp--preset--spacing--small);padding-left:var(--wp--preset--spacing--small);font-style:normal;font-weight:300\">This is <strong>Behind the Build<\/strong>! Read helpful insights, tutorials, and real-world projects focused on <strong>front-end web development<\/strong>, <strong>WordPress<\/strong>, and <strong>user-centered design<\/strong>. Whether you&#8217;re a web developer, designer, or just curious about how great websites and apps are made, you&#8217;ll find practical tips and creative inspiration for the web-building process.<\/p>\n\n\n<ul style=\"border-radius:10px; padding-top:var(--wp--preset--spacing--x-small);padding-bottom:var(--wp--preset--spacing--x-small);padding-left:var(--wp--preset--spacing--x-small);padding-right:var(--wp--preset--spacing--x-small);margin-top:var(--wp--preset--spacing--small);margin-bottom:var(--wp--preset--spacing--small);\" class=\"wp-block-latest-posts__list alignwide wp-block-latest-posts has-background has-neutral-background-color\"><li><div class=\"wp-block-latest-posts__featured-image alignleft\"><a href=\"https:\/\/www.shawntgray.com\/blog\/how-to-build-an-art-gallery-with-react-part-1-get-started\/\" aria-label=\"How to Build an Art Gallery with React &#8211; Part 1: Get Started\"><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"150\" src=\"https:\/\/www.shawntgray.com\/blog\/wp-content\/uploads\/2025\/06\/gallery-screenshot-150x150.webp\" class=\"attachment-thumbnail size-thumbnail wp-post-image\" alt=\"React Art Image Gallery Screenshot\" style=\"\" \/><\/a><\/div><a class=\"wp-block-latest-posts__post-title\" href=\"https:\/\/www.shawntgray.com\/blog\/how-to-build-an-art-gallery-with-react-part-1-get-started\/\">How to Build an Art Gallery with React &#8211; Part 1: Get Started<\/a><div class=\"wp-block-latest-posts__post-excerpt\">Learn how to build a fully responsive filterable image gallery with React Javascript and CSS. Perfect for artistic portfolios and unique photo albums!<\/div><\/li>\n<li><div class=\"wp-block-latest-posts__featured-image alignleft\"><a href=\"https:\/\/www.shawntgray.com\/blog\/how-to-build-an-art-gallery-with-react-part-2-set-the-stage\/\" aria-label=\"How to Build an Art Gallery with React \u2013 Part 2: Set the Stage\"><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"150\" src=\"https:\/\/www.shawntgray.com\/blog\/wp-content\/uploads\/2025\/06\/gallery-screenshot-150x150.webp\" class=\"attachment-thumbnail size-thumbnail wp-post-image\" alt=\"React Art Image Gallery Screenshot\" style=\"\" \/><\/a><\/div><a class=\"wp-block-latest-posts__post-title\" href=\"https:\/\/www.shawntgray.com\/blog\/how-to-build-an-art-gallery-with-react-part-2-set-the-stage\/\">How to Build an Art Gallery with React \u2013 Part 2: Set the Stage<\/a><div class=\"wp-block-latest-posts__post-excerpt\">In this lesson, you will learn how to build a JSON data file and begin building your app&#8217;s base React components.<\/div><\/li>\n<li><div class=\"wp-block-latest-posts__featured-image alignleft\"><a href=\"https:\/\/www.shawntgray.com\/blog\/how-to-build-an-art-gallery-with-react-part-3-components\/\" aria-label=\"How to Build an Art Gallery with React \u2013 Part 3: Components\"><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"150\" src=\"https:\/\/www.shawntgray.com\/blog\/wp-content\/uploads\/2025\/06\/gallery-screenshot-150x150.webp\" class=\"attachment-thumbnail size-thumbnail wp-post-image\" alt=\"React Art Image Gallery Screenshot\" style=\"\" \/><\/a><\/div><a class=\"wp-block-latest-posts__post-title\" href=\"https:\/\/www.shawntgray.com\/blog\/how-to-build-an-art-gallery-with-react-part-3-components\/\">How to Build an Art Gallery with React \u2013 Part 3: Components<\/a><div class=\"wp-block-latest-posts__post-excerpt\">Add building block components to your React-based Art Gallery. Learn about how properties and actions flow from parent to child and back again.<\/div><\/li>\n<li><div class=\"wp-block-latest-posts__featured-image alignleft\"><a href=\"https:\/\/www.shawntgray.com\/blog\/how-to-build-an-art-gallery-with-react-part-4-filter-images\/\" aria-label=\"How to Build an Art Gallery with React \u2013 Part 4: Filter Images\"><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"150\" src=\"https:\/\/www.shawntgray.com\/blog\/wp-content\/uploads\/2025\/06\/gallery-screenshot-150x150.webp\" class=\"attachment-thumbnail size-thumbnail wp-post-image\" alt=\"React Art Image Gallery Screenshot\" style=\"\" \/><\/a><\/div><a class=\"wp-block-latest-posts__post-title\" href=\"https:\/\/www.shawntgray.com\/blog\/how-to-build-an-art-gallery-with-react-part-4-filter-images\/\">How to Build an Art Gallery with React \u2013 Part 4: Filter Images<\/a><div class=\"wp-block-latest-posts__post-excerpt\">Add crucial interactivity to your Art Gallery React App by building filter functionality. Dynamically create filter buttons by pulling data from your JSON.<\/div><\/li>\n<li><div class=\"wp-block-latest-posts__featured-image alignleft\"><a href=\"https:\/\/www.shawntgray.com\/blog\/how-to-build-an-art-gallery-with-react-part-5-add-cool-features\/\" aria-label=\"How to Build an Art Gallery with React \u2013 Part 5: Add Cool Features\"><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"150\" src=\"https:\/\/www.shawntgray.com\/blog\/wp-content\/uploads\/2025\/06\/gallery-screenshot-150x150.webp\" class=\"attachment-thumbnail size-thumbnail wp-post-image\" alt=\"React Art Image Gallery Screenshot\" style=\"\" \/><\/a><\/div><a class=\"wp-block-latest-posts__post-title\" href=\"https:\/\/www.shawntgray.com\/blog\/how-to-build-an-art-gallery-with-react-part-5-add-cool-features\/\">How to Build an Art Gallery with React \u2013 Part 5: Add Cool Features<\/a><div class=\"wp-block-latest-posts__post-excerpt\">Learn how to add functionality to view images in full-screen popup windows. Also, add a shuffle function for some extra fun flair.<\/div><\/li>\n<li><div class=\"wp-block-latest-posts__featured-image alignleft\"><a href=\"https:\/\/www.shawntgray.com\/blog\/how-to-build-an-art-gallery-with-react-part-6-wrap-up\/\" aria-label=\"How to Build an Art Gallery with React \u2013 Part 6: Wrap Up\"><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"150\" src=\"https:\/\/www.shawntgray.com\/blog\/wp-content\/uploads\/2025\/06\/gallery-screenshot-150x150.webp\" class=\"attachment-thumbnail size-thumbnail wp-post-image\" alt=\"React Art Image Gallery Screenshot\" style=\"\" \/><\/a><\/div><a class=\"wp-block-latest-posts__post-title\" href=\"https:\/\/www.shawntgray.com\/blog\/how-to-build-an-art-gallery-with-react-part-6-wrap-up\/\">How to Build an Art Gallery with React \u2013 Part 6: Wrap Up<\/a><div class=\"wp-block-latest-posts__post-excerpt\">Finalize your React Art Gallery App. Learn how to build the project to launch on your website. Take on some challenges to level up your React skills!<\/div><\/li>\n<\/ul>","protected":false},"excerpt":{"rendered":"<p>This is Behind the Build! Read helpful insights, tutorials, and real-world projects focused on front-end web development, WordPress, and user-centered design. Whether you&#8217;re a web developer, designer, or just curious about how great websites and apps are made, you&#8217;ll find practical tips and creative inspiration for the web-building process.<\/p>\n","protected":false},"author":1,"featured_media":20,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-2","page","type-page","status-publish","has-post-thumbnail","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.shawntgray.com\/blog\/wp-json\/wp\/v2\/pages\/2","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.shawntgray.com\/blog\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.shawntgray.com\/blog\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.shawntgray.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.shawntgray.com\/blog\/wp-json\/wp\/v2\/comments?post=2"}],"version-history":[{"count":4,"href":"https:\/\/www.shawntgray.com\/blog\/wp-json\/wp\/v2\/pages\/2\/revisions"}],"predecessor-version":[{"id":83,"href":"https:\/\/www.shawntgray.com\/blog\/wp-json\/wp\/v2\/pages\/2\/revisions\/83"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.shawntgray.com\/blog\/wp-json\/wp\/v2\/media\/20"}],"wp:attachment":[{"href":"https:\/\/www.shawntgray.com\/blog\/wp-json\/wp\/v2\/media?parent=2"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}