hello.js

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

Wednesday, 7 November, 2018 UTC

Up and Running with the Serverless Framework

Up and Running with the Serverless Framework

In this article I’m going to walk you through using the Serverless framework to setup your very first AWS Lambda function. Serverless architecture is a very powerful way to leverage functions as a service and remove server scaling concerns. It is also ... more


Monday, 5 November, 2018 UTC

Building a blog with Gridsome: Listing All Posts and Pagination

Building a blog with Gridsome: Listing All Posts and Pagination

In the previous post I described how to get started with Gridsome, a Vue.js technology that you can use to build data-driven static websites based on different resources that are accessible using GraphQL. In the previous post, you can also see how to ... more


Friday, 2 November, 2018 UTC

Handling Command-line Arguments in Node.js Scripts

Handling Command-line Arguments in Node.js Scripts

If JavaScript is your language of choice, then you’ve probably written your fair share of command-line scripts that run on Node.js. Oftentimes you can get away with writing simple one-off scripts that only serve a single purpose. Other times you may ... more


Friday, 2 November, 2018 UTC

Angular Console: Simplifying the Angular CLI Experience

Angular Console: Simplifying the Angular CLI Experience

If you’ve spent any time at all with Angular (and if you’re reading this, I am assuming you have), then there is no denying the power and convenience that is the Angular CLI. In just a few keystrokes, you can generate a fully-featured web app. This is ... more


Thursday, 1 November, 2018 UTC

Skeleton screens with React and React Native ☠

Skeleton screens with React and React Native ☠

A skeleton screen is a user experience pattern that’s shown to reduce load time frustration. Luke Wroblewski coined this term for displaying neutral elements while gradually loading content into a container. This creates better “perceived performance”, ... more


Tuesday, 30 October, 2018 UTC

Building a blog with Gridsome: Creating the Blog

Building a blog with Gridsome: Creating the Blog

Gridsome is the Gatsby alternative for Vue.js that aims to provide the tech stack to build blazing fast statically generated websites. It’s data-driven, using a GraphQL layer to get data from different sources in order to dynamically generate pages from ... more


Saturday, 27 October, 2018 UTC

Payments with Stripe Checkout and React

Payments with Stripe Checkout and React

Need to accept online payments for a React web application in a PCI compliant manner? In this article, we’ll explore Stripe and how to integrate a payment form that collects credit card information into a React web application. Stripe is a popular online ... more


Friday, 26 October, 2018 UTC

Extending Vuetify Form Field Validation

Extending Vuetify Form Field Validation

Let’s explore how to extend Vuetify’s input field validation to replace empty fields with default values. Say we have a form with some fetched values, for example, a user profile form. The user wants to edit his data and then removes his login and moves ... more


Tuesday, 23 October, 2018 UTC

Angular 7: Upgrading & Summary of New Features

Angular 7: Upgrading & Summary of New Features

Angular 7 was just released and while it looks a little light on new features, there are some very interesting new tooling changes as well as some great features to improve performance. And continuing the recent trend from previous versions, upgrading ... more


Tuesday, 23 October, 2018 UTC

Angular Component Inheritance

Angular Component Inheritance

Encapsulate your common code in a base component and extend to your heart’s content! If you’ve spent any time in Angular, you no doubt have come across a time when you’ve wanted to share data or functionality and you’ve used services/providers. What ... more


Saturday, 20 October, 2018 UTC

Custom-Styled JavaScript Console Logging

Custom-Styled JavaScript Console Logging

Are you in the mood for a lightweight and fun project? We are going to build a custom-styled console logging class that you can use in place of console.log() ! We’re going to add some color and variation to our consoles. It will be similar in functionality ... more


Friday, 19 October, 2018 UTC

Tear-Free Forms with React and Formik

Tear-Free Forms with React and Formik

It’s not often that you write a web app that doesn’t contain at least one form. More often than naught, your entire app is just a series of forms. Each of these forms requires state management, event handlers, and, oftentimes, some sort of client-side ... more


Wednesday, 17 October, 2018 UTC

Don't Be Afraid of the JavaScript Stack Trace

Don't Be Afraid of the JavaScript Stack Trace

You start working on a new project right after you finish reading this post. It’s not outlandish - something not too far off from a previous project you’ve done. After 20-or-so minutes of getting the project base ready (so that you can begin the real ... more


Friday, 12 October, 2018 UTC

Introduction to Bulma with React

Introduction to Bulma with React

I’ll come out and say it, I’m still a fan of Bootstrap. With that, I’m not oblivious to the many alternatives that are floating around out there. One of the more inspired CSS frameworks I have come across recently is Bulma. It does everything I need ... more


Friday, 5 October, 2018 UTC

Styling Components with React Fela

Styling Components with React Fela

Styling in React comes in all shapes and sizes. Out of the box, you can assign classes via the className property or assign CSS properties by passing an object to the style property. While sufficient enough in most scenarios, they are not without their ... more


Tuesday, 2 October, 2018 UTC

Introduction to Conic Gradients in CSS

Introduction to Conic Gradients in CSS

We can already do linear gradients and radial gradients with CSS quite easily, and now there’s a 3rd type of gradient that will be defined in the spec. Conic gradients are similar to radial gradients, except that the color stops are on the outer edge ... more


Sunday, 30 September, 2018 UTC

Using Geolocation in React Native

Using Geolocation in React Native

React Native takes advantage of the Geolocation API that’s native on the web. This API returns different methods such as getCurrentPosition , and watchPosition which are available in React Native polyfilled. To demonstrate how to use it in a React Native ... more


Friday, 28 September, 2018 UTC

Flatten Arrays in Vanilla JavaScript with flat() and flatMap()

Flatten Arrays in Vanilla JavaScript with flat() and flatMap()

Libraries like Lodash and Underscore.js have provided us with utilities to help with flattening arrays for a while now. Thanks to the continuous evolvement of the ECMAScript standard, we’ll now be getting methods to do that directly in vanilla JavaScript, ... more


Friday, 28 September, 2018 UTC

Rapid Prototyping Made Easy with React PowerPlug

Rapid Prototyping Made Easy with React PowerPlug

If you’re trying to rapid prototype an app the last thing you want to be doing is implementing the same state management logic over and over. Adding something like Redux can help but tends to just adds a layer of complexity that can slow you down every ... more


Monday, 24 September, 2018 UTC

Getting Started with Shards Vue

Getting Started with Shards Vue

Shards Vue is a beautiful and modern Vue.js UI toolkit packed with dozens of custom pre-built components that you can use to kick-start your next app. The library was built from scratch with the goals of having a very small footprint and providing powerful ... more


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


Thursday, 20 September, 2018 UTC

Up and Running With Reakit

Up and Running With Reakit

In this article I’ll bring you up to speed on Reakit, a toolkit for building React UIs. Together we’ll build a customer information form using Reakit components. If you’re looking to understand how to start creating components with it in a short amount ... 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