🥚 what's fresh to learn at egghead (NEW!!)

Hello {NAME}, We've got a ton of great new stuff for you to learn from. Don't miss the amazing set of instructor collections down towards the bottom of this email! First off, if you haven't checked them out yet these two episodes of the podcast are great. Khalal and Hiro are inspiring and both doing interesting work in web development. [Get Comfortable Learning On Your Own With Khalal Walker] [Get Comfortable Learning On Your Own With Khalal Walker]() hosted by Joel Hooks Khalal talks about his experience writing the dad jokes SMS bot, how CS curriculums can kill the joy of coding, and the problems with bootcamp marketing. [Making A Fulfilling Career Out Of Multiple Interests With Hiro Nishimura] [Making A Fulfilling Career Out Of Multiple Interests With Hiro Nishimura](=) hosted by Joel Hooks Hiro talks about rediscovering web development, how she went from working help-desk to becoming a freelance consultant, the unexpected challenges of freelance, and how jargon makes it difficult for people without a tech-background to learn and communicate. We've got two new excellent courses for you to learn from: [Immutable JavaScript Data Structures with Immer] [Immutable JavaScript Data Structures with Immer]() by Michel Weststrate Using immutable data structures provides many benefits, including making your code easier to reason about and less prone to bugs. However, since JavaScript doesn't include support for immutable data structures out of the box, you need to use a third party library. But which one to choose? In this self-paced workshop, Immer's creator Michel Westrate will guide you through the creation of a multi-user Gift Tracking app. You'll learn the basics of using Immer to handle immutable state updates, then go further into change distribution and implementing an undo/redo. After this workshop, you'll be ready to leverage immutable data structures in your own applications! [Shareable Custom Hooks in React] [Shareable Custom Hooks in React](=) by Joe Previte React 16.8 introduced Hooks like useState for using stateful logic in our function components, and useEffect for side effects previously only used in class-based components. The React Team has given developers a way that simplifies using core features, but what's that mean for the code that you write? In this self-paced workshop, you'll work through refactoring a component to use a custom hook, and learn to apply the patterns used by the React team to your own code. Follow the React Team's lead, and make your code more readable, reusable, and reasonable! Want to learn something quick? Check out these single stand alone lesson videos: 🔥 [Build React from Source]() by Michael Chan Want to explore new features in React, play with cutting packages like react-cache, or contribute to core? You need to know how to build React from source. If you work in node a lot, this process should feel pretty familiar — with a couple additional complications. By the end of this video you'll be building React packages like a pro. [Consume a Stream of Events Using the FromEvent Operator in RxJS]() by Laurie Barth Learn how you can use fromEvent as if it were addEventListener. Create an observable stream of actions on an HTML DOM element. [Create a Custom Hook for Site Metadata in Gatsby](=) by Sam Julien Gatsby's useStaticQuery hook is really useful for getting site metadata from our Gatsby config into our components. In fact, it's so useful that we end up using it all over the place and duplicating a lot of code! Luckily, since useStaticQuery is just a React hook, we can use it to compose our own custom useSiteMetadata hook. [Create a Card Flip Animation with CSS]() by Andy Van Slaars Animation can be a powerful way to enhance a user experience. In this lesson, we'll walk through the creation of a card-flip animation, creating a nice visual effect when toggling between the front and back of a div meant to represent a card, like a playing card, or a flashcard. We'll create this effect using a touch of JavaScript and CSS transforms. No framework or library required. [Filter Strings with the Filter Array Method in JavaScript]() by Nick DeJesus This is a small breakdown of how the filter array method works in JavaScript. We write a function that takes in a string and applies filter to the array. [Group Data by Key with the groupBy Operator]( by Sam Julien The groupBy operator is one of RxJS's best kept secrets. In this lesson, you'll get an introduction to grouping data together by key. We'll use both hard-coded data and data coming from a server. [Implement a Sticky Footer within a ReasonReact App Using the bs-css BuckleScript Package]() by Thomas Greco One of the key benefits of BuckleScript is the ease in which it makes the process of porting JavaScript libraries so they can be used within the context of a ReasonML application. The Reason Package Index, or [redex](, provides a central place for browsing all available packages. Additionally, creating your own BuckleScript bindings is a straight forward process that also provides value in the form of knowledge surrounding the inner-workings of the library at hand. In this lesson, we learn how to integrate the emotion css-in-js libray into our project by installing the bs-css package. Once installed, we'll create a .re file for our style rules and see how we can add global css, as well as styles for specific css classes which we'll target using React's className prop. [Create a Layout Component for Displaying Child Components Inside of a ReasonReact App]() by Thomas Greco When working with traditional React, we often pass functional stateless components the props object as an argument. Although there are a few minor differences when working in the context of Reason, the act of passing props to a component is done in an extremely similar manner. In this lesson, we will get a first-hand look at just how similar these processes are by walking through the steps of creating a React Component in ReasonReact. By the end, you'll have developed an understanding of ReasonReact's "named args" syntax which it uses for creating components and you'll have created a re-usable Layout component that can be used to share layout throughout an application. [Inject Custom JavaScript Into a Gatsby Site]() by Steven Mercatante Learn how to add custom JavaScript to your Gatsby's main HTML. [Install graphql-tag to Enable Syntax Highlighting For GraphQL Queries]() by Ian Jones In this lesson, we are going to install graphql-tag to enable syntax highlighting to our GraphQL query. graphql-tag parses your query and stores it as an AST. graphql-tag caches the parsed query, so it won't have to parse it multiple times. [Get Site Metadata with useStaticQuery]() by Sam Julien Gatsby provides a React hook that lets us use static queries in our components. It's called (appropriately) useStaticQuery. In this lesson, you'll learn how to use useStaticQuery to get site metadata from your Gatsby config file. [Pass Custom Data to Gatsby Pages]( by Steven Mercatante We can pass custom data to our Gatsby pages by overriding the onCreatePage function and using its context object. This is really useful when you want to provide custom data to GraphQL queries, or your page components. [Make informed decisions about 3rd party npm libraries with bundlephobia]( by Andy Van Slaars The ability to pull in just about anything your project needs from npm is amazing, but it can also lead to bundle bloat if you aren't selective about what libraries you pull into your library. In this lesson, we'll take a look at bundlephobia.com, a tool that provides insights about a library's size. With bundlephobia, you can make informed decisions about what libraries you pull into your project and avoid unnecessary bundle bloat. You might also like these collections: [ES6 and Beyond - JavaScript Tips and Tricks from ES2015 to ES2020]() by Mike Sherov Released in 2015, ES6 was a major update to the JavaScript language, providing many new powerful additions to the language. From arrow functions, classes, generators, and proxies to Promises and Modules, ES6 solved many of the languages problems with cleaner, more concise syntax and functionality. Since then, a new version of JavaScript is released every year, providing even more power to JavaScript Developers: ES2016 brings with it Array.prototype.includes, ES2017 has async and await, ES2018 adds new capabilities to regular expressions and async iterators, ES2019 has Object.fromEntries, Array.prototype.flat and flatMap, and ES2020 has dynamic imports, globalThis, and BigInt. Staying up to date with the language as it evolves saves you from being stumped by new APIs and syntax! Learning ES6 and Beyond will ensure you can drop into any JavaScript codebase and have the best shot at being productive on day one. [Build a CRUD-ready GraphQL API + Admin UI with KeystoneJS]( by Simon Vrachliotis This collection of videos teaches you how to use [KeystoneJS]() to build a CRUD-ready GraphQL API, coming with an automatically generated Admin UI. Starting with a blank file, we will create an API by: - defining "Lists" as content types - adding fields (Select, Text, Checkbox, ...) to our lists - customising access control to define what users can (and cannot!) do with our API. [Learn about slices and arrays in Go](=) by Jeff RobertsThis collection of lessons will cover a variety of topics that teach you how to work with slices and arrays in go. You'll learn how to declare them, create them using literal syntax, iterate over them, add to them, remove from them and other useful things. [Up and running with Svelte 3](=) by Tomasz Łakomy JavaScript community has been shaken recently by a release of Svelte 3 and for a good reason - it's a completely different approach than React or Vue. To quote the docs: "[Svelte](=) is a radical new approach to building user interfaces. Whereas traditional frameworks like React and Vue do the bulk of their work in the browser, Svelte shifts that work into a compile step that happens when you build your app." The best part? If you have 19 spare minutes you can learn the basics of Svelte 3 and start building your own apps with it! [The Complete Guide to FaunaDB](=) by Chris BiscardiFaunaDB is a global serverless database that gives you ubiquitous, low latency access to app data, without sacrificing data correctness. It eliminates layers of app code for manually handling data anomalies, security, and scale, creating a friendlier dev experience for you and better app experience for your users. [Theme UI](=) by John Otander[Theme UI]( is a library created by [Brent Jackson](=) for building themeable React apps with [Gatsby](. It's built with [Styled System]() which provides a constrained set of styling APIs based on props. It uses [Emotion](=) and [MDX]( underneath which abstracts us away from a lot of the challenges when dealing with global CSS and styling content. [Introduction to AWS SAM](=) by Rich Buggy The videos in this playlist will get you started building serverless applications using AWS SAM. It covers - Setting up your AWS credentials - Building and deploying a Lambda - Testing your Lambda locally - Cleaning up your AWS account once you've finished [Unsubscribe]( | [Update your profile]( | 337 Garden Oaks Blvd #97429, Houston, TX 77018