hello.js

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

Wednesday, 23 May, 2018 UTC

Lightweight Charts in Vue.js with vue2-frappe

Lightweight Charts in Vue.js with vue2-frappe

When it comes to charting on the web, there are two main heavy-hitters: D3.js and Chart.js. But sometimes you don’t need a 500 pound gorilla. Sometimes you just want simple SVG charts that do exactly what you expect. That’s where Frappe Charts fits in. ... more


Wednesday, 23 May, 2018 UTC

Loading Vuex Modules Dynamically

Loading Vuex Modules Dynamically

Vuex is an easy to use and performant solution to handle state management. It makes it a breeze to manage large-scale Vue.js applications and ensures a predictable way to mutate the state by exposing a store. You may already know about Vuex, but if you ... more


Monday, 21 May, 2018 UTC

React Devtools: A Brief Introduction

React Devtools: A Brief Introduction

React Developer Tools (Devtools for short) is a browser extension for Chrome and Firefox that provides an extra set of React-specific inspection widgets to assist you with development. By installing React Devtools, you’ll get two main features: a view ... more


Monday, 21 May, 2018 UTC

Testing React / Redux Apps with Jest & Enzyme - Part 1: Installation & Setup

Testing React / Redux Apps with Jest & Enzyme - Part 1: Installation & Setup

In this four-part series learn how to test your React / Redux applications using both Jest and Enzyme for a robust testing solution. This series focuses on testing and assumes you have React / Redux knowledge. Recommended File Structure Leverage Default ... more


Sunday, 20 May, 2018 UTC

Creating Patterns Using CSS & the <css-doodle /> Web Component

Creating Patterns Using CSS & the <css-doodle /> Web Component

<css-doodle /> is a Web Component that makes it easy to create all kinds of patterns for your web designs. It’s a great example of what can be achieved using modern web technologies like custom elements, shadow DOM and CSS Grid. You can see an ... more


Friday, 18 May, 2018 UTC

Lazy Loading Components with vue-cli 3, webpack & Vue Router

Lazy Loading Components with vue-cli 3, webpack & Vue Router

SPAs (Single Page Applications) often consist of dozens or even hundreds of components that can be divided into several JavaScript bundle files. The goal of this post is to show one way to do this division and how to load each file asynchronously, only ... more


Wednesday, 16 May, 2018 UTC

Compile Vue.js templates on the Fly with v-runtime-template

Compile Vue.js templates on the Fly with v-runtime-template

I recently released v-runtime-template, a Vue component that makes it easy to compile and interpret a Vue.js template at runtime by using a v-html -like API. I had a problem in a project where I had to receive a template from the server. Why you say? ... more


Sunday, 13 May, 2018 UTC

A Quick Intro to React's Higher-Order Components

A Quick Intro to React's Higher-Order Components

When you pass a component to a function and it returns a new component, it’s called a higher-order component (HOC). If that sounds simple, it is! And your code will be simpler for using them. Over the course of this post, you’ll see how the higher-order ... more


Thursday, 10 May, 2018 UTC

Styling React Components Using glamorous

Styling React Components Using glamorous

💄 glamorous is a lightweight library for CSS-in-JS with a simple API that’s similar to styled-components’ and that makes use of glamor under the hood. Two of the main differences compared to styled-components is the use of JavaScript object literals ... more


Tuesday, 8 May, 2018 UTC

Tame the Vuex Beast with vuex-pathify

Tame the Vuex Beast with vuex-pathify

As far as Flux architecture implementations, Vue.js’ Vuex is one of the simplest, but most elegant. However, it still could be better. Trying to remember to write getters and mutations for every property in your store seems like a bit of unneeded cognitive ... more


Tuesday, 8 May, 2018 UTC

Working with Environment Variables in Vue.js

Working with Environment Variables in Vue.js

In this post, we’ll learn how to work with distinct configurations between development and production mode for Vue.js projects that use the CLI’s webpack template . In a web app, we most likely have to access a backend API server through a URL. This ... more


Friday, 4 May, 2018 UTC

Basic Express Server in Node.js

Basic Express Server in Node.js

Express is a web application framework for Node.js that allows you to spin up robust APIs and web servers in a much easier and cleaner way. It is a lightweight package that does not obscure the core Node.js features. In this post we’ll go over how to ... more


Thursday, 3 May, 2018 UTC

Angular 6: Upgrading & Summary of New Features

Angular 6: Upgrading & Summary of New Features

Angular 6 , was just released, and while the amount of new features is minimal, a lot has changed under the hood in terms of tooling. The new tooling additions are especially great for facilitating upgrading and adding new libraries to your apps. In ... more


Wednesday, 2 May, 2018 UTC

Accessing the Clipboard in JavaScript Using the Async Clipboard API

Accessing the Clipboard in JavaScript Using the Async Clipboard API

There’s a new JavaScript API for asynchronous clipboard access with a spec that’s currently in the works. The de facto way to copy text to the clipboard on the web has been to use document.execCommand, but a major caveat is that the operations are synchronous ... more


Tuesday, 1 May, 2018 UTC

A Look at the Resize Observer JavaScript API

A Look at the Resize Observer JavaScript API

Resize Observer is a new JavaScript API that’s very similar to other observer APIs like the Intersection Observer API. It allows for elements to be notified when their size changes. The most frequent reason for an element’s size to change is when the ... more


Monday, 30 April, 2018 UTC

Communicating Between Recursive Components in Vue.js

Communicating Between Recursive Components in Vue.js

In the Recursive Components in Vue.js post we’ve seen how to build a recursive Tree component, but we didn’t have to communicate any action across the tree. Let’s tackle that problem in this post. What do you Mean by Communication? Imagine that you want ... more


Monday, 30 April, 2018 UTC

Write Element-Based Responsive Components in Vue.js

Write Element-Based Responsive Components in Vue.js

CSS Media Queries are great. They allow you to change the styles of your components based on the size of the browser viewport. But they’re not always what you need. Sometimes you want to change your components’ styles based on the width of the components ... more


Saturday, 28 April, 2018 UTC

How to integrate ESLint with Vue.js and Vetur in Visual Studio Code

How to integrate ESLint with Vue.js and Vetur in Visual Studio Code

If you don’t know ESLint, it’s a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code, with the goal of making code more consistent and avoiding bugs, checking the code formatting, unused variables, etc. Through this tool, ... more


Thursday, 26 April, 2018 UTC

Native Modals on the Web Using the HTML Dialog Element

Native Modals on the Web Using the HTML Dialog Element

The HTML 5.2 spec introduced a dialog element that makes it easy to implement native modals and pop-ups. Modals are an important part of almost any non-trivial web app, so it’s promising to think that there’s finally a way to implement one without re-inventing ... more


Tuesday, 24 April, 2018 UTC

Understanding the React Context API

Understanding the React Context API

With React 16.3 we now have access to a brand new context API. With React’s old context API, the official recommendation was for developers to avoid using it, but now the new context API is a first-class citizen. While not meant as a replacement for ... more


Monday, 23 April, 2018 UTC

Creating a Recursive Tree Component in Vue.js

Creating a Recursive Tree Component in Vue.js

Recursion has been always a pain to learn in algorithmics. In some cases however, using recursion feels more natural than using iteration. Traversing a tree is one of them. We can create recursive components in Vue.js and any other framework by following ... more


Monday, 23 April, 2018 UTC

Linting TypeScript Vue.js Components with Wotan

Linting TypeScript Vue.js Components with Wotan

TypeScript is a special language. People tend to either love it or vehemently hate it (though it seems like most of those who’ve tried it, love it). Regardless of your opinion, TypeScript can be quite convenient at times. But, it can be a pain to get ... more


Thursday, 19 April, 2018 UTC

Code Splitting in React Using React Loadable

Code Splitting in React Using React Loadable

Code splitting is a technique used more in more with modern web app development that allows to load chunks of code only when needed. For example, with route-based code splitting, a user can be navigating to different routes of an app and behind the scenes ... more


Thursday, 19 April, 2018 UTC

Easy State Management in React Using Unstated

Easy State Management in React Using Unstated

Another day, another way to manage your application state in React! Unstated is a new library by @jamiebuilds that uses the React’s new context API to allow for a really simple way to manage your state. Let’s go over how to use Unstated, and don’t worry, ... more


Wednesday, 18 April, 2018 UTC

Making Elements Stick in CSS Using position: sticky

Making Elements Stick in CSS Using position: sticky

There’s a new value in town for the CSS position property: sticky . It allows us to make elements stick when the scroll reaches a certain point. An element with position: sticky will behave like a relatively-positioned element until it reaches a specified ... more


Monday, 16 April, 2018 UTC

Getting Started with Server-Side Rendering Using Nuxt.js

Getting Started with Server-Side Rendering Using Nuxt.js

Nuxt.js is a powerful and simple framework built to create universal, server-side rendered applications using Vue.js. It was inpsired by Next; React’s server-side rendering (SSR) framework. Nuxt was created by Alex & Sébastien Chopin and has gained ... more


Monday, 16 April, 2018 UTC

An Introduction to VuePress

An Introduction to VuePress

You may have heard of VuePress recently, it appeared almost overnight and shortly thereafter became Product of the Day on ProductHunt. What is it about VuePress that makes it so special? What is VuePress? Well, it’s effectively a static site generator. ... more


Sunday, 15 April, 2018 UTC

File Upload in Vue.js Using vue-dropzone

File Upload in Vue.js Using vue-dropzone

vue-dropzone is a vue component implemented on top of Dropzone.js that provides drag’n’drop functionality for file uploads with image previews. It’s quite powerful and has many options, although it gives you a great deal of functionality out-of-the-box ... more


Thursday, 12 April, 2018 UTC

Animations in React Using React Motion

Animations in React Using React Motion

React Motion is a popular library for animations in React. It makes use of physics to create animations that feel natural. All we have to do to create realistic animations is provide values for stiffness and damping and React Motion takes care of the ... more


Tuesday, 10 April, 2018 UTC

Displaying Content Placeholders in Vue.js with vue-content-loader

Displaying Content Placeholders in Vue.js with vue-content-loader

You might not have noticed yet, but several major apps are migrating away from the indefinite loading circle indicator paradigm (say that five times fast). Why? Because, while it’s better than nothing, it still makes users feel impatient waiting for ... more