![[ERR!]](https://pbs.twimg.com/profile_images/828593972029317120/4UXq5Hmj_normal.jpg)
This weeks' stories definitely have a "how to" theme running through, so if you're in a "how to" mood then check out some of the more popular stories, like "How to Fill an Array with Initial Values in JavaScript", "How to Use Currying and Composition in JavaScript", "How to Create Custom Headers with Express and TypeScript" and "How to create a React Radio Button".
General
Using Refine to Build an Admin Panel
refine is a React-based framework for building data-intensive applications in no time ✨ It ships with Ant Design System, an enterprise-level UI toolkit. Refine offers lots of out-of-the-box...
Authored by: Bit
Introducing a URL-Friendly Unique Identifier - NanoID
In every software system, we need unique Ids to distinguish between several objects from one another. Recently, I wrote about the unique Id generation for a large-scale distributed environment. In that article, we touched a little on UUIDs.
Authored by: Apoorv Tyagi
Explore How Diffusion Now Supports MQTT
Support for the OASIS MQTT open standard protocol is the main feature added to Diffusion 6.6 Preview 2, the latest release of the Diffusion® Intelligent Event Data Platform. MQTT is a publish-subscribe messaging protocol commonly used to connect Internet of Things (IoT) applications.
Authored by: push_technology
Is Deno Still a Thing? A Look at the Status of the Node Killer
First time I read about it, and I'm assuming that's on purpose because it's still in its early beta stage, however their plan for it is very interesting. That being said, they ought to change its name to Deno Cloud if you ask me.
Authored by: Bit
Understand Static Site Generation with Next.js
We all love Next.js for the ability of server-side rendering. But we often fail to take advantage of the awesomeness of the static generation. If designed properly, we can pre-generate almost every page of a website, and thus, our website acts as a static website. Fast and SEO-friendly.
Authored by: Mohammad Faisal
How to Build a Desktop Video-Calling App using the Agora Electron SDK
As a JavaScript developer, you can truly use one language to build apps for almost any platform, and the Electron framework enables you to build cross-platform desktop apps. In this tutorial, we'll walk through building a video-calling desktop app using the Agora Electron SDK for macOS and Windows.
Authored by: Ekaansh Arora
JavaScript
Do You Really Need a JavaScript Framework?
If you left me a note, please re-send it! I'm interested :) Frameworks like Vue.js, Svelte and React (yes, I know it's a library) have been storming the JavaScript world. Libraries like jQuery are being considered obsolete, and methods like Document.getElementById() aren't being used much anymore. Has JavaScript moved into a new generation?
Authored by: JavaScript In Plain English
5 Methods to Reduce JavaScript Bundle Size
Today, we use JavaScript heavily in web development, and we can find many applications with large bundle sizes. However, beyond a certain limit, it starts to affect the application performance. In...
Authored by: Bit
Micro Optimizing Your JavaScript Probably Isn't Worth It, But...
If you're looking to optimize a function which is often called in your application, you'd probably want to make some measurements, set benchmarks, and go from there.
Authored by: Siniša Nimčević ⌨️ ✍️ 🥋 🔄
JavaScript Currying: A Practical Example
In mathematics and computer science, currying is the technique of converting a function that takes multiple arguments into a sequence of functions, each of which takes a single argument. The below add function takes three arguments and returns them summed. What if the three arguments do not exist in the same scope?
Authored by: Karthick Ragavendran
How to Fill an Array with Initial Values in JavaScript
JavaScript provides many ways to initialize arrays with initial data. Let's see in this post which ways are the most simple and popular. Let's say that you'd like to initialize an array of length 3 with zeros.
Authored by: Dmitri Pavlutin
How to Use Currying and Composition in JavaScript
A great conversation I had this evening got me thinking about and revisiting a concept I've toyed with before - currying. But this time, I'd like to explore it with you all! The concept of currying is not a new one, but it is very useful.
Authored by: freeCodeCamp.org
TypeScript
Learn TypeScript in 5 minutes | Swizec Teller
TypeScript solves many of JavaScript's sharpest edges. You don't need much to get started ✌️
Authored by: Swizec
Covariance and Contravariance in TypeScript
Learning covariance and contravariance in TypeScript could be tricky (I know from my experience!), but knowing them is a great addition to your types understanding. In this post, I'll read an accessible explanation of covariance and contravariance concepts. Thanks to inheritance, in TypeScript a base type can be extended by another type named subtype.
Authored by: Dmitri Pavlutin
How to Create Custom Headers with Express and TypeScript
Recently, I had to create a cloud function that will store some data in a PostgreSQL database. Once I had done everything, or at least I had finished with the minimal functionality, I had to add some kind of basic authentication for my endpoint.
Authored by: JavaScript In Plain English
TypeScript Generics: What's with the Angle Brackets ?
A good reusable component has a prestigious place in software engineering. Good abstractions are hard to come up with. They are even harder to keep alive by satisfying the ever arising edge cases. But well-testing design patterns are here to help. Generics is one of them.
Authored by: Karthick Ragavendran
Angular
Introducing Syncfusion Angular Code Snippets for Visual Studio Code
We are glad to introduce Angular Snippets, a utility for adding Syncfusion Angular components in the HTML file of an Angular application. This utility is available in our 2021 Volume 3 release. This code snippet utility saves significant time for developers in adding Syncfusion Angular components to their projects.
Authored by: Syncfusion
React
Svelte vs React: Ending the Debate
Are you on the fence in the Svelte vs React debate? You're not the only one. Nowadays, picking the best tool is a challenge, especially with all the conflicting voices screaming on the internet. We're constantly attacked by headlines such as: React is dead. Svelte was dead before its development.
Authored by: JavaScript In Plain English
How to create a React Radio Button
A short React tutorial by example for beginners about using a radio button in React. First of all, a radio button is just an HTML input field with the type of radio which can be rendered in React's JSX: What may be missing is an associated label to signal the user what value is changed with this radio button: In your browser, this radio button can already change its checked state.
Authored by: Robin Wieruch
Event Bubbling in React - Upmostly
Event bubbling in React refers to when the innermost component handles an event, and events bubble outwards. In React, the innermost element will first be able to handle the event, and then surrounding elements will then be able to handle it themselves. In this article, we'll go over how to best use event bubbling in [...]
Authored by: Upmostly
Save Many Documents on MongoDB, Skipping Duplications, with React and Apollo Client
Upload multiple documents from a React Application to MongoDB on a single action, using Apollo Client . Each document is a row from an .xlsx file that we parse and manipulate. This process is irrelevant with this article. Reject existing (based on a unique id) documents BUT store the new ones .
Authored by: JavaScript In Plain English
Build a Composable Sorting Control with Custom React Hooks
Most web applications need to display data in lists of one kind or another, and sorting that data is one of the fundamental features of a user-friendly list. Using React Hooks, we can easily separate...
Authored by: JavaScript In Plain English
Calling a React Component on Button Click - Upmostly
What if our web application contains a list element, and we'd like to add new items to the list as we click a button? React has a perfect answer. In this tutorial, we'll learn how to create a component and display it to the screen on a button click.
Authored by: Upmostly
Build a Video Recording & Playback App in React Native Expo (Android & IOS)
Hello, native developers! When you start learning React Native, then you go through different lectures, tutorials, and articles to build different projects and learn stuff. A recording app is one such application. For a recording app, you must know how the camera app functions, how you can manage video quality, bitrate, duration, and much more.
Authored by: Rohit Thakur
Why Doesn't My React Code Look Professional?
Aside from years of practice, reading Clean Code, and then reading Clean Code for Javascript, you can automate a lot of your "troubles" away, at least regarding the overall "cleanliness" of your code. How to write clean-looking code is something you pick up eventually, it comes with a mix of experience and knowledge and it probably doesn't fit into a brief article.
Authored by: Siniša Nimčević ⌨️ ✍️ 🥋 🔄
Vue
Composable CSS Animation In Vue With AnimXYZ
Most animation libraries like GSAP and Framer Motion are built purely with JavaScript or TypeScript, unlike AnimXYZ, which is labelled "the first composable CSS animation toolkit", built mainly with SCSS While a simple library, it can be used to achieve a lot of awesome animation on the web in a short amount of time and little code.
Authored by: Smashing Magazine
Node.js
Nats.io with Node.js (Rabbitmq, Kafalternative)
npm install nats@latest The [email protected] is not API compatible with previous versions of nats.js. For a migration guide, please see the migration guide. To connect to a server you use the connect() function. It returns a connection that you can use to interact with the server.
Authored by: Sn. Dev. M A
Libraries and Tools
5 Top Audio Processing Libraries for JavaScript
Quickly Design Live Streaming, Online Conferencing, and Digital Audio Composer Web Applications with JavaScript
Authored by: Bit
Testing
Cypress And TestRail
How to send the Cypress test results to TestRail using cypress-testrail-simple plugin If your organization is using TestRail to manage test cases and collect all test results in one place, you might need to upload the Cypress test results too.
Authored by: Gleb Bahmutov
Refactor Tests To Be Independent And Fast Using Cypress-Each Plugin
I have made cypress-each to simplify generating tests from data. This plugin has already proved itself useful for API testing, and in this post I want to show a few more tricks it can help you do, lik
Authored by: Gleb Bahmutov
