Building on our simple React app, Aurooba demonstrates a component and sets up state to track variables. While discussing return statements, Brian cringes about JSX and mixing HTML with JavaScript. They also discuss how a function can return more than one variable in modern JavaScript.A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!The source code from the episode – https://github.com/viewSourcePodcast/viewSource-blocks/tree/add/accordion-block @wordpress/scripts – https://developer.wordpress.org/block-editor/reference-guides/packages/packages-scripts/ @wordpress/element - https://developer.wordpress.org/block-editor/reference-guides/packages/packages-element/ Brian's website – https://www.briancoords.com Aurooba's website – https://aurooba.com (00:00) - Introduction (01:10) - The Return in React Components(07:39) - Setting up State with @wordpress/element(10:25) - Destructuring and Getting Multiple Values from a Function(14:05) - Calling Event Functions in JSX(16:06) - Frontend Recap and Next Steps

Dig into what React is and how it works, especially inside WordPress, with Aurooba and Brian as they set up the basic environment and load up a little React component inside a WordPress post. Part one of a series of episodes where they'll transform their code into a working accordion block.A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!The source code from the episode – https://github.com/viewSourcePodcast/viewSource-blocks/tree/add/accordion-block @wordpress/scripts – https://developer.wordpress.org/block-editor/reference-guides/packages/packages-scripts/ Wes Bos' courses – https://wesbos.com/courses The "Learn JavaScript Deeply" moment in WordPress history – https://youtu.be/TX6dXRL-jPU?t=3536 Brian's website – https://www.briancoords.com Aurooba's website – https://aurooba.com (00:00) - Introduction(00:26) - Learn JavaScript Deeply(02:59) - What is React?(06:37) - Comparing React to other familiar WordPress tech(08:36) - A React-ive "Hello World"(10:02) - @wordpress/scripts and the scary part of React(11:21) - Setting up a basic index.js in React(12:12) - React and @wordpress/element(14:09) - Outputting the React app with createRoot(18:27) - Exporting and importing functions in React(22:12) - Breaking your code up into smaller files(23:39) - Concluding Part 1!(24:21) - Outro

Two long-time remote workers share their history and their best practices for working from home. Aurooba covers how to socialize yourself and fight loneliness, and Brian shares his tips for creating boundaries when you have five kids outside your office door all day. They discuss some of the tools they use, the best ways to have asynchronous conversations, and how to tame Slack.A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!Cal NewportHow to communicate effectively as a developerBrian's website – https://www.briancoords.com Aurooba's website – https://aurooba.com (00:00) - Introduction(04:05) - Our first remote jobs (07:53) - Overall thoughts on remote work (08:51) - Socializing and loneliness in remote work (11:33) - Tools and rituals for creating boundaries(13:44) - Chrome versus Safari(17:46) - Communication, Chat, and Notifications(22:50) - Timezones and Async Conversations(26:11) - Synchronous Meetings (28:18) - Our advice for remote work

Brian walks Aurooba through how Bootstrap works and the conversation turns into a discussion about common design languages and the core concepts of CSS most people, frameworks, and systems employ. They also talk about the role frameworks like Bootstrap play in modern WordPress development and whether they are even necessary. 🤔A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!Bootstrap documentation – https://getbootstrap.com/docs/5.0/getting-started/introduction/ Bootstrap variables.scss file – https://github.com/twbs/bootstrap/blob/main/scss/_variables.scss Brian's website – https://www.briancoords.com Aurooba's website – https://aurooba.com (00:00) - Introduction(07:39) - The history of Bootstrap(10:32) - The pros and cons of Bootstrap(14:56) - Cascading style decisions with Bootstrap(17:12) - The variables file to rule them all(20:18) - Diving into utility classes(22:23) - Utility classes in other frameworks and WordPress(24:38) - When does Bootstrap make sense?(27:03) - Modern WordPress theming and CSS frameworks

Continuing where they left off, Aurooba and Brian recap their experience with ACF Blocks. Next, they look at two different ways to create native WordPress blocks: using nested inner blocks and using React components. They discuss the pros and cons of all three methods, how to plan your blocks, and when to just use block patterns.A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!The code from the episode - https://github.com/viewSourcePodcast/viewSource-blocks Brian + ACF Team – https://twitter.com/briancoords/status/1620442914110447619 Brian’s ACF Blog Post - https://www.briancoords.com/documentation-for-dummies-like-me/ Brian's website – https://www.briancoords.com Aurooba's website – https://aurooba.com (00:00) - Part 2: ACF Blocks vs Native Blocks(00:12) - Introduction and ACF's documentation(03:02) - Reviewing Aurooba's ACF block(05:55) - Estimated timeframe for different types of blocks(06:58) - A native block with innerBlocks(09:57) - The native block with React components(13:08) - Inner blocks versus block patterns(17:08) - The code behind the " wrapper" block(19:47) - Deciding which type of block to build(21:37) - Building a block with React components(24:52) - Matching the block editor's UI(28:21) - Wrap up - how to decide?

Aurooba and Brian dig into ACF Blocks and how taking a design from mockup to built with the Block Editor requires a mindset adjustment. They also talk through the code of a real ACF Block, coding LIVE on the episode and discussing the pros and cons of ACF Blocks versus native blocks – with support from GitHub Copilot, of course. A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!ACF Blocks – https://www.advancedcustomfields.com/resources/blocks/ Brian's website – https://briancoords.com/ Aurooba's website – https://aurooba.com (00:00) - Digging into ACF Blocks for the Block Editor(01:18) - Our ACF origin stories(03:38) - Switching to ACF Blocks from Flexible Content Rows(06:32) - The pros and cons of JSON(08:18) - Building blocks without a build process(09:20) - The two main types of blocks(12:34) - Why Aurooba never tried ACF Blocks before(13:57) - The fragility of blocks in the early days(15:25) - Approaching design atomically instead of as rows and columns(20:06) - Building a block with ACF Blocks(23:25) - Enabling Core Supports in ACF Blocks (26:11) - Live Coding: Adding background color support to the block(31:37) - Are ACF Blocks here to stay?

Brian gets Aurooba to spill all the details about how she starts a new client website project. They discuss the tech stack, when to use WordPress, using plugins versus custom coding, and more. Then they dig into her project management and communication best practices, including her preposterous claim that she’s actually taught clients how to record and send her Loom videos. Oh- and they each share their best stories of projects that went completely off the rails.A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!Brian's website – https://briancoords.com/ Aurooba's website – https://aurooba.com

Today’s episode explores the range of local WordPress environments, starting with MAMP and making it to Docker, Vagrant, and Local WP. Brian discusses the built-in WordPress local dev tool, @wordpress/env and the state of documentation. Somewhere along the way, Aurooba explains the difference between mamp-stacks and Docker.Local WP doesn't use Docker or any kind of virtualization anymore. Thanks for the correction, Andy! Learn more about that change here.A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!ServerPress is Shutting Down - https://wptavern.com/serverpress-is-shutting-downLocal WP - https://localwp.com/Block Editor Handbook - @wordpress/env  - https://developer.wordpress.org/block-editor/reference-guides/packages/packages-env/MAMP PRO - https://www.mamp.info/en/mamp-pro/windows/DevKinsta - https://kinsta.com/devkinsta/Kana by Chris Weigman - https://chriswiegman.com/2022/09/introducing-kana-a-simple-and-powerful-wordpress-development-environment/Lando - https://lando.dev/Brian's website – https://briancoords.com/Aurooba's website – https://aurooba.com

Listen in as Aurooba and Brian recount their experience of trying out GitHub Copilot, debate its gender (!!), how it will affect developers in and out of the WordPress space, and what the current and possible future ethical concerns could be with AI coders. And it wouldn’t be a conversation between them if they didn’t digress into a tangent or two, of course.A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!GitHub Copilot – https://github.com/features/copilotChatGPT – https://openai.com/blog/chatgpt/Watch ChatGPT and Midjourney build a complete website – https://www.youtube.com/watch?v=8I3NTE4cn5sBrian's article about GitHub CoPilot on MasterWP – https://masterwp.com/getting-cozy-with-github-copilot/Brian's website – https://briancoords.com/Aurooba's website – https://aurooba.com

Introducing viewSource: a weekly conversation around tech, web development, and WordPress with hosts Aurooba Ahmed and Brian Coords. Listen in to learn a little about the hosts, their backgrounds, and the types of conversations you can expect to eavesdrop on in future episodes.A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first!viewSource website - https://viewsource.fm  Brian's website – https://www.briancoords.com Aurooba's website – https://aurooba.com