![[ERR!]](https://pbs.twimg.com/profile_images/828593972029317120/4UXq5Hmj_normal.jpg)
Exploring and learning about new JavaScript features is something we all continuously do and having useful and practical articles to guide us through the process is always helpful. If you haven't already read it, be sure to check out: "A practical guide to Javascript Proxy" by Thomas Barrasso.
We're always happy to be the bearer of good news and this week it's to all the TypeScript users out there! With TypeScript 3.4 out, it brings with it a host of new features, one of which you can read more about on LogRocket's blog: "const assertions are the killer new TypeScript feature" by Paul Cowan.
Finally, a great article for Vue.js developers: "Sharing and Reusing Vue Mixins in the Cloud with Bit.dev" by Nwose Lotanna.
General
Google Fonts Now Supports font-display!
font-display is a CSS feature that allows us to control how we load fonts. Google Fonts are used by many websites (including Scotch.io) and up until now, we didn't have the ability to control how we loaded the fonts. Now we can add a font-display through a url parameter! Shipped!
Authored by: Scotch Development
WebSockets tutorial: How to go real-time with Node and React
As mentioned in the introduction, the WebSocket protocol has only two agendas. Let's see how WebSockets fulfills those agendas. To do that, I'm going to spin off a Node.js server and connect it to a client built with React.js.
Authored by: Avanthika Meenakshi
Shared Components Best Practices for 2019
Recently I published "How do we really use reusable components ", where I shared common pains learned by over 30 teams about shared components. In this post, based on this knowledge, I will try to define some practices that will help your team successfully develop and manage shared components.
Authored by: Bit
How to Create Cool Interactive Sankey Diagrams Using JavaScript
Sankey diagrams are becoming more and more popular in data visualization tasks. So, it's essential for front-end web developers to know how to create charts of this type. Actually, it is quite a...
Authored by: Alfrick Opidi
Elegant error handling with the JavaScript Either Monad
JavaScript gives us a built-in language feature for handling exceptions: try...catch statements. And they're better than littering our code with if-statements. But they can be problematic. And they are not the only way to handle errors. In this article, we'll take a look at using the 'Either monad' as an alternative to try...catch.
Authored by: James Sinclair
JavaScript
A practical guide to ES6 Proxy
With Proxy, you get a tiger object disguised as a cat object. Here are about half a dozen examples that I hope will convince you that Proxy provides powerful metaprogramming in Javascript. Although...
Authored by: Bit
Javascript Blob Object Tutorial With Example
Javascript Blob Object Tutorial With Example | Blob Object Explained.
Authored by: KrunalDLathiya
Javascript Function Call Example | Function.prototype.call() Tutorial
Javascript Function Call Example | Function.prototype.call() Tutorial is today's topic. The call() method calls the function with the given this value and arguments provided individually. The call() allows for the method belonging to one object to be assigned and called for the different object. The call() provides a new value of this to the function/method.
Authored by: KrunalDLathiya
Label Statements in JavaScript
If there's one thing that always gives me trouble, it's complex loops in JavaScript. (And recursion in JavaScript, which makes two things, but that's a different story for a different article.) It's often difficult to keep track of things in nested loops.
Authored by: DiscoverSDK
The Basics of JavaScript Generators
ES6 generator functions are the functions which can stop its execution in the middle and canresume execution further from the same point. These functions do not return a single value, instead, it is capable of returning multiple values. They are based on the concept of iterators.
Authored by: gitconnected
TypeScript
const assertions are the killer new TypeScript feature
Typescript 3.4 is out and while I find the official TypeScript docs very informative, they always feel a little bit too academic and a touch dry. When I am finding out about new features, I want to know the exact ailment this feature is going to cure.
Authored by: LogRocket
TypeScript 3.0: The unknown Type
TypeScript 3.0 introduced a new unknown type which is the type-safe counterpart of the any type. The main difference between unknown and any is that unknown is much less permissive than any: we have to do some form of checking before performing most operations on values of type unknown, whereas we don't have to do any checks before performing operations on values of type any.
Authored by: Marius Schulz
Node.js TypeScript #14. Measuring processes & threads with Performance Hooks
When writing Node.js code, we can approach tasks in many ways. While all of them might work fine, some perform better than others, and as developers, we should strive to make both easily readable and fast applications. In this article, we learn how to measure the performance of our code using Performance Hooks, also called the Performance Timing API.
Authored by: Marcin Wanago
Angular
Component Inheritance in Angular
In my previous job at Reimnet, I was assigned as the head of a team that was in charge of the creation of the admin side of an Angular project called Exchange App. During the building process, I encountered this Repeating-Yourself kinda thing. I was constantly copying and pasting code from one component to another.
Authored by: Bit
Most Of Your Modal Windows Should Be Directly Accessible By Route In Angular 7.2.15
Ben Nadel posits that most modal windows within a Single-Page Application (SPA) should be directly accessible by route. With the auxiliary routes in the Angular 7.2.15 router, this becomes a trivial task. And, creates an application architecture that is far more flexible and beneficial to the long-term support of the application and its users.
Authored by: Ben Nadel
Building Data Visualization with Angular and Ngx-charts
Data Visualization is visual representation of quantitative information in the form of charts, graphs, plots and so on. There are so many libraries and frameworks available to visualize data, but the one that we are going to talk about in this article is ngx-charts.
Authored by: Swathi Prasad
Implement custom dirty-checking using NgZone/Zone
Trigger a change detection cycle only when needed using Angular extended Zone.js functionality in a class called NgZone Change detection is the process of reflecting changes made on an app state to the DOM. With the advent of SPAs, web apps HTML are dynamically generated by the framework code.
Authored by: Bit
React
Building a React Infinite Scroller Component from Scratch
We all know the great content discovery experience where we can just scroll and scroll, discovering more items, people and photos. When building our web or mobile apps, we often want to give this great experience to our users. In this tutorial, we are going to build a react infinite scroll with pure JavaScript and embed it into a ReactJS component.
Authored by: Bit
Building a chat app with React Hooks, a pragmatic example
Hooks are a new addition in React 16.8 which enable us to use state and other React features without writing a class. "I can build a fully functional app without classes?" I hear you ask. Yes, you can! And in this tutorial, I will show you how.
Authored by: JavaScript Kicks
How to Easily Share and Consume React Components Using Bit
First, we install the create-react-app CLI globally in our machine: npm i create-react-app -g Install the Bit CLI tool: npm i bit-bin -g Next, we scaffold our React project: create-react-app react-components Move into the directory: cd react-components Our components will be contained in the components folder, so we create it:
Authored by: Bit
Build a simple Modal Component with React
I love modals because they save a lot of time required to load a new tab. In this post, we're going to learn how to create an awesome reusable modal with React from scratch.
Authored by: Bit
Creating Your Own React Validation Library: The Basics (Part 1)
Ever wondered how validation libraries work? This article will tell you how to build your very own validation library for React step by step. The next part will add some more advanced features, and the final part will focus on improving the developer experience.
Authored by: Smashing Magazine
Vue
Sharing and Reusing Vue Mixins in the cloud with Bit.dev
This post is suited for all stages of developers that use Vue JS, and this includes beginners. It is also an introduction to the amazing Vue component sharing tool, Bit. Here are a few prerequisites you should already have before going through this article. You will need the following: Node.js version 10.x and above installed.
Authored by: Bit
Accessible Form Validation Messages with ARIA and Vue.js
Did you know that in your client-side validation errors in your web forms, and even additional instructions you provide for your form fields, might not be heard by screenreader users? In this article you'll learn how to use ARIA and Vue.js to make your form error messages and instructions more accessible to all of your users.
Authored by: Vue.js Developers
Server-side rendering with Vue and Nuxt.js
Server-side Rendering (SSR) or Universal Rendering, as it is sometimes called, is not a new concept in web development. Before the increasing popularity of single-page applications, a web-page typically received an HTML(in most cases accompanied with some images, style sheet, and JavaScript) response after making a request to the server.
Authored by: LogRocket
Node.js
Console in Nodejs
Learn about the fundamentals of Console in NodeJs Console is the most widely used utility in web development, starting from the browser to Nodejs and v8's d8 shell. It is the most used debugging tool after alert - remember it? :) I personally used alert during my beginner days in web development.
Authored by: Bit
Node.js file streams explained!
In today's post, we're continuing the discovery of Node.js ( v10.15.3 LTS) APIs! Last time, we've discussed the File System (FS) API used to read and write files, but not all of it. We haven't yet talked about quite a few things, including streams, which present a great, alternative way of reading and writing data.
Authored by: areknawo
Libraries and Tools
Swipe Gallery using Vue.js & Tailwind
Welcome to the Widget of the Week series, where I take gifs or videos of awesome UI/UX components, and bring them to life with code. Today we are going to create a swipe gallery that works with both touch or mouse controls.
Authored by: Eder Díaz
Code Coverage by Parcel Bundler
Instrument code using Parcel Saving coverage information Sending report to coveralls.io More information In my previous blog post "Code Coverage for End-to-end Tests" I have instrumented
Authored by: Gleb Bahmutov
These are the best JavaScript chart libraries for 2019
With data collection and use continuing to increase exponentially, the need to visualize this data is becoming more important. Developers seek to consolidate millions of database records into...
Authored by: freeCodeCamp.org
Testing
Combined End-to-end and Unit Test Coverage
How to achieve 100% code coverage by combining end-to-end and unit tests without losing your sanity. In my previous blog post "Stub navigator API in end-to-end tests" I have introduced an application that uses navigator browser API to show the battery charge percentage.
Authored by: Gleb Bahmutov
End-to-end Testing for Server-Side Rendered Pages
How to validate SSR page using Cypress.io test runner Note: the source code for this blog post is in bahmutov/react-server-example repository which is a fork of the excellent mhart/react-server-example. If you install dependencies and run this web application, it starts listening on port 3000.
Authored by: Gleb Bahmutov
Other
Programmatic file downloads in the browser
File downloading is a core aspect of surfing the internet. Tons of files get downloaded from the internet every day ranging from binary files (like applications, images, videos, and audios) to files in plain text. Traditionally, the file to be downloaded is first requested from a server through a client - such as a user's web browser.
Authored by: Glad Chinda
The Urlist - An application study in Serverless and Azure
Today we pleased to announce that we are releasing a project called "The Urlist". You can access it starting today at theurlist.com. The Urlist is an application that lets you create lists of url's that you can share with others. Get it? A list of URL's? The Urlist?
Authored by: Burke H✪lland
