hello.js

var please = require('share');
console.log('thank you');

Monday, 8 April, 2019 UTC

javascript: Refactor Named Parameters to Function Composition

javascript: Refactor Named Parameters to Function Composition

We often rely far too heavily on adding parameters to our functions when writing a new function would give us much more flexibility and power. This lesson goes through refactoring a named parameters example to using composition instead to show the thought ... more


Friday, 5 April, 2019 UTC

javascript: Collapse a Submenu on the blur Event to Improve Navigation Accessibility

javascript: Collapse a Submenu on the blur Event to Improve Navigation Accessibility

In this lesson, we extend off [Expand a Menu on a focus Event to Improve Navigation Accessibility](https://egghead.io/lessons/javascript-using-the-focus-event-to-improve-navigation-accessibility) to improve the navigation. We use a bit of JavaScript to ... more


Friday, 5 April, 2019 UTC

rxjs: André Staltz Presents: Build your own RxJS

rxjs: André Staltz Presents: Build your own RxJS

André shows us how to build a minimum functioning RxJS and teaches us some important concepts about reactive programming. JavaScript has multiple APIs that use callback functions that all do nearly the same thing with slight variations. Event listeners, ... more


Tuesday, 2 April, 2019 UTC

javascript: Create a JavaScript application with Parcel

javascript: Create a JavaScript application with Parcel

Starting a brand new project can be tricky. Sometimes we end up spending a couple of hours writing configs for tools like webpack, where instead we would like to dive straight to the code. [Parcel](https://parceljs.org/getting_started.html) allows us ... more


Tuesday, 26 March, 2019 UTC

[Course] algolia: Getting Started with Algolia InstantSearch.js

[Course] algolia: Getting Started with Algolia InstantSearch.js

Today’s users expect great things from their search experiences — speed, relevance, and usability, to name a few. Algolia provides developers with out-of-the-box and customizable search experiences that are a joy to build. This introductory course on ... more


Friday, 22 March, 2019 UTC

[Course] javascript: Just Enough Functional Programming in JavaScript

[Course] javascript: Just Enough Functional Programming in JavaScript

In the last few years, the software development industry has seen a resurgence of functional programming. But what is it? And how do you get started? “Just Enough” is an introduction to functional programming, written in JavaScript, that doesn’t get bogged ... more


Monday, 18 March, 2019 UTC

react: Understanding how react-testing-library works with Kent C. Dodds

react: Understanding how react-testing-library works with Kent C. Dodds

Kent walks us through the internals of dom-testing-library and react-testing-library. There is a lot of set-up and tear down when testing UI components. These two libraries take away a lot of the work required to test React components well. Jest is commonly ... more


Monday, 18 March, 2019 UTC

javascript: Rapidly prototype and document user interface components in MDX using the ok-mdx CLI

javascript: Rapidly prototype and document user interface components in MDX using the ok-mdx CLI

The [ok-mdx](https://github.com/jxnblk/mdx-go) library gives users access to the `mdx` command-line tool. The lesson shows users how to leverage the `mdx` command to fire up a local development server where we can write markdown using the MDX syntax and ... more


Friday, 15 March, 2019 UTC

css: Converting Sass To CSS

css: Converting Sass To CSS

In this lesson we'll learn how to convert our Sass code to CSS code. We'll take a look at the sass watch command and use it to listen for changes within our Sass code. The `sass` executable can be downloaded globally through npm by running `npm i -g sass`. ... more


Thursday, 14 March, 2019 UTC

chrome-devtools: Use Logpoints to log messages without cluttering up your code with console.log() statments

chrome-devtools: Use Logpoints to log messages without cluttering up your code with console.log() statments

[Logpoints](https://developers.google.com/web/updates/2019/01/devtools) are one of the features recently released in Chrome 73. They allow you to easily log and debug your code (both on local environment and on production) without cluttering your code ... more


Tuesday, 12 March, 2019 UTC

[Course] bash: Advanced Bash Automation for Web Developers

[Course] bash: Advanced Bash Automation for Web Developers

Bash makes automation easy. Just a few lines of code can take care of repetitive tasks for you and your teammates. In this course, we’ll dive deep into the automation potential of bash. You’ll learn to leverage common hooks that open up interesting automation ... more


Monday, 11 March, 2019 UTC

javascript: Expand a Menu on a focus Event to Improve Navigation Accessibility

javascript: Expand a Menu on a focus Event to Improve Navigation Accessibility

In this lesson, we use a bit of CSS and JavaScript to expand a menu on focus. This is important to ensure that if someone cannot use a mouse, they are still able to open the menu and see which link they are on. ... more


Monday, 11 March, 2019 UTC

javascript: Using the focus event to improve navigation accessibility

javascript: Using the focus event to improve navigation accessibility

In this lesson, we use a bit of CSS and JavaScript to expand a menu on focus. This is important to ensure that if someone cannot use a mouse, they are still able to open the menu and see which link they are on. ... more


Sunday, 3 March, 2019 UTC

javascript: Transform an Array of Objects into an Array of Arrays with .reduce()

javascript: Transform an Array of Objects into an Array of Arrays with .reduce()

We use the same set of data that we used in my filter lesson (https://egghead.io/lessons/javascript-filtering-through-an-array-of-countries-using-filter) to create an array of coordinates. We use the .reduce() method to create the data structure that ... more


Wednesday, 27 February, 2019 UTC

[Course] ramda: Functional Programming in JavaScript with Ramda.js

[Course] ramda: Functional Programming in JavaScript with Ramda.js

Learn how you can use ramda.js to bring functional programming concepts into your JavaScript code. Ramda offers composability and immutability right out of the box, so you can leave your imperative code behind and build cleaner, more maintainable code. ... more


Tuesday, 26 February, 2019 UTC

html: Avoiding CSS Conflicts via Shadow DOM CSS encapsulation

html: Avoiding CSS Conflicts via Shadow DOM CSS encapsulation

Shadow DOM is part of the web components specification. It allows us to ship self contained components along with their style and isolate the component from global style while "protecting" the host application from styles defined inside the ... more


Tuesday, 19 February, 2019 UTC

javascript: Filtering through an Array of Countries using .filter()

javascript: Filtering through an Array of Countries using .filter()

We are going to use the the .filter() method on an array of countries so that we only return the country that matches a particular country code. This could be useful if you are in multinational organization and you want to return data only from that country's ... more


Tuesday, 19 February, 2019 UTC

javascript: Explore ES2019 stable array sorting by example

javascript: Explore ES2019 stable array sorting by example

Before ES2019, array sorting in Javascript was not guaranteed to be stable. In this lesson, we'll learn what stable sorting is by seeing an example of unstable sorting. We'll use nvm to switch between an older version of Node and a newer version and compare ... more


Friday, 15 February, 2019 UTC

egghead: Implement a Redux Store with Easy Peasy & React Hooks

egghead: Implement a Redux Store with Easy Peasy & React Hooks

Easy Peasy is a JavaScript library that can be used to very simply implement Redux into a React application. In this lesson, we will learn how to setup Easy Peasy by creating a model, injecting that model into a StoreProvider React component, and calling ... more


Friday, 15 February, 2019 UTC

[Course] angular: Getting Started with Angular Elements

[Course] angular: Getting Started with Angular Elements

Angular elements are one of the major innovations in Angular 6+. Elements allow us to develop Angular components like we always have through Angular’s powerful API, and then compile them into browser-native custom elements. With custom elements, we can ... more


Wednesday, 13 February, 2019 UTC

javascript: Map and Flatten Multidimensional Arrays with ES2019 Array.prototype.flatMap

javascript: Map and Flatten Multidimensional Arrays with ES2019 Array.prototype.flatMap

ES2019 introduces the Array.prototype.flatMap method. In this lesson, we'll map and flatten a multidimensional array using Array.prototype.map, Array.prototype.reduce and Array.prototype.concat, and then refactor the code to do the same thing using the ... more


Wednesday, 13 February, 2019 UTC

javascript: Object creation using ES2019's Object.fromEntries method

javascript: Object creation using ES2019's Object.fromEntries method

This lesson shows how to use ES2019's `Object.fromEntries` method to convert `[key,value]` array pairs stored inside of a `Map` into an object. Following this, we'll check out how we can use `Object.fromEntries` along with `Object.entries` to implement ... more


Sunday, 10 February, 2019 UTC

html: Build Flexible HTML with HTMLTemplates using Slots and Web Components

html: Build Flexible HTML with HTMLTemplates using Slots and Web Components

HTMLTemplates are part of the web components specification. In this lesson we will learn what are HTML templates, how to use them and how to use the powerful HTMLTemplates slots inside a web component. ... more


Wednesday, 6 February, 2019 UTC

javascript: Use ES2019 Array.prototype.flat to Flatten Multidimensional Arrays

javascript: Use ES2019 Array.prototype.flat to Flatten Multidimensional Arrays

ES2019 introduces the Array.prototype.flat method. In this lesson, we'll flatten a multidimensional array using Array.prototype.reduce and Array.prototype.concat, and then refactor the code to do the same thing using the .flat method. We'll then use the ... more


Wednesday, 6 February, 2019 UTC

javascript: Automate the process of flattening deeply nested arrays using ES2019's flat method.

javascript: Automate the process of flattening deeply nested arrays using ES2019's flat method.

Among the features introduced to the language of JavaScript in ES2019 is `Array.prototype.flat`. In this lesson we'll see just how easy the `flat` method makes the process of unboxing arrays regardless of how deeply nested they may be. ... more


Monday, 4 February, 2019 UTC

gatsby: Load Images in Gatsby.js with gatsby-source-filesystem

gatsby: Load Images in Gatsby.js with gatsby-source-filesystem

In this lesson you will learn how to increase performance of the images used in your website built with Gatsby.js. Img component provided by Gatsby enables lazy loading, applies cool visual effects on image loads and is virtually everything you need to ... more


Monday, 4 February, 2019 UTC

react: Detect user activity with a custom useIdle React Hook

react: Detect user activity with a custom useIdle React Hook

If the user hasn't used your application for a few minutes, you may want to log them out of the application automatically in case they've stepped away from the machine and someone nefarious attempts to use their session. Let's checkout how you can create ... more


Thursday, 31 January, 2019 UTC

react: Animate Page Transitions in Gatsby.js using react-transition-group

react: Animate Page Transitions in Gatsby.js using react-transition-group

In this lesson you will learn how to add native-like animation to the projects built with Gatsby.js. This lesson uses gatsby-plugin-layout to inject location property to the pages of the website and react-transition-group to add smooth animations when ... more


Tuesday, 29 January, 2019 UTC

css: Make a Responsive Web Page Without Using a CSS or JavaScript Framework

css: Make a Responsive Web Page Without Using a CSS or JavaScript Framework

The patio11bot site looks OK on a desktop, but terrible on mobile - so we'll turn it into a responsive webpage. First (and most important), set the meta viewport tag: `` Then, we can use media CSS queries to differentiate styles between mobile (smaller ... more


Tuesday, 29 January, 2019 UTC

css: Serve a Static HTML Page for Development

css: Serve a Static HTML Page for Development

We'll be building www.patio11bot.com from start to finish as a staic HTML document - so the first step is to setup a mini web server, so that we can view the webpage locally. There are three easy ways to do that: `// python 2:` `> python -m SimpleHTTPServer ... more