hello.js

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

Thursday, 20 September, 2018 UTC

Beautiful Charts and Graphs with React and Victory

Beautiful Charts and Graphs with React and Victory

Having a ton of data is a great thing. You can use it to identify usage patterns and trends or apply it towards predictive failure analysis for your fleet of servers. Sadly, a lot of the time data is meticulously collected and presented in a stale old ... more


Tuesday, 18 September, 2018 UTC

Anatomy of a package.json File

Anatomy of a package.json File

If you’ve been working on JavaScript and/or Node.js projects at any capacity these past few years, surely you’ve come across some package.json files, npm’s configuration file for projects and modules. In this post we’ll explore some of the most important ... more


Friday, 14 September, 2018 UTC

Control Page Scroll in CSS Using Scroll Snapping

Control Page Scroll in CSS Using Scroll Snapping

Scroll snapping is a technique that you’ve certainly seen already. When implemented irresponsibly it can become extremely annoying and give a very bad browsing experience to the user. When done right though, it can be a great way to display things like ... more


Friday, 7 September, 2018 UTC

Crafting Beautiful UIs in React Using Ant Design

Crafting Beautiful UIs in React Using Ant Design

Ant Design is a React UI library that has a plethora of easy-to-use components that are useful for building elegant user interfaces. Created by Chinese conglomerate Alibaba, Ant Design is used by several big names: Alibaba (of course), Tencent, Baidu, ... more


Wednesday, 5 September, 2018 UTC

Creating a Grid Component with Vue.js

Creating a Grid Component with Vue.js

There’s a lot of information online about how a modern grid UI component should look like and what features it should provide. One common requirement is for the grid component to be easy to visualize and act on the information. That’s easy to accomplish ... more


Monday, 3 September, 2018 UTC

Morphing UI Transitions with React Morph

Morphing UI Transitions with React Morph

Love them or hate them, animations in modern web design are probably here to stay. Unlike the glory days of jQuery, React out of the box does not provide any mechanism to perform such animations. Sure you could do a small bit of CSS wizardry to animate ... more


Monday, 3 September, 2018 UTC

A Look at the Channel Messaging API

A Look at the Channel Messaging API

Service Workers are isolated from the main JavaScript thread. Being a special kind of Web Worker, they share the same limitations. How do you communicate back to the main thread? Browsers offer us the Channel Messaging API . This API allows two scripts ... more


Monday, 27 August, 2018 UTC

Building a Sidebar Component in React with react-burger-menu

Building a Sidebar Component in React with react-burger-menu

Every web application needs some kind of navigation. One of the most popular methods is to have a sidebar to the left of the page’s content. Today we’re going to create one in React using react-burger-menu . react-burger-menu is a library that allows ... more


Sunday, 26 August, 2018 UTC

Easy State Management with React Values

Easy State Management with React Values

It happens to the best of us. We start a new project with the best intentions of writing clean and maintainable code. Fast forward a month or two into the project and we’ve implemented the same boolean toggle state in twenty different places. Things ... more


Monday, 20 August, 2018 UTC

First Steps with the Cache API

First Steps with the Cache API

The Cache API was created to allow Service Workers to have a deeper and fine-grained control over the caching of resources. Through the Cache API a Service Worker can decide to cache resources for offline consumption and retrieve them later. With resources, ... more


Thursday, 16 August, 2018 UTC

Your First Steps with Gatsby v2

Your First Steps with Gatsby v2

We’ve previously explored the philosophy behind Gatsby as well as some of its major features, so it’s about time we jump in and start building websites with it. We’ll explore here how to get started with Gatsby v2. Gatsby v2 is still in beta at the time ... more


Wednesday, 15 August, 2018 UTC

Getting Started with Service Workers

Getting Started with Service Workers

A Service Worker is a relatively new API that’s been introduced in modern web browsers in the last few years. It’s a really important technology. It’s a special kind of web worker that can be installed in your browser to provide special features that ... more


Tuesday, 14 August, 2018 UTC

A Brief Introduction to JSX

A Brief Introduction to JSX

JSX is language extension for writing the UI logic for your React components. It gets transpiled by Babel to calls to React.createElement . Even though opinions are very polarized about the use of JSX, you’ll find that most React developers really enjoy ... more


Wednesday, 8 August, 2018 UTC

Use Native Icons in React Native

Use Native Icons in React Native

Sooner or later comes the time to add vector icons to your application. You may have built your own on SVG that you load on components, created your own icon library using Icomoon or used any of the well-known icon libraries like Bootstrap. But maybe ... more


Monday, 6 August, 2018 UTC

Git Basics - Braving Branch Management

Git Basics - Braving Branch Management

Last time, we went over how to save and upload your work using Git. Today, we’re looking at how to use branching in Git to effectively collaborate with other developers . Git may seem like a lot of effort to save your work, but when you’re working on ... more


Monday, 6 August, 2018 UTC

Using JavaScript's sort Method for Sorting Arrays of Strings

Using JavaScript's sort Method for Sorting Arrays of Strings

The sort method available on the Array prototype allows you to sort the elements of an array. It accepts an optional callback function that you could use to tailor the sorting mechanism to your specific needs. For arrays of numbers, refer to our previous ... more


Friday, 3 August, 2018 UTC

Error Handling in JavaScript Using try...catch

Error Handling in JavaScript Using try...catch

Good code is code that preemptively prevents errors in a program from crashing the program and instead handles those errors gracefully by doing something like recovering from the error, informing the user about it or logging the error somewhere. This ... more


Tuesday, 31 July, 2018 UTC

Styling React with Emotion

Styling React with Emotion

Out of the box, React allows you to style components directly with the style property. It’s accepts an object of style properties and for most use cases, it’s more than sufficient. As a single property, there’s no way to specify more granular defaults ... more


Monday, 30 July, 2018 UTC

Using JavaScript's sort Method for Sorting Arrays of Numbers

Using JavaScript's sort Method for Sorting Arrays of Numbers

The sort method available on the Array prototype allows you to sort the elements of an array and control how the sorting should be done. The aim of this post is to explain to you why, why not and how the sort method works when sorting an array of numbers ... more


Sunday, 29 July, 2018 UTC

Introduction to Using Redux in a React Native App

Introduction to Using Redux in a React Native App

In this article, we will learn how to persist user data using Redux in a React Native application. Redux is a predictable state container for JavaScript apps. If Redux is new to you, we recommend looking at this intro of ours. As you'll see, Redux is ... more


Thursday, 26 July, 2018 UTC

Building a Landing Page in React Native Using Flexbox

Building a Landing Page in React Native Using Flexbox

Styling a React Native app can be quite painful if you aren’t familiar with its styling powerhouse: the Flexbox layout module. While we can style with JavaScript, understanding and implementing Flexbox layout is an absolute essential for UI development ... more


Wednesday, 25 July, 2018 UTC

Routing with React Navigation in React Native

Routing with React Navigation in React Native

In this article, we will learn how to navigate mobile app screens using react-navigation in a React Native application. React Native offers us a way to build native mobile apps with the React framework. If React Native is new to you, we recommend looking ... more


Monday, 23 July, 2018 UTC

Red Hot Form Validation for React Using calidation

Red Hot Form Validation for React Using calidation

Validation comes in two varieties. Back end (or server-side) to check that everything sent by the client is good and front end (or client-side) to check on things before anything is sent. While both necessary, client-side validation leads to significantly ... more


Monday, 23 July, 2018 UTC

Linting React Using ESLint with Create React App

Linting React Using ESLint with Create React App

Despite whether you like spaces or tabs, semicolons or none, single or double quotes, we can all agree on the importance of consistency and clarity in a code base. In this article, we’re going to go over the reasons why we should utilize a linter like ... more


Wednesday, 18 July, 2018 UTC

A Roadmap to Becoming a Better React Native Developer in 2018 & Beyond

A Roadmap to Becoming a Better React Native Developer in 2018 & Beyond

Do you want to learn React Native? I presume this is the reason you are here and I say that you’ve made the right decision! React Native, right now, is the most trending JavaScript framework for developing cross platform apps. Though there’s a bit of ... more


Tuesday, 17 July, 2018 UTC

Implementing Infinite Scroll Into a React Component

Implementing Infinite Scroll Into a React Component

In our face-paced modern society, who has time to click through pages and pages of content? “Not I,” said the web developer. In a world full of shortcuts, swipes and other gestures, the most efficient way to get through pages of content is the infinite ... more


Sunday, 15 July, 2018 UTC

Performant Redux Selectors with Reselect

Performant Redux Selectors with Reselect

In Redux a selector is a piece of logic that gets a specific piece of state from the store. Additionally, a selector can compute data from a given state, allowing the store to keep only basic raw data. Selectors are usually used as part of the binding ... more


Thursday, 12 July, 2018 UTC

Building an Accordion Component with React

Building an Accordion Component with React

Ahhhhh, the accordion. I’m not talking about Weird Al’s instrument of choice, but the graphical control element. Do you have too much content on a page? An accordion allows you to break things up into smaller chunks that your end-users can toggle open ... more


Wednesday, 11 July, 2018 UTC

Using Font Awesome 5 in React

Using Font Awesome 5 in React

In part one of this series we demoed reactstrap to create simple forms quickly and efficiently. In this installment, we’re going to use Font Awesome 5 to add some SVG icons and make our forms even more attractive. Note: Font Awesome 5.1 welcomed huge ... more


Wednesday, 11 July, 2018 UTC

Testing React / Redux Apps with Jest & Enzyme - Part 4: Testing Redux Reducers

Testing React / Redux Apps with Jest & Enzyme - Part 4: Testing Redux Reducers

This is part 4 of a 4-part series on testing React / Redux apps using both Jest and Enzyme for a robust testing solution. In this part we’ll cover some simple examples on how to test Redux reducers. The series Part 1 : Installation & Setup Part 2 ... more