hello.js

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

Sunday, 18 November, 2018 UTC

react: Use React.memo to avoid unnecessary re-renders in React functional components

react: Use React.memo to avoid unnecessary re-renders in React functional components

Class components can bail out from rendering when their input props are the same using `PureComponent` or `shouldComponentUpdate`. Since React 16.6 you can do the same with function components by wrapping them in [React.memo](https://reactjs.org/docs/react-api.html#reactmemo). ... more


Friday, 9 November, 2018 UTC

webpack: Support VS Code Navigation and Autocomplete Based on Webpack Aliases with jsconfig.json

webpack: Support VS Code Navigation and Autocomplete Based on Webpack Aliases with jsconfig.json

It's common to setup Webpack aliases to make imports much more convenient, but then you lose the ability to navigate and autocomplete paths in VS Code. This lesson shows you how to create a `jsconfig.json` with proper paths so you can get back to using ... more


Thursday, 8 November, 2018 UTC

[Course] npm: Execute npm Package Binaries with the npx Package Runner

[Course] npm: Execute npm Package Binaries with the npx Package Runner

You can’t be everywhere at once. Neither can node packages. But with a utility called npx — included in npm v5.2 and later — you can interact and run with node modules even if they’re not downloaded locally. The same is true for gists and remote branches ... more


Wednesday, 7 November, 2018 UTC

javascript: Destructure Nested Objects in JavaScript

javascript: Destructure Nested Objects in JavaScript

It’s commonly known that you can destructure objects in ES6, but did you know you can also destructure values from _deeply nested_ objects? In this lesson, we will cover destructuring deeply nestled objects and also providing default values in case the ... more


Wednesday, 7 November, 2018 UTC

react: Use third party components (e.g. React Select) in React Final Form

react: Use third party components (e.g. React Select) in React Final Form

No one wants to reinvent the wheel. That's why it's so important to be able to use components that someone else had created and put on npm. In this lesson we are going to learn how to use third party [React Select](https://react-select.com) in a [React ... more


Tuesday, 6 November, 2018 UTC

jquery: Animate Elements on a Webpage with jQuery

jquery: Animate Elements on a Webpage with jQuery

There are many ways of animating stuff on the Web. For example we can use CSS animations, vanilla JavaScript or jQuery library. In this lesson we are going to learn how to use jQuery `slideUp()`, `slideDown()` and `animate()` functions to animate elements ... more


Monday, 5 November, 2018 UTC

react: Cancel A Promise Using AbortController

react: Cancel A Promise Using AbortController

The AbortController interface enables us to cancel a one or more DOM requests. In this lesson, we will demonstrate how to use the controller to cancel a Javascript Promise before it is resolved. ... more


Friday, 2 November, 2018 UTC

express: Convert SVG to a PDF in Node with PDFKit and SVG.js

express: Convert SVG to a PDF in Node with PDFKit and SVG.js

I was recently given the task of generating Completion Certificates for Kent's Testing JavaScript course. We wanted the users to be able to print them at any size, so I took it upon myself to make sure that we used SVG rendered out in the PDF. This lesson ... more


Thursday, 1 November, 2018 UTC

react: Use React Fragments to wrap adjacent JSX elements without adding unnecessary wrappers

react: Use React Fragments to wrap adjacent JSX elements without adding unnecessary wrappers

In this lesson, we are going to use [React Fragments](https://reactjs.org/docs/fragments.html) to wrap adjacent JSX elements without introducing unnecessary wrapper elements to DOM. Before Fragments came along, the popular pattern was to wrap enclosing ... more


Thursday, 1 November, 2018 UTC

mocha: Mock a function's return value using a Sinon stub

mocha: Mock a function's return value using a Sinon stub

When mocking a JavaScript function during a unit test, it can be helpful to force a mock function to return a value of your choosing. This allows you to verify that functions you're testing will behave correctly for every possible use case. Much like ... more


Thursday, 1 November, 2018 UTC

javascript: Handle State Transitions through Events in a Finite State Machine with XState

javascript: Handle State Transitions through Events in a Finite State Machine with XState

A state machine is a standardized way of defining and enumerating all possible (hence "finite") states of a system. It also defines and enumerates the transitions from one state to another. These transitions are triggered by sending events to ... more


Tuesday, 30 October, 2018 UTC

react: Use React.lazy to do code-splitting with React Suspense

react: Use React.lazy to do code-splitting with React Suspense

A new way of doing code-splitting in React apps has been released in [React v16.6.0](https://reactjs.org/blog/2018/10/23/react-v-16-6.html). It allows us to use `Suspense` tag with dynamic `import` statements to send heavy components over the wire to ... more


Tuesday, 30 October, 2018 UTC

javascript: Compare the == and === Operators in Javascript

javascript: Compare the == and === Operators in Javascript

Both double equals `==` and triple equals `===` can be used to compare values in javascript - but they are different in a subtle, but very important way. Double equals `==` compares just the _value_ of two things - and if the types are different, it will ... more


Tuesday, 30 October, 2018 UTC

javascript: Build a Custom Provider Component for MDX Deck

javascript: Build a Custom Provider Component for MDX Deck

MDX Deck is a great library for building slides using Markdown and JSX. Creating a custom `Provider` component allows you to change the markup of the entire deck. This lets you put things like logos and social media handles in each slide easily. In this ... more


Monday, 29 October, 2018 UTC

javascript: Use a custom sort function on an Array in Javascript

javascript: Use a custom sort function on an Array in Javascript

Sorting in Javascript with `sort` uses _lexical_ sorting by default, which means it will sort in alphabetical order. That's fine for strings of characters, but it means that arrays of numbers don't sort in numerical order! To fix that, we'll pass a custom ... more


Monday, 29 October, 2018 UTC

react: Use React Hooks to Convert a Class Component to a Function Component

react: Use React Hooks to Convert a Class Component to a Function Component

React just announced a new [Hooks]([Introducing Hooks – React](https://reactjs.org/docs/hooks-intro.html)) proposal enabling React Function Components to handle state and side-effects, which was previously only possible with React Class Components. In ... more


Sunday, 28 October, 2018 UTC

javascript: Understand the Difference Between for...in and for...of Loops in Javascript

javascript: Understand the Difference Between for...in and for...of Loops in Javascript

In general: Use `for`...`in` loops to loop over the keys of an _object_. Use `for`...`of` loops to iterate over an _array_ or _string_. The two loop types: for...in and for...of behave differently in javascript. Both loops can be used with Arrays and ... more


Friday, 26 October, 2018 UTC

javascript: Loop over an Object with for...in, Object.keys, Object.values, and Object.entries

javascript: Loop over an Object with for...in, Object.keys, Object.values, and Object.entries

In Javascript, there are several ways you can iterate over an object's keys and values. We'll look at `for`...`in`, which will loop over all the keys (though you may need to also use `hasOwnProperty`). We'll also look at three built in object functions: ... more


Friday, 26 October, 2018 UTC

node: Look Up a Phone Number in Node.js with Twilio

node: Look Up a Phone Number in Node.js with Twilio

In this lesson, you will learn how to look up a phone number in Node.js with Twilio's. We will utilize Twilio's Lookup API which allows lookup and verify any number. ... more


Friday, 26 October, 2018 UTC

javascript: Use .map Instead of a for loop to Iterate over an Array

javascript: Use .map Instead of a for loop to Iterate over an Array

Whenever you want to loop over an array and create a new array based on each element in the first array, it's possible to use the `map` function on the array, instead of using a `for` loop. There are a few advantages to `map` over `for`, including shorter ... more


Thursday, 25 October, 2018 UTC

react: Store Values in localStorage with the React useEffect Hook

react: Store Values in localStorage with the React useEffect Hook

When you refresh the page in JavaScript, it will clear values that you possibly want to be persisted if you don't store it somewhere as in localStorage. Storing something in localStorage is a side effect and in React 16.6 you can utilize `useEffect` to ... more


Thursday, 25 October, 2018 UTC

react: Store Values in localStorage with React useEffect

react: Store Values in localStorage with React useEffect

When you refresh the page in JavaScript, it will clear values that you possibly want to be persisted if you don't store it somewhere as in localStorage. Storing something in localStorage is a side effect and in React 16.6 you can utilize `useEffect` to ... more


Thursday, 25 October, 2018 UTC

react: Store Values in localStorage with React 16.6 useEffect

react: Store Values in localStorage with React 16.6 useEffect

When you refresh the page in JavaScript, it will clear values that you possibly want to be persisted if you don't store it somewhere as in localStorage. Storing something in localStorage is a side effect and in React 16.6 you can utilize `useEffect` to ... more


Thursday, 25 October, 2018 UTC

react: Use React.memo with a Function Component to get PureComponent Behavior

react: Use React.memo with a Function Component to get PureComponent Behavior

A new Higher Order Component (HOC) was recently released in [React v16.6.0](https://reactjs.org/blog/2018/10/23/react-v-16-6.html) called `React.memo`. This behavior of the HOC is similar to what you’d get when using `React.PureComponent` or `shouldComponentUpdate` ... more


Saturday, 20 October, 2018 UTC

npm: Set default values for package.json using npm set

npm: Set default values for package.json using npm set

Npm by default uses global values when initializing a new package.json file. Learn how to set your own global default values by command line or editing the ~/.npmrc file. ... more


Thursday, 18 October, 2018 UTC

mocha: Mock an HTTP request using Nock while unit testing

mocha: Mock an HTTP request using Nock while unit testing

When testing functions that make HTTP requests, it's not preferable for those requests to actually run. Using the `nock` JavaScript library, we can mock out HTTP requests so that they don't actually happen, control the responses from those requests, and ... more


Thursday, 18 October, 2018 UTC

node: Write or Append to a File in Node.js with fs.writeFile and fs.writeFileSync

node: Write or Append to a File in Node.js with fs.writeFile and fs.writeFileSync

In node.js, you can require `fs`, and then call `fs.writeFile` with the filename, and data to write to that file (as a string or a buffer). That will overwrite the entire file, so to just append that data to the file instead, pass an options object with ... more


Monday, 15 October, 2018 UTC

[Course] Rust: Using WebAssembly with Rust

[Course] Rust: Using WebAssembly with Rust

Many languages work on a compilation story to WebAssembly, but Rust is already ready for primetime. Why? - Rust is a stable language and great replacement for C and C++. - Due to the reference and borrowing concept, Rust doesn’t need a Garbage Collector ... more


Thursday, 11 October, 2018 UTC

node: Read a File in Node.js with fs.readFile and fs.readFileSync

node: Read a File in Node.js with fs.readFile and fs.readFileSync

We'll read a csv file in node.js both synchronously, and asynchronously. The file we're reading is a plain text, utf8 file - but you can also use `fs.readFile` to read a binary file as a buffer. We'll look at the differences between `readFile` and `readFileSync`, ... more


Thursday, 11 October, 2018 UTC

[Course] javascript: Understanding JavaScript's Prototypal Inheritance

[Course] javascript: Understanding JavaScript's Prototypal Inheritance

How do inherent prototypes work? You might not think this question applies to you, especially if you come from a classical background. But if you use objects, functions, or arrays, you're probably already using prototypes, and can benefit from learning ... more