Did you know that today, in 1861, the first transcontinental telegraph system was completed, making it possible to transmit messages rapidly (by mid-19th-century standards) from coast to coast? We've certainly come a long way, haven't we? Speaking of which, Vitaly Shalak tells us why optimisation of site performance is a big deal and it’s either 3 seconds or users leave, in "How to Speed up your Web App and Improve Website Performance" on dashBOUQUET.
Struggling with Reduce? Yazeed Bzadough's got you covered in two great pieces on freeCodeCamp, so check out "Learn Reduce in 10 Minutes", followed by "10 JavaScript Utility Functions Made with Reduce."
In the mood to build? Chidume Nnamdi helps with practicing Node.js-terminal skills by building CLI spinners in "Build Command-Line Spinners in Node.js" and/or teaches how to build your own HTML playground in "Build an HTML/CSS/JS Playground" while Fernando Doglio gets busy with how to build a JS game using MelonJS and Tiled in "Building a Typing Game with MelonJS", all on the Bits and Pieces blog.
General
How to Speed up your Web App and Improve Website Performance
Optimization of site performance is a big deal. It involves multiple aspects to take care of and many of them depend on the site itself, its complexity and elements. However, there is also a set of common optimization methods that work for any site.
Authored by: Shaleynikov
Building a Typing Game with MelonJS
Game development is not something that needs to be restricted to people using Unity or Unreal Engine4. JavaScript game development has been a thing for quite some time. In fact, the latest versions...
Authored by: Bit
RxJS Subjects in Depth
In this article, I want to explore the topic of RxJS's implementation of Subjects, a utility that is increasingly getting awareness and love from the community. In the past, I have used Subjects in a variety of ways, but sometimes not fully understanding what they are internally and what are the main differences with Observables.
Authored by: Bit
Build a Traffic Alert App with TensorFlow.js, Ably and HTML
In this blog post, we will showcase the power of Ably and Tensorflow.js. Everything will be just on the frontend, in just one html. It's a demo, in production you may not do things this way but you can have a feeling how powerful Ably is and how you can use deep learning model with just a few lines of code.
Authored by: Cheuk Ting Ho
JavaScript
A Quick Guide To Linked Lists In JavaScript
What are Linked Lists? They are a way to organize data. It is a list that is made of nodes where every node only has access to its data and knows where the next element in the list is.
Authored by: Kenneth Young Castro
Build an HTML/CSS/JS Playground
Bit, Codepen, Stackblitz, and Storybook has some of the most popular code playgrounds right now. Codepen is used for vanilla HTML/CSS/JS, Bit's Playground is used for Angular, React and Vue, Stackblitz covers a whole lot while Storybook is mainly for React.
Authored by: Bit
7 Simple but Tricky JavaScript Interview Questions
My top stressing things in software development are: The coding interview A toxic manager or teammate Not JavaScript, this, CSS, Internet Explorer, but the 2 above. If you're qualifying as Senior Developer that involves JavaScript, there's a good chance that you will be asked for tricky questions during the coding interview.
Authored by: Dmitri Pavlutin
TypeScript
My List of Uncommon But Useful Typescript Types
Typescript is awesome! It allows developers to use primitive and user-defined types in javascript. Lately, more and more javascript frameworks are providing firsthand Typescript support; Angular...
Authored by: Bit
Loops in TypeScript
In the previous article of our TypeScript series, we explored the topic of operators in TypeScript. Today, we'll examine the issue of loops in TypeScript. It will be no surprise to you that TypeScript is equipped with different types of loops. In TypeScript, we can divide loops into two categories: definite and indefinite.
Authored by: DiscoverSDK
Your basic guide to finally understand TypeScript
As the power of TypeScript has been rising during the last few years, thousands of developers decided to start using this Javascript superset to empower their code even more. This guide aims to be a quick primer for all the developers out there who would like to learn how to use TypeScript and use it in their next project.
Authored by: Piero Borrelli
Angular
Google Maps in Angular
Google maps meet Angular. Having such a strong developer community and being used by thousands of developers around the world made Angular ideal for bringing most tools to the framework. bringing Google maps to Angular is one of them, it solved many problems for the Angular users.
Authored by: Bit
Angular 8 Chart.js Tutorial with ng2-charts Examples - positronX.io
Angular 8 Chart.js Tutorial with ng2-charts Examples - Display data using various charts such as pie chart, bar chart, radar, doughnut or bubble chart.
Authored by: Digamber Singh
React
How to use CSS Modules in React?
CSS Modules are one of the most popular ways for styling React components. Whether you are using only CSS or a more advanced pre-processor like SASS, it doesn't matter for CSS Modules: You can write all these styles in your style sheet files next to your React components.
Authored by: Robin Wieruch
How I Learned React
Have you heard that old saying... "How do you eat an elephant?" ... One bite at a time! ... This article is off to a great start, I can tell. But really, though: breaking up big problems into tiny bite-sized ones is the only way to really get anything done in this world.
Authored by: Dave Ceddia
Svelte vs React: First impressions
3 years ago, Rich Harris created a framework which is called Svelte. The biggest impact on that new framework was that it's not working on Virtual DOM like ReactJS, VueJS or AngularJS. I created exactly same todo list application both in Svelte and React.
Authored by: JavaScript in Plain English
How to use async function in React hooks useEffect (Typescript/JS)?
👾At first glance you could have the idea to do something similar to get your content from a remote API as example. const MyFunctionnalComponent: React.FC = (props) => { useEffect(async () => { await loadContent(); }, []); If you're using Typescript, the compiler should be yielding something like this : Argument of type '() => Promise ' is not assignable to parameter of type 'EffectCallback'.
Authored by: Andréas HANSS
Aurelia
Aurelia Goes Full-time
Last week we hit a major milestone in Aurelia's history: one of our core team members, Fred Kleuver, was funded to work full-time on Aurelia. Thanks to the generous financial contributions of many companies , we've raised enough money and have enough ongoing contributions to fund Fred Kleuver to work full-time on Aurelia for at least the next 6 months.
Authored by: Aurelia
Vue
How to make an image uploading app with Vue, Quasar, Firebase Storage and Cordova - Part 2
We'll build a cross-platform mobile app for taking photos and uploading to firebase. In Part 1, we saw how to take a picture and save it to Firebase Cloud Storage. In this post we'll move the uploading to a separate thread via web worker, and use the blueimp library to generate a thumbnail locally and show it while uploading.
Authored by: JavaScript in Plain English
Vue.js Composition API Guide - With Example
I've been learning and playing around with the Composition API that is going to be released with Vue 3. It's awesome, check out this tutorial on it.
Authored by: Erik Hanchett
Node.js
Impress your colleagues with these NPM tricks
Just like anyone else, developers enjoy knowing some little tricks to show to their colleagues or friends. Today, I have decided to write about some of these keyboard magic that you can use when working with the Node Package Manager ( NPM).
Authored by: Piero Borrelli
Build Command-Line Spinners in Node.js
Practice your Node.js-terminal skills by building your own CLI spinners In my last post, we saw how to implement a progress bar in the terminal using Nodejs. Here, we will continue with the CLI streak and implement spinners in the terminal using Nodejs.
Authored by: Bit
High-performance Node.js concurrency with native "events" package
Naturally, JavaScript considered as a single-threaded programming language with Event Loop implementation as the main driving engine. However, it's not fully like that for Node.js, because they actually implemented Thread Pooling API based on libuv the library, which is a core library for Node.js to access other OS API like networking, file system, etc...
Authored by: Tigran Bayburtsyan
Libraries and Tools
How to Implement Redux in 24 Lines of JavaScript
90% convention, 10% library. Redux is among the most important JavaScript libraries ever created. Inspired by prior art like Flux and Elm, Redux put JavaScript functional programming on the map by introducing a scalable architecture of three simple points. If you're new to Redux, consider reading the official docs first.
Authored by: Yazeed Bzadough
Wrapping CommonJS library in Angular 8 directive on the example of mark.js
And enhancing its functionality with custom logic. Time to time on my daily tasks I have to implement some functionality that was already implemented by someone previously in a neat vanillaJS library, but... no Angular version or even ES6 module of it is available to be able to easily grab it into your Angular 8 application.
Authored by: Angular In Depth
Functional Programming
10 JavaScript Utility Functions Made with Reduce
The multi-tool strikes again.
Authored by: Yazeed Bzadough
Learn Reduce in 10 Minutes
Hopefully this reduces the confusion. In my experience learning and teaching JavaScript, reduce is one of the toughest concepts to crack. In this article I'll try to address one core question... What is reduce and why is it called that? Some of them, according to Wikipedia, are They all hint at the core idea.
Authored by: Yazeed Bzadough
Functional Programming in JavaScript: Introduction and Practical Examples
From pure functions and combinators to compose and containers Functional programming (FP) is a style of coding that's been growing in popularity. There's a lot of content out there which explains what functional programming is, but there's much less about how to apply it.
Authored by: Bret Cameron
Other
Firefox's New WebSocket Inspector - Mozilla Hacks - the Web developer blog
The Firefox DevTools team and our contributors were hard at work over the summer, getting Firefox 70 jam-packed with improvements. We are especially excited about our new WebSocket inspection feature, because you told us in feedback how important it would be for your daily work.
Authored by: Mozilla Hacks
Using Windows 10 and WSL for frontend web development
I've been an exclusively Mac developer ever since I bought a second hand MacBook (remember the all white, plastic ones?). I absolutely loved it and as I got more into software development and discovered the terminal it became hard for me to see how I could go back to Windows.
Authored by: Jack Franklin