![[ERR!]](https://pbs.twimg.com/profile_images/828593972029317120/4UXq5Hmj_normal.jpg)
This week's focus is on Vanilla JavaScript. So let's dive right in.
If you want to expand your knowledge on async - await in JavaScript, and you should, we recommend a great article "Deeply Understanding JavaScript Async and Await with Examples" by Arfat Salman.
Next, we encourage you to check out the first part of the series "How Does JavaScript Really Work?" by Priyesh Patel.
We also have something for Node.js developers that like TypeScript. We are sure you'll enjoy learning all about "Best Practices For Using TypeScript with Node.js" with Aditya Modi.
Finally, make sure to check out the latest release notes of our favorite JavaScript framework, Aurelia on their official blog.
General
12 tips for writing clean and scalable JavaScript
Of course, you can group multiple functions into one module (and/or class, if you wish) if these functions are used in a similar way or do similar things. For example, if you have many different calculations to do, split them up into isolated steps (functions) that you can chain.
Authored by: JavaScript Kicks
Understanding Shadow DOM v1
Before we delve into how to create shadow DOMs, it's important to understand what DOM is. The W3C Document Object Model (DOM) provides a platform- and language-neutral application programming interface (API) for representing and manipulating information stored in HTML and XML documents. With DOM, programmers can access, add, delete, or change elements and content.
Authored by: LogRocket
Styling HTML checkboxes is hard - here's why
In today's world, most web developers consider mastering JavaScript as the main priority, and for a good reason. JS is the scripting language of the web. While HTML and CSS make the websites look... how they look, JS with the access to HTML and CSS API, very good performance and its versatility is web developers' favorite.
Authored by: areknawo
JavaScript
Deeply Understanding JavaScript Async and Await with Examples
Introduced in ES2017(ES8), async functions make working with promises much easier. It is important to note the async functions work on top of promises. They are not a fundamentally different concept. They can be thought of as an alternate way of writing promise-based code. We can avoid chaining promise altogether using async/await.
Authored by: Bit
How Does JavaScript Really Work? (Part 1)
If you are a JS developer or a student learning the language, there is a very high chance that you came across the two-letter word 'V8''. In this article, I will give you a brief overview of different JS engines and then dive deeper into how the V8 engine works.
Authored by: Bit
TypeScript
Best Practices For Using TypeScript with Node.js
If any of you have worked on TypeScript 1.x in the past, you might remember it being difficult and unwieldy. TypeScript version 2 brings many nice improvements. One of the biggest of them is how clean and simple has it become to install TypeScript compiler.
Authored by: Bit
Worker Threads with TypeScript - Node.js TypeScript #12
In this article, we cover the very basics of using TypeScript Worker Threads and figure out how to make them work with TypeScript.
Authored by: Marcin Wanago
Angular
New Angular features you didn't know existed
In this post, you will be introduced to a few new Angular features you might not know about. We will look at the thought process behind them and even some examples on how to get started using them.
Authored by: LogRocket
Using replaceUrl To Persist Search Filters In The URL Without Messing Up The Browser History In Angular 7.2.14
Ben Nadel demonstrates how to use the "replaceUrl" option of the Angular 7.2.14 Router to persist search criteria to the URL without bloating the Browser's History stack unnecessarily. This can lead to a more intuitive Back Button experience for the user.
Authored by: Ben Nadel
Creating A Proxy For Analytics Libraries In Order To Defer Loading And Parsing Overhead In Angular 7.2.13
Ben Nadel experiments with the creation of Proxy classes for Analytics libraries that defer the loading, parsing, and initialization of 3rd-party analytics libraries in an Angular 7.2.13 app. The hope being that the application loads faster and decreases the TTFI (Time to First Interaction) for the user.
Authored by: Ben Nadel
Introduction to Angular Grid
Displaying and manipulating tabular data is often necessary in software applications. In this article, I will introduce ag-Grid for Angular applications. ag-Grid is implemented in TypeScript and can be used for displaying both simple and complex data. It also gives good user experience.
Authored by: Swathi Prasad
Angular Tutorial: Learn Angular from scratch step by step
Let me introduce you to Angular Angular is a JavaScript open-source front-end web application framework. It is primarily sustained by Google together with an extended community of people and companies, to approach many of the challenges faced when developing single page, cross-platform, performant applications. It is fully extensible and works well with other libraries.
Authored by: Neeraj
React
WebView - The Bridge that connects React native with the Web
WebView is the channel that connects React Native with Web platforms, giving us many great options to create a sort of connections to our apps that is running on the Web!
Authored by: Bit
5 things you didn't know about React DevTools
If you're into React development, chances are you've tried the official React DevTools. This browser extension lets you debug your components, and is available for Chrome, Firefox and even as a standalone application for Safari and React Native debugging. The React DevTools is under active development, and new features are added all of the time.
Authored by: selbekk
React Navigation vs. React Native Navigation: Which is right for you?
Disclaimer: This post comprises my personal opinion, which was built on the experience of using multiple navigation libraries for React Native apps. When it comes to mobile app development using React Native, one of the most important steps is selecting the perfect navigation library for your project.
Authored by: LogRocket
Benchmark alpha-released hooks API in React Redux with alternatives
Introduction Recently, React Redux released hooks API. It's v7.1.0-alpha.4 as of writing. On the other hand, I've been developing a new React Redux binding library with hooks and Proxy. It's time to benchmark both of them to have better understanding in performance.
Authored by: Daishi Kato
React: JSX & Rendering
If you're new to React, you'll likely have heard about JSX, or JavaScript XML - it's an XML-like code for elements and components. In this article, we're going to take a look at what JSX is & why we should use it in our React applications.
Authored by: Tim Robards
Aurelia
Aurelia Release Notes - May 2019
This month's releases include an update to our Webpack plugin, more improvements to UI virtualization, additional conversion of Aurelia libraries to TypeScript, for improved maintenance and contributor-friendliness, and a few bug and package fixes to other libraries.
Authored by: Aurelia
Vue
Quick Intro to Vuex ORM
If you're looking to make a scalable Vue or Nuxt app, you might consider using Vuex ORM. I've recently used it in a project, and in this article, I'll share with you how it works and why I think you'll like it too.
Authored by: JavaScript Kicks
Introduction to Vue Render Functions (w/ examples)
Lately, I've been reading Dr. Harari's book "Sapiens." If you haven't read it yet, you should. It's killer. Plus, it makes you appreciate our specie's progress through the creative use of technology. And just like our ancestors' living 10,000 years ago, we're constantly using new tools to advance and evolve (we've just come very far from sticks and stones).
Authored by: Snipcart
How to create a 2D multiplayer game with Vue.js and Socket.io
In this tutorial, we're going to explore web browser based gaming using Vue.js, but we're going to include sockets through Socket.io for a multiplayer perspective.
Authored by: Nic Raboy
Node.js
Node Express Analytics Dashboard with Cube.js
In the following tutorial, I'll show you how to create a basic analytics dashboard with Node, Express, and Cube.js. As a database, we're going to use MongoDB with MongoDB BI Connector. If you're not familiar with it, I highly recommend you go through the Building a MongoDB Dashboard tutorial.
Authored by: Cube.js
Node.js File System API - beginner-friendly guide
Continuing the "Node.js inside-out!" series, today we'll be taking a closer look at the File System API - one of the biggest Node.js APIs there is! Just a note - we're using Node.js LTS v10.15.3. Now, without further ado, let's dive in!
Authored by: areknawo
Building MongoDB Dashboard using Node.js
For a pretty decent amount of time, doing analytics with MongoDB required additional overhead compared to modern SQL RDBMS and Data Warehouses associated with aggregation pipeline and MapReduce practices. While this approach allowed one to craft advanced custom tailored aggregation algorithms it required additional knowledge of how to build and maintain it.
Authored by: Cube.js
Libraries and Tools
Automatically generate your own React components with plop.js
Do you often find yourself copying and pasting old components as templates for new components? I know I do. Having worked with Angular before, I started to feel sad that there is no React equivalent to the Angular CLI's generate API.
Authored by: LogRocket
7 Tools for Developing Web Components in 2019
Web components in the wild: from lit-html to Stencil, Svelete and beyond. So lately there's been much buzz around web-components. Here's the gist of why: Components and widgets that build on the Web Component standards, will work across modern browsers, and can be used with any JavaScript library or framework that works with HTML.
Authored by: Bit
Introduction to GraphQL
GraphQL is an open-source query language developed by Facebook in 2015 and it is built on the graph data structure. Many big companies are adopting GraphQL besides Facebook, including GitHub, Pinterest, Twitter, Sky, The New York Times, Shopify, Yelp and many others.
Authored by: JavaScript Kicks
Testing
Node Testing Setup with Mocha and Chai
This tutorial is part 2 of 2 in this series. This tutorial demonstrates how to setup testing with Mocha and Chai in Node.js. Whereas the previous tutorial has already shown you how to setup your Node.js application, this tutorial sets up a testing environment for your Node.js project.
Authored by: Robin Wieruch
Code Coverage for End-to-end Tests
How to instrument application code and collect code coverage during Cypress E2E tests. In my previous blog post "Stub navigator API in end-to-end tests" I have shown a small web application that shows the current battery charge information. Then I have shown several Cypress end-to-end tests and found an edge case that caused the application to crash.
Authored by: Gleb Bahmutov
Other
How to Create JavaScript Word Cloud Chart - Tutorial for Web Developers
Wondering how to make a beautiful interactive Word Cloud using JavaScript? Join Irina Maximova as in her new data visualization tutorial, she guides you through the entire development process, demonstrating it's easier to create a JavaScript word cloud chart for an HTML5 app or web page than you might think!
Authored by: Andrey Khachaturov
How to Find and Use Components from bit.dev to Build Your App
In this post, we will show how you can use individual components from Bit collections in your React apps. Bit makes is easy to isolate and share components from libraries and apps. Bit's hub ( bit.dev) makes it easy to find and collaborate on these components.
Authored by: Bit
Search & dynamic shortcut links for a static site
Search & dynamic shortcut links for a static site In porting my blog from Heroku to Netlify there were a few dynamic aspects that I had to reconsider in moving to a fully static hosting platform. Two features, which in my case, are closely connected, were search and dynamic shortcut links.
Authored by: Remy Sharp
