COMPRESSEDfm

In this episode, James talks about his experience using SvelteKit to re-create the famous guessing game, Wordle.SponsorsZEALZEAL is a computer software agency that delivers “the world’s most zealous” and custom solutions. The company plans and develops web and mobile applications that consistently help clients draw in customers, foster engagement, scale technologies, and ensure delivery.ZEAL believes that a business is “only as strong as” its team and cares about culture, values, a transparent process, leveling up, giving back, and providing excellent equipment. The company has staffers distributed throughout the United States, and as it continues to grow, ZEAL looks for collaborative, object-oriented, and organized individuals to apply for open roles.For more information visit codingzeal.comVercelVercel combines the best developer experience with an obsessive focus on end-user performance. Their platform enables frontend teams to do their best work. It is the best place to deploy any frontend app. Start by deploying with zero configuration to their global edge network. Scale dynamically to millions of pages without breaking a sweat.For more information, visit Vercel.comDatoCMSDatoCMS is a complete and performant headless CMS built to offer the best developer experience and user-friendliness in the market. It features a rich, CDN-powered GraphQL API (with realtime updates!), a super-flexible way to handle dynamic layouts and structured content, and best-in-class image/video support, with progressive/LQIP image loading out-of-the-box."For more information, visit datocms.comShow Notes00:00:00 - Intro00:03:57 - Svelte vs SvelteKit and Wordle00:10:29 - Sponsor: Vercel00:11:36 - How Wordle Works00:15:51 - SvelteKit Stores for Game State00:19:01 - Sponsor: Zeal00:19:53 - More on Game State00:21:33 - Working with LocalStorage00:27:43 - Creating the Keyboard00:29:53- Game Logic for Guessing Letter00:31:12 - Sponsor: DatoCMS00:32:05 - Color-coded Feedback On Guesses00:36:46 - Adding Transitions on Guessed Letters00:38:19 - Custom Overlay and Alert Components00:47:17 - Grab Bag Questions00:50:20 - Picks and PlugsLinksSource Code - https://github.com/jamesqquick/sveltekit-wordle-cloneWordle Game - https://www.nytimes.com/games/wordle/index.html(Amy Plug) Advent of CSS - https://adventofcss.com/(Amy Plug #2) Advent of JS - https://adventofcss.com/(James Pick) - https://www.amazon.com/Wireless-Charging-Case-Compatible-Microphones/dp/B09C1G9Z1D(James Plug) - https://www.youtube.com/c/jamesqquick

In this episode, Amy and James explain Github Actions: what they are, how they work, use cases, and more. Amy also shares some of her personal experience in setting up Github Actions in a recent project.SponsorsZEALZEAL is a computer software agency that delivers “the world’s most zealous” and custom solutions. The company plans and develops web and mobile applications that consistently help clients draw in customers, foster engagement, scale technologies, and ensure delivery.ZEAL believes that a business is “only as strong as” its team and cares about culture, values, a transparent process, leveling up, giving back, and providing excellent equipment. The company has staffers distributed throughout the United States, and as it continues to grow, ZEAL looks for collaborative, object-oriented, and organized individuals to apply for open roles.For more information visit codingzeal.comVercelVercel combines the best developer experience with an obsessive focus on end-user performance. Their platform enables frontend teams to do their best work. It is the best place to deploy any frontend app. Start by deploying with zero configuration to their global edge network. Scale dynamically to millions of pages without breaking a sweat.For more information, visit Vercel.comDatoCMSDatoCMS is a complete and performant headless CMS built to offer the best developer experience and user-friendliness in the market. It features a rich, CDN-powered GraphQL API (with realtime updates!), a super-flexible way to handle dynamic layouts and structured content, and best-in-class image/video support, with progressive/LQIP image loading out-of-the-box."For more information, visit datocms.comShow Notes00:00:00 - Intro00:05:27 - What are GitHub actions?00:12:59 - Sponsor: DatoCMS00:13:53 - Linting or Formatting00:24:34 - Sponsor:  Vercel00:30:03 - Sponsor: Zeal00:30:56 - Other Use Cases00:37:12 - Grab Bag Questions00:44:00 - Picks and PlugsLinksLearn Github Actions - https://docs.github.com/en/actions/learn-github-actionsQuickstart for Github Actions - https://docs.github.com/en/actions/quickstartLevel Up Tutorials Course on Github Actions from Brian Douglass - https://leveluptutorials.com/tutorials/code-automation-with-github/introduction(James Pick) Rode Wireless Go - https://www.amazon.com/Rode-Microphones-Wireless-Channel-Microphone/dp/B08XFQ6KP9(James Plug) YouTube Channel - https://www.youtube.com/c/jamesqquick(Amy Pick) ELOH IPhone Game - https://apps.apple.com/us/app/eloh/id1406382064(Amy Plug) Learn Build Teach Discord - https://learnbuildteach.com/

Anthony Campolo (AJC) joins us to talk about leveraging blockchain infrastructure for decentralized Web3 applications and his experience working as a Developer Advocate at QuickNode.SponsorsDaily.devdaily.dev is where developers grow together. It provides a community-based feed of the best developer news, helping you stay up-to-date. daily.dev aggregates hundreds of sources every few minutes and creates a personal feed for you according to your interests, whether it’s web dev, data science, or Elixir. Anything you might be interested in, it has the content for you.Check out daily.devHashnodeCreating a developer blog is crucial in creating an online presence for yourself. It’s proof of work for your future employer. Hashnode makes it easy to start a blog in seconds on your custom domain for free. It’s fully optimized for developers and supports writing in Markdown, rich embeds, publishing from GitHub repository, syntax highlighting, and edge caching with Next.js blogs deployed on Vercel. On top of these, Hashnode is free from paywall, ads, and sign-up prompts.Hashnode is a community of developers, engineers, and people in tech. Your article gets instant readership from their growing community.Check out Hashnode, and join the community.Show Notes00:00:00 - Intro00:04:06 - Bootcamp Experiences00:09:59  - Sponsor Shoutout: Hashnode00:10:45 - Experience Working on the Core Team of Redwood.js00:18:09 - Sponsor Shoutout: Daily.dev00:19:10 - Defining Web3, Blockchain, and Cryptocurrencies00:27:24 - What is QuickNode? - Blockchain API and Node Infrastructure00:28:54  - The Future of Web3?00:35:48 - Building a Hello World Smart Contract00:43:04 - Closing Thoughts on Web3 and the BlockchainLinksAnthony on Twitter - https://twitter.com/ajcwebdevQuickNode - https://www.quicknode.com/How to Create a dApp on Avalanche's Fuji Testnet with QuickNode: https://www.quicknode.com/guides/web3-sdks/how-to-create-a-dapp-on-avalanches-fuji-testnet-with-quicknodeA First Look at Deploying Smart Contracts: https://www.youtube.com/watch?v=RvvMWGPJVUIA Crash Course in Web3 for Web2 Developers: https://youtube.com/watch?v=kl5nNRKemkY

James and Amy discuss common accessibility mistakes that you should avoid in your web applications.SponsorsZEALZEAL is a computer software agency that delivers “the world’s most zealous” and custom solutions. The company plans and develops web and mobile applications that consistently help clients draw in customers, foster engagement, scale technologies, and ensure delivery.ZEAL believes that a business is “only as strong as” its team and cares about culture, values, a transparent process, leveling up, giving back, and providing excellent equipment. The company has staffers distributed throughout the United States, and as it continues to grow, ZEAL looks for collaborative, object-oriented, and organized individuals to apply for open roles.For more information visit codingzeal.comVercelVercel combines the best developer experience with an obsessive focus on end-user performance. Their platform enables frontend teams to do their best work. It is the best place to deploy any frontend app. Start by deploying with zero configuration to their global edge network. Scale dynamically to millions of pages without breaking a sweat.For more information, visit Vercel.comDatoCMSDatoCMS is a complete and performant headless CMS built to offer the best developer experience and user-friendliness in the market. It features a rich, CDN-powered GraphQL API (with realtime updates!), a super-flexible way to handle dynamic layouts and structured content, and best-in-class image/video support, with progressive/LQIP image loading out-of-the-box."For more information, visit datocms.comShow Notes00:00:00 - Intro00:02:54 - What is Accessibility00:10:59 - Sponsor Shoutout: Dato CMS00:11:52- 1. Not Using Alt Tags on Images00:15:30 - 2. Not Using Semantic HTML Tags00:22:16 - 3. Not Checking for Accessible Colors and Contrast Ratio  00:24:18 - 4. Relying on Color To Communicate00:26:10 - 5. Not Adding Validation to Your Forms00:29:39 - 6. Setting Outline to None00:30:45 - 7. Ignoring Reduced Motion Preferences00:33:08 - Sponsor Shoutout: Zeal00:34:00 - 8. Using Non-descriptive Link Text00:35:16 - 9. Not Using Aria Role Tag00:37:29 - 10. Not Labeling Your Input Fields00:39:16 - Additional Resources00:40:50 - Grab Bag Questions00:41:16 - Picks and PlugsLinksGive a Damn About Accessibiility - https://www.accessibility.uxdesign.cc/A11ycasts - https://www.youtube.com/playlist?list=PLNYkxOF6rcICWx0C9LVWWVqvHlYJyqw7gStorybook - https://storybook.js.org/Deque - https://www.deque.com/Ekster Wallet - https://ekster.com/Peak Design Bag - https://www.peakdesign.com/products/travel-duffel

Corbin Crutchley joins to talk about how to learn Frontend Frameworks better with his upcoming eBook The Framework Field Guide, https://unicorn-utterances.com/collections/framework-field-guide. SponsorsDaily.devdaily.dev is where developers grow together. It provides a community-based feed of the best developer news, helping you stay up-to-date. daily.dev aggregates hundreds of sources every few minutes and creates a personal feed for you according to your interests, whether it’s web dev, data science, or Elixir. Anything you might be interested in, it has the content for you.Check out daily.devHashnodeCreating a developer blog is crucial in creating an online presence for yourself. It’s proof of work for your future employer. Hashnode makes it easy to start a blog in seconds on your custom domain for free. It’s fully optimized for developers and supports writing in Markdown, rich embeds, publishing from GitHub repository, syntax highlighting, and edge caching with Next.js blogs deployed on Vercel. On top of these, Hashnode is free from paywall, ads, and sign-up prompts.Hashnode is a community of developers, engineers, and people in tech. Your article gets instant readership from their growing community.Check out Hashnode, and join the community.Show NotesUnicorn Utterances - https://unicorn-utterances.com/Framework Guide - https://unicorn-utterances.com/collections/framework-field-guideAccelerating Angular Development with Ivy - https://www.packtpub.com/product/accelerating-angular-development-with-ivy/9781800205215Learning TypeScript from Josh Goldbergy - https://www.amazon.com/Learning-TypeScript-Development-Type-Safe-JavaScript/dp/1098110331Brad Garropy - https://bradgarropy.com/00:00:00 - Welcome and Intros00:02:12 - Awkward Question of the Day and Rants00:07:18 - Background in Writing and Content Creation00:11:19 - Imposter Syndrome as a Writer00:15:01 - Sponsor Daily.dev00:16:02 - The Framework Field Guide - Learning the Core of Frontend Frameworks00:23:36 - Comparing Modern Frontend Frameworks00:27:42 - Sponsor Hashnode00:28:28 - The Tech Stack Behind the Book00:33:36 - Why Create a Free Book00:41:21 - Future Content Goals00:50:55 - Picks and Plugs

Deno team member, Luca Casonato, joins to talk about Deno, a new JavaScript runtime, and Fresh, a next generation web framework, built for speed, reliability, and simplicity.**This is a feed swap episode with  PodRocket -- a web development podcast from LogRocket. Every week, PodRocket gets you up to speed on everything happening in the world of web development through in-depth interviews with experienced engineers.Join LogRocket's Cofounder, Ben Edelstein, and members of the LogRocket engineering team as they interview experienced developers about the best, worst, and newest aspects of all your favorite libraries, frameworks, and technologies. If you enjoy this episode, please be sure to check out PodRocket!**Links and ResourcesFresh docsIslands ArchitectureDeno’s DiscordLuca Casonato – TwitterPodrocket PodcastShow Notes00:00:00 - Intros00:01:10 - What is Deno00:08:27 - Fresh - The Modern Web framework Built for Speed, Reliability, and Simplicity00:13:57 - Islands Architecture00:18:31 - Fresh Project Structure and Breakdown00:25:47 - Upcoming Exciting Tech00:29:54 - Wrap Up

Adam Bradley joins to talk about some amazing new projects to help increase performance and productivity in Web Development: Partytown, Qwik, and Builder.io.SponsorsDaily.devdaily.dev is where developers grow together. It provides a community-based feed of the best developer news, helping you stay up-to-date. daily.dev aggregates hundreds of sources every few minutes and creates a personal feed for you according to your interests, whether it’s web dev, data science, or Elixir. Anything you might be interested in, it has the content for you.Check out daily.devHashnodeCreating a developer blog is crucial in creating an online presence for yourself. It’s proof of work for your future employer. Hashnode makes it easy to start a blog in seconds on your custom domain for free. It’s fully optimized for developers and supports writing in Markdown, rich embeds, publishing from GitHub repository, syntax highlighting, and edge caching with Next.js blogs deployed on Vercel. On top of these, Hashnode is free from paywall, ads, and sign-up prompts.Hashnode is a community of developers, engineers, and people in tech. Your article gets instant readership from their growing community.Check out Hashnode, and join the community.Show Notes00:00:00 - Intros00:00:52 - Adam Bradley Introductions, Origins of Stencil and Ionic00:08:16 - Qwik Performance Overview00:15:31 - Sponsor Shoutout - Daily.dev00:16:32 - Intelligent JavaScript Bundling and Prefetching00:24:26 - Qwik vs Astro00:29:40 - Sponsor Shoutout: Hashnode00:30:26 - Learning in Modern Web Development00:33:18 - Web Workers and Partytown00:45:07 - Builder.io - "Drag and Drop on Your Tech Stack"

James and Amy talk about everything Serverless and how it fits into modern Web Development. They discuss Serverless Functions, hosting platforms (Netlify, Vercel, and Cloudflare), frameworks and tools, benefits, Edge Functions, and more.SponsorsZEALZEAL is a computer software agency that delivers “the world’s most zealous” and custom solutions. The company plans and develops web and mobile applications that consistently help clients draw in customers, foster engagement, scale technologies, and ensure delivery.ZEAL believes that a business is “only as strong as” its team and cares about culture, values, a transparent process, leveling up, giving back, and providing excellent equipment. The company has staffers distributed throughout the United States, and as it continues to grow, ZEAL looks for collaborative, object-oriented, and organized individuals to apply for open roles.For more information visit codingzeal.comVercelVercel combines the best developer experience with an obsessive focus on end-user performance. Their platform enables frontend teams to do their best work. It is the best place to deploy any frontend app. Start by deploying with zero configuration to their global edge network. Scale dynamically to millions of pages without breaking a sweat.For more information, visit Vercel.comDatoCMSDatoCMS is a complete and performant headless CMS built to offer the best developer experience and user-friendliness in the market. It features a rich, CDN-powered GraphQL API (with realtime updates!), a super-flexible way to handle dynamic layouts and structured content, and best-in-class image/video support, with progressive/LQIP image loading out-of-the-box."For more information, visit datocms.comShow Notes00:00:00 - Intro00:00:45 - What Have We Been Up To00:05:35 - Rant: Should You Leave Comments in Your Code?!00:10:23 - Overview of Serverless00:15:00 - Sponsor: Vercel00:21:00 - Sponsor: Zeal00:21:53 - Overview of the Jamstack and Serverless Functions00:35:27 - Sponsor DatoCMS00:37:32 - Benefits of Serverless00:45:41 - Edge Computing00:51:02 - Grab Bag Questions01:01:49 - Picks and Plugs

Colby Fayock joins the show to talk about his developer background, experience as a Content Creator, and his role as a Developer Advocate at Cloudinary.SponsorsDaily.devdaily.dev is where developers grow together. It provides a community-based feed of the best developer news, helping you stay up-to-date. daily.dev aggregates hundreds of sources every few minutes and creates a personal feed for you according to your interests, whether it’s web dev, data science, or Elixir. Anything you might be interested in, it has the content for you.Check out daily.devHashnodeCreating a developer blog is crucial in creating an online presence for yourself. It’s proof of work for your future employer. Hashnode makes it easy to start a blog in seconds on your custom domain for free. It’s fully optimized for developers and supports writing in Markdown, rich embeds, publishing from GitHub repository, syntax highlighting, and edge caching with Next.js blogs deployed on Vercel. On top of these, Hashnode is free from paywall, ads, and sign-up prompts.Hashnode is a community of developers, engineers, and people in tech. Your article gets instant readership from their growing community.Check out Hashnode, and join the community.Show Notes00:00:00 - Intro00:00:58 - Colby's Intro and Background00:03:01 - Colby Background and Content Creation00:06:16 - Wordpress Development and Why It's Still Relevant00:09:23 - Favorite Wordpress Hosts00:11:50 - Security Concerns with Wordpress as a Headless CMS00:12:57 - Headless eCommerce00:16:26 - Thought Leadership and Being an "Influencer"00:18:05 - Creating Accessible Content00:21:48 - How We Plan Content00:22:35 - Updating Outdated Content00:25:45 - Colby's Role as Developer Advocate at Cloudinary00:28:17 - Cloudinary Features00:32:24 - Cloudinary and Wordpress Integration00:39:50 - Colby's Astro Brand Explained00:40:57 - Community Shoutouts00:41:42 - Colby Rant on Moving Past Your Initial Barrier to Entry

In this episode, Amy talks through the details of Dev Operations and setting up a CI/CD (Continuous Integration and Continuous Deployment) pipeline on a recent project, using RedwoodJS, Husky, Postgres, Render, and GitHub Integrations.SponsorsZEALZEAL is a computer software agency that delivers “the world’s most zealous” and custom solutions. The company plans and develops web and mobile applications that consistently help clients draw in customers, foster engagement, scale technologies, and ensure delivery.ZEAL believes that a business is “only as strong as” its team and cares about culture, values, a transparent process, leveling up, giving back, and providing excellent equipment. The company has staffers distributed throughout the United States, and as it continues to grow, ZEAL looks for collaborative, object-oriented, and organized individuals to apply for open roles.For more information visit codingzeal.comVercelVercel combines the best developer experience with an obsessive focus on end-user performance. Their platform enables frontend teams to do their best work. It is the best place to deploy any frontend app. Start by deploying with zero configuration to their global edge network. Scale dynamically to millions of pages without breaking a sweat.For more information, visit Vercel.comDatoCMSDatoCMS is a complete and performant headless CMS built to offer the best developer experience and user-friendliness in the market. It features a rich, CDN-powered GraphQL API (with realtime updates!), a super-flexible way to handle dynamic layouts and structured content, and best-in-class image/video support, with progressive/LQIP image loading out-of-the-box."For more information, visit datocms.comShow Notes00:00 Introduction03:40 Amy's Rant On Work Life Balance06:56 What is DevOps?08:11 James Alternative Definition of DevOps10:37 DevOps Workflows of the Past13:00 CI/CD Pipelines + Vercel14:17 Sponsor: Vercel15:24 Amy's Experience with Redwood.js16:35 Readme.so17:12 Project Environments and Setup With Docker21:32 Project Setup - Github Projects, Github Actions, Kent C. Dodds Testing Trophy, etc.30:47 Hosting With Render35:01 Database Best Practices with Shipping Code36:43 Sponsor: DatoCMS37:37 Deploy Previews with Render Based on Github PRs44:01 Deploy Redwood.js on Render (Documentation)45:11 Sponsor: ZEAL45:57 Heroku Github Integration Issues49:39 Grab Bag Questions Section50:08 Picks and Plugs52:52 James's Plug - Top 5 Struggles of a Developer Advocate53:44 Create a SvelteKit Blog With Markdown FilesMDsvex57:03 Amy's Plug - Hashnode57:44 Amy's Pick - Matthew McConaughey's book, Greenlights