[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"sanity-dqKmNyhthdcX-mmtMvt3ca5qvsltVr4bzT_QLhiiq38":3,"sanity-Rh9dZS41msF4OWpvQoQGrFrS11c4-gpb9sGbUPaYgtY":454},{"data":4,"sourceMap":-1},{"latestPodcast":5,"latestReleases":14,"post":39,"recent":429},[6],{"_id":7,"publishedAt":8,"slug":9,"sponsored":12,"title":13},"50f4509c-4f55-4f11-8adc-5556e821ea77","2026-06-30T07:40:00.000Z",{"_type":10,"current":11},"slug","why-intent-prediction-needs-more-than-an-llm",null,"Why intent prediction needs more than an LLM",[15,21,27,33],{"_id":16,"publishedAt":17,"slug":18,"title":20},"eb5b66eb-9410-4329-83bb-22bbff39402a","2026-04-28T13:00:00.000Z",{"_type":10,"current":19},"turn-scattered-knowledge-into-trusted-intelligence","Turning scattered knowledge into trusted intelligence: Stack Internal 2026.3",{"_id":22,"publishedAt":23,"slug":24,"title":26},"369c2401-b62e-4a37-8ff8-bf603023ecad","2026-03-02T15:03:00.988Z",{"_type":10,"current":25},"what-s-new-at-stack-overflow-march-2026","What’s new at Stack Overflow: March 2026",{"_id":28,"publishedAt":29,"slug":30,"title":32},"5e9053a4-07ea-447c-91ea-29e0b6228537","2026-02-02T15:00:00.000Z",{"_type":10,"current":31},"what-s-new-at-stack-overflow-february-2026","What’s new at Stack Overflow: February 2026",{"_id":34,"publishedAt":35,"slug":36,"title":38},"a1b538eb-a8a6-46d0-80a1-ac70ec9bb935","2026-01-05T10:00:00.000-05:00",{"_type":10,"current":37},"what-s-new-at-stack-overflow-january-2026","What’s new at Stack Overflow: January 2026",{"_createdAt":40,"_id":41,"_rev":42,"_type":43,"_updatedAt":44,"author":45,"body":76,"comments":382,"dateUrl":383,"excerpt":384,"image":385,"legacyBody":388,"product":12,"publishedAt":391,"slug":392,"sponsored":12,"tags":394,"title":428,"visible":382},"2023-05-25T09:39:17Z","wp-post-17629","9HpbCsT2tq0xwozQfkgDvL","blogPost","2023-07-13T14:55:55Z",[46,64],{"_createdAt":47,"_id":48,"_rev":49,"_system":50,"_type":53,"_updatedAt":54,"avatar":55,"employee":60,"name":61,"slug":62},"2023-05-23T16:27:18Z","wp-author-213","nRfzWrvFg3DIXOd15U9uv8",{"base":51},{"id":48,"rev":52},"9xJoPFf2DISyAMMJXP7Ct6","blogAuthor","2025-07-29T19:37:47Z",{"_type":56,"asset":57},"image",{"_ref":58,"_type":59},"image-e81c84dcaeb58be1002795a6544b595bd6fc8071-1024x1024-jpg","reference","former","Ben Popper",{"current":63},"benpopper",{"_createdAt":47,"_id":65,"_rev":66,"_type":53,"_updatedAt":67,"avatar":68,"bio":71,"employee":72,"name":73,"slug":74},"wp-author-cap-17633","07ZbrKPSUrjrV4wQ6fDpaa","2023-06-20T15:05:10Z",{"_type":56,"asset":69},{"_ref":70,"_type":59},"image-b650e8ac1685f03c7cd39f61125dbe6d0ec4724e-300x400-jpg","Jiwon Shin is a Curriculum Developer at Codecademy focusing on web development content. She is also an adjunct professor at New York University where she teaches web development and creative coding.","none","Jiwon Shin",{"current":75},"jiwon-shin",[77,111,179,251,280,288,318,348,352,360,371],{"_key":78,"_type":79,"children":80,"markDefs":104,"style":110},"aaf7e09d5f36","block",[81,86,91,95,100],{"_key":82,"_type":83,"marks":84,"text":85},"aaf7e09d5f360","span",[],"Programming isn't just about building websites and applications. It can also be a medium for expressing our thoughts and creativity. We're working with ",{"_key":87,"_type":83,"marks":88,"text":90},"aaf7e09d5f361",[89],"05fce60914c2","Codecademy",{"_key":92,"_type":83,"marks":93,"text":94},"aaf7e09d5f362",[]," to introduce learners to the world of creative coding with ",{"_key":96,"_type":83,"marks":97,"text":99},"aaf7e09d5f363",[98],"9169cd53ae3e","p5.js",{"_key":101,"_type":83,"marks":102,"text":103},"aaf7e09d5f364",[],", an open-source JavaScript library.",[105,108],{"_key":89,"_type":106,"href":107,"reference":12},"link","https://www.codecademy.com/?utm_source=stack_overflow&utm_medium=partners&utm_content=cclive_creative_so_1",{"_key":98,"_type":106,"href":109,"reference":12},"https://p5js.org/","normal",{"_key":112,"_type":79,"children":113,"markDefs":167,"style":110},"c043c346626f",[114,118,122,127,131,136,140,145,149,154,158,163],{"_key":115,"_type":83,"marks":116,"text":99},"c043c346626f0",[117],"4deb503e2fee",{"_key":119,"_type":83,"marks":120,"text":121},"c043c346626f1",[]," was developed by the artist and programmer ",{"_key":123,"_type":83,"marks":124,"text":126},"c043c346626f2",[125],"957018d96ff1","Lauren McCarthy",{"_key":128,"_type":83,"marks":129,"text":130},"c043c346626f3",[]," with support from the ",{"_key":132,"_type":83,"marks":133,"text":135},"c043c346626f4",[134],"971bc3307f71","Processing Foundation",{"_key":137,"_type":83,"marks":138,"text":139},"c043c346626f5",[],". It was inspired by ",{"_key":141,"_type":83,"marks":142,"text":144},"c043c346626f6",[143],"219a37d3cc28","Processing",{"_key":146,"_type":83,"marks":147,"text":148},"c043c346626f7",[],", a flexible software sketchbook created by ",{"_key":150,"_type":83,"marks":151,"text":153},"c043c346626f8",[152],"73efd3101a69","Casey Reas",{"_key":155,"_type":83,"marks":156,"text":157},"c043c346626f9",[]," and ",{"_key":159,"_type":83,"marks":160,"text":162},"c043c346626f10",[161],"6325bac16c89","Ben Fry",{"_key":164,"_type":83,"marks":165,"text":166},"c043c346626f11",[]," that allows users to program visualizations using the Java programming language. p5.js was created as a version of Processing for the web. First released in 2014, it has since grown in popularity as a tool that makes programming accessible for artists, designers, educators, beginners, and anyone else!",[168,169,171,173,175,177],{"_key":117,"_type":106,"href":109,"reference":12},{"_key":125,"_type":106,"href":170,"reference":12},"https://lauren-mccarthy.com/",{"_key":134,"_type":106,"href":172,"reference":12},"https://processingfoundation.org/",{"_key":143,"_type":106,"href":174,"reference":12},"https://processing.org/",{"_key":152,"_type":106,"href":176,"reference":12},"http://reas.com/",{"_key":161,"_type":106,"href":178,"reference":12},"https://benfry.com/",{"_key":180,"_type":79,"children":181,"markDefs":238,"style":110},"e039b1923592",[182,186,191,195,200,203,208,212,217,220,225,229,234],{"_key":183,"_type":83,"marks":184,"text":185},"e039b19235920",[],"The goal of creative coding is to create something expressive. It’s like drawing, but with code! The kinds of creative work you can code is limitless. You can make ",{"_key":187,"_type":83,"marks":188,"text":190},"e039b19235921",[189],"3975e533d758","generative visualizations",{"_key":192,"_type":83,"marks":193,"text":194},"e039b19235922",[]," using ",{"_key":196,"_type":83,"marks":197,"text":199},"e039b19235923",[198],"0bd640941acd","shapes",{"_key":201,"_type":83,"marks":202,"text":157},"e039b19235924",[],{"_key":204,"_type":83,"marks":205,"text":207},"e039b19235925",[206],"533baa20e8f6","text",{"_key":209,"_type":83,"marks":210,"text":211},"e039b19235926",[],", ",{"_key":213,"_type":83,"marks":214,"text":216},"e039b19235927",[215],"c9220397572e","data visualizations",{"_key":218,"_type":83,"marks":219,"text":211},"e039b19235928",[],{"_key":221,"_type":83,"marks":222,"text":224},"e039b19235929",[223],"2c8f6ac4dcac","immersive experiences",{"_key":226,"_type":83,"marks":227,"text":228},"e039b192359210",[],", and ",{"_key":230,"_type":83,"marks":231,"text":233},"e039b192359211",[232],"ed0de9bb4fab","interactive films",{"_key":235,"_type":83,"marks":236,"text":237},"e039b192359212",[],". p5.js is a good place to start regardless of how much coding experience you have because of its convenient developer environment, extensive documentation, and active community.",[239,241,243,245,247,249],{"_key":189,"_type":106,"href":240,"reference":12},"https://en.wikipedia.org/wiki/Generative_art",{"_key":198,"_type":106,"href":242,"reference":12},"http://mariuswatz.com/works/abstract01js/",{"_key":206,"_type":106,"href":244,"reference":12},"https://benfry.com/safire/",{"_key":215,"_type":106,"href":246,"reference":12},"http://jillhubley.com/project/nyctrees/",{"_key":223,"_type":106,"href":248,"reference":12},"http://flong.com/archive/projects/augmented-hand-series/",{"_key":232,"_type":106,"href":250,"reference":12},"https://stonewallforever.org/",{"_key":252,"_type":79,"children":253,"markDefs":275,"style":110},"f49994c7aa62",[254,258,263,267,271],{"_key":255,"_type":83,"marks":256,"text":257},"f49994c7aa620",[],"The ",{"_key":259,"_type":83,"marks":260,"text":262},"f49994c7aa621",[261],"8db777477e7d","Codecademy Live: Creative Coding",{"_key":264,"_type":83,"marks":265,"text":266},"f49994c7aa622",[]," series will be hosted by ",{"_key":268,"_type":83,"marks":269,"text":73},"f49994c7aa623",[270],"3a558fb08dbc",{"_key":272,"_type":83,"marks":273,"text":274},"f49994c7aa624",[],", a Curriculum Developer at Codecademy and creator of the Learn p5.js course. She is also an adjunct professor at New York University where she teaches web development and creative coding.",[276,278],{"_key":261,"_type":106,"href":277,"reference":12},"https://news.codecademy.com/join-us-for-codecademy-live-creative-coding/",{"_key":270,"_type":106,"href":279,"reference":12},"http://jiwonshin.com/",{"_key":281,"_type":79,"children":282,"markDefs":287,"style":110},"f2658f4aa9bd",[283],{"_key":284,"_type":83,"marks":285,"text":286},"f2658f4aa9bd0",[],"The live series will start by learning how to use p5.js to draw 2D primitive shapes and work our way up to turning our drawings into animations. We then learn how to add user interaction to our visual programs and utilize media assets such as images and videos within our drawings.",[],{"_key":289,"_type":79,"children":290,"markDefs":313,"style":110},"c388a6e5bd04",[291,295,300,304,309],{"_key":292,"_type":83,"marks":293,"text":294},"c388a6e5bd040",[],"Throughout the series, we'll be covering topics from the ",{"_key":296,"_type":83,"marks":297,"text":299},"c388a6e5bd041",[298],"6deda66ab21a","Learn p5.js",{"_key":301,"_type":83,"marks":302,"text":303},"c388a6e5bd042",[]," course and beyond. Both the stream and the course are free to everyone! The stream will be a good complement to the content covered in the course—we recommend you follow along with the series while progressing through the course. We'll be live at 4pm EST today. If you want to join, you can find the video ",{"_key":305,"_type":83,"marks":306,"text":308},"c388a6e5bd043",[307],"7bd5b5ec07d9","here",{"_key":310,"_type":83,"marks":311,"text":312},"c388a6e5bd044",[],".",[314,316],{"_key":298,"_type":106,"href":315,"reference":12},"https://www.codecademy.com/learn/learn-p5js?utm_source=stack_overflow&utm_medium=partners&utm_content=cclive_creative_so_1",{"_key":307,"_type":106,"href":317,"reference":12},"https://www.youtube.com/watch?v=fqkdBC7Ki00",{"_key":319,"_type":79,"children":320,"markDefs":343,"style":110},"0e1d335672c1",[321,325,330,334,339],{"_key":322,"_type":83,"marks":323,"text":324},"0e1d335672c10",[],"In the first session of the live series, we'll start by examining the file structure of a p5.js project. We'll talk about the canvas element and how we can use p5.js built-in variables and functions to create 2D drawings. We will move on to the ",{"_key":326,"_type":83,"marks":327,"text":329},"0e1d335672c11",[328],"a386e3f4ca65","Wall Drawing",{"_key":331,"_type":83,"marks":332,"text":333},"0e1d335672c12",[]," project in the first module of our p5.js course to create a digital wall drawing inspired by the artist ",{"_key":335,"_type":83,"marks":336,"text":338},"0e1d335672c13",[337],"be35fec81843","Sol LeWit",{"_key":340,"_type":83,"marks":341,"text":342},"0e1d335672c14",[]," (1928-2007).",[344,346],{"_key":328,"_type":106,"href":345,"reference":12},"https://www.codecademy.com/courses/learn-p5js/projects/p5js-wall-drawing?utm_source=ccblog&utm_medium=ccblog&utm_campaign=cclive_creative_coding&utm_content=cclive_creative_coding_blog",{"_key":337,"_type":106,"href":347,"reference":12},"https://en.wikipedia.org/wiki/Sol_LeWitt",{"_key":349,"_type":350,"markDefs":12,"url":351},"a07445e22bdd","embed","https://www.youtube.com/embed/vR06jWwfQ3I?start=62",{"_key":353,"_type":79,"children":354,"markDefs":359,"style":110},"bb2df4efa486",[355],{"_key":356,"_type":83,"marks":357,"text":358},"bb2df4efa4860",[],"Relevant Stack Overflow questions:",[],{"_key":361,"_type":79,"children":362,"markDefs":368,"style":110},"d89dc8b69efe",[363],{"_key":364,"_type":83,"marks":365,"text":367},"d89dc8b69efe0",[366],"cf0d76344c91","How does the p5 setup() function work?",[369],{"_key":366,"_type":106,"href":370,"reference":12},"https://stackoverflow.com/questions/66289062/how-does-p5-js-make-function-setup-work-like-this",{"_key":372,"_type":79,"children":373,"markDefs":379,"style":110},"515574f82817",[374],{"_key":375,"_type":83,"marks":376,"text":378},"515574f828170",[377],"a99008247867","Trying to get responsive window & shapes using p5.js",[380],{"_key":377,"_type":106,"href":381,"reference":12},"https://stackoverflow.com/questions/47125752/trying-to-get-responsive-window-shapes-using-p5-js",true,"2021/03/16","In the second edition of our Level Up series, we explore how to create shapes, animations, and art using p5.js.",{"_type":56,"asset":386},{"_ref":387,"_type":59},"image-a743776940b4b4a76ba838bdcf211688bcc56ca1-2400x1240-png",{"code":389,"language":390},"\u003C!-- wp:paragraph -->\n\u003Cp>Programming isn't just about building websites and applications. It can also be a medium for expressing our thoughts and creativity. We're working with \u003Ca href=\"https://www.codecademy.com/?utm_source=stack_overflow&utm_medium=partners&utm_content=cclive_creative_so_1\">Codecademy\u003C/a> to introduce learners to the world of creative coding with \u003Ca href=\"https://p5js.org/\">p5.js\u003C/a>, an open-source JavaScript library. \u003C/p>\n\u003C!-- /wp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>\u003Ca href=\"https://p5js.org/\">p5.js\u003C/a> was developed by the artist and programmer \u003Ca href=\"https://lauren-mccarthy.com/\">Lauren McCarthy\u003C/a> with support from the \u003Ca href=\"https://processingfoundation.org/\">Processing Foundation\u003C/a>. It was inspired by \u003Ca href=\"https://processing.org/\">Processing\u003C/a>, a flexible software sketchbook created by \u003Ca href=\"http://reas.com/\">Casey Reas\u003C/a> and \u003Ca href=\"https://benfry.com/\">Ben Fry\u003C/a> that allows users to program visualizations using the Java programming language. p5.js was created as a version of Processing for the web. First released in 2014, it has since grown in popularity as a tool that makes programming accessible for artists, designers, educators, beginners, and anyone else!\u003C/p>\n\u003C!-- /wp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>The goal of creative coding is to create something expressive. It’s like drawing, but with code! The kinds of creative work you can code is limitless. You can make \u003Ca href=\"https://en.wikipedia.org/wiki/Generative_art\">generative visualizations\u003C/a> using \u003Ca href=\"http://mariuswatz.com/works/abstract01js/\">shapes\u003C/a> and \u003Ca href=\"https://benfry.com/safire/\">text\u003C/a>, \u003Ca href=\"http://jillhubley.com/project/nyctrees/\">data visualizations\u003C/a>, \u003Ca href=\"http://flong.com/archive/projects/augmented-hand-series/\">immersive experiences\u003C/a>, and \u003Ca href=\"https://stonewallforever.org/\">interactive films\u003C/a>. p5.js is a good place to start regardless of how much coding experience you have because of its convenient developer environment, extensive documentation, and active community.\u003C/p>\n\u003C!-- /wp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>The \u003Ca href=\"https://news.codecademy.com/join-us-for-codecademy-live-creative-coding/\">Codecademy Live: Creative Coding\u003C/a> series will be hosted by \u003Ca href=\"http://jiwonshin.com/\">Jiwon Shin\u003C/a>, a Curriculum Developer at Codecademy and creator of the Learn p5.js course. She is also an adjunct professor at New York University where she teaches web development and creative coding.\u003C/p>\n\u003C!-- /wp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>The live series will start by learning how to use p5.js to draw 2D primitive shapes and work our way up to turning our drawings into animations. We then learn how to add user interaction to our visual programs and utilize media assets such as images and videos within our drawings.\u003C/p>\n\u003C!-- /wp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Throughout the series, we'll be covering topics from the \u003Ca href=\"https://www.codecademy.com/learn/learn-p5js?utm_source=stack_overflow&utm_medium=partners&utm_content=cclive_creative_so_1\">Learn p5.js\u003C/a> course and beyond. Both the stream and the course are free to everyone! The stream will be a good complement to the content covered in the course—we recommend you follow along with the series while progressing through the course. We'll be live at 4pm EST today. If you want to join, you can find the video \u003Ca href=\"https://www.youtube.com/watch?v=fqkdBC7Ki00\">here\u003C/a>.\u003C/p>\n\u003C!-- /wp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>In the first session of the live series, we'll start by examining the file structure of a p5.js project. We'll talk about the canvas element and how we can use p5.js built-in variables and functions to create 2D drawings. We will move on to the \u003Ca href=\"https://www.codecademy.com/courses/learn-p5js/projects/p5js-wall-drawing?utm_source=ccblog&utm_medium=ccblog&utm_campaign=cclive_creative_coding&utm_content=cclive_creative_coding_blog\">Wall Drawing\u003C/a> project in the first module of our p5.js course to create a digital wall drawing inspired by the artist \u003Ca href=\"https://en.wikipedia.org/wiki/Sol_LeWitt\">Sol LeWit\u003C/a> (1928-2007).\u003C/p>\n\u003C!-- /wp:paragraph -->\n\n\u003C!-- wp:html -->\n\u003Ciframe width=\"560\" height=\"500\" src=\"https://www.youtube.com/embed/vR06jWwfQ3I?start=62\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen=\"\">\u003C/iframe>\n\u003C!-- /wp:html -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>Relevant Stack Overflow questions:\u003C/p>\n\u003C!-- /wp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>\u003Ca href=\"https://stackoverflow.com/questions/66289062/how-does-p5-js-make-function-setup-work-like-this\">How does the p5 setup() function work?\u003C/a>\u003C/p>\n\u003C!-- /wp:paragraph -->\n\n\u003C!-- wp:paragraph -->\n\u003Cp>\u003Ca href=\"https://stackoverflow.com/questions/47125752/trying-to-get-responsive-window-shapes-using-p5-js\">Trying to get responsive window & shapes using p5.js\u003C/a>\u003C/p>\n\u003C!-- /wp:paragraph -->","html","2021-03-16T19:39:53.000Z",{"current":393},"level-up-creative-coding-with-p5-js-part-1",[395,402,406,411,415,419,424],{"_createdAt":396,"_id":397,"_rev":398,"_type":399,"_updatedAt":396,"slug":400,"title":401},"2023-05-23T16:43:21Z","wp-tagcat-animation","9HpbCsT2tq0xwozQfkc4ih","blogTag",{"current":401},"animation",{"_createdAt":396,"_id":403,"_rev":398,"_type":399,"_updatedAt":396,"slug":404,"title":405},"wp-tagcat-art",{"current":405},"art",{"_createdAt":396,"_id":407,"_rev":398,"_type":399,"_updatedAt":396,"slug":408,"title":410},"wp-tagcat-code-for-a-living",{"current":409},"code-for-a-living","Code for a Living",{"_createdAt":396,"_id":412,"_rev":398,"_type":399,"_updatedAt":396,"slug":413,"title":414},"wp-tagcat-creative",{"current":414},"creative",{"_createdAt":396,"_id":416,"_rev":398,"_type":399,"_updatedAt":396,"slug":417,"title":418},"wp-tagcat-education",{"current":418},"education",{"_createdAt":396,"_id":420,"_rev":398,"_type":399,"_updatedAt":396,"slug":421,"title":423},"wp-tagcat-level-up",{"current":422},"level-up","level up",{"_createdAt":396,"_id":425,"_rev":398,"_type":399,"_updatedAt":396,"slug":426,"title":99},"wp-tagcat-p5-js",{"current":427},"p5-js","Level Up: Creative coding with p5.js - part 1",[430,436,442,448],{"_id":431,"publishedAt":432,"slug":433,"sponsored":12,"title":435},"28e560af-f0aa-4d46-bd90-f435ad604aa7","2026-06-26T14:00:27.102Z",{"_type":10,"current":434},"paging-charity-how-can-engineering-leaders-avoid-becoming-bond-villains","Paging Charity! How can engineering leaders avoid becoming Bond villains?",{"_id":437,"publishedAt":438,"slug":439,"sponsored":12,"title":441},"4b22c2a3-3779-4966-93eb-5230391dbdce","2026-06-23T14:08:58.595Z",{"_type":10,"current":440},"your-ai-shipped-a-backend-that-boots-that-is-the-whole-problem","Your AI shipped a backend that boots. That is the whole problem.",{"_id":443,"publishedAt":444,"slug":445,"sponsored":12,"title":447},"5cf362e1-fe7b-45af-b69c-914731c6a052","2026-06-23T14:00:00.000Z",{"_type":10,"current":446},"the-2026-developer-survey-is-now-open-for-human-developers-only","The 2026 Developer Survey is now open (for human developers only)!",{"_id":449,"publishedAt":450,"slug":451,"sponsored":12,"title":453},"30b995f7-7cb9-4dd8-bf71-d0685940a32b","2026-06-19T14:00:00.000Z",{"_type":10,"current":452},"dispatches-from-o-reilly-from-capabilities-to-responsibilities","Dispatches from O'Reilly: From capabilities to responsibilities",{"data":455,"sourceMap":-1},{"count":456,"lastTimestamp":457},3,"2023-05-25T09:47:33Z"]