![[ERR!]](https://pbs.twimg.com/profile_images/828593972029317120/4UXq5Hmj_normal.jpg)
It was a big week for React developers, nabbing the focus of nearly a third of the stories crossing our desks. Kicking off the week, Jonathan Saring helps alleviate stress levels with useful frameworks, libraries and tools for testing your React components and applications - not your patience in "11 React Testing Tools and Libraries for 2019" and Krissanawat Kaewsanmuang teaches us how to build a reusable and shareable Firebase Google login component in "Building a Reusable React Login Component" while Bhargav Bachina shows us the art of exporting in "Exporting Data to Excel with React", all on the Bits and Pieces blog. Gitconnected get busy with Google Maps Custom Markers and Tree Graphs in "Google Maps and React With a Custom Marker" and "React Tree Graph", respectively, and both Code Daily and Andrew James take on Modals from different angles in "Create a Modal Route with React Router" and "Build a modal using React context, portals, and hooks."
Heard of Deno yet? Learn what Deno is and how it aims to fix the deficiencies in Node with Maciej Cieslar on LogRocket's blog in "What's Deno, and how is it different from Node.js?" Sticking with Node.js, Diogo Souza explores how far the journey of supporting ES modules has come in the world of Node.js in "How to use ECMAScript modules with Node.js Blog" and Paige Niedringhaus takes us through why she thinks Node.js has been a game-changing technology since its initial release back in 2009 in "Node.js 12: The future of server-side JavaScript Blog". Last of the highlights, but certainly not least, NodeSource highlights how Worker Threads in Node.js function and how they can be used in "Understanding Worker Threads in Node.js"
General
How to Achieve Discoverability for Shared Components
Useful ways to make your components discoverable to maximize sharing and reusing by different teams and projects. Components bring modularity to the design of our applications. Modularity, in turn, brings reusability which aids in building better software applications without having to reinvent the wheel every time.
Authored by: Bit
Intro to Stackbit: Build a Custom JAMstack Site in Minutes
In a hurry? Skip to our live theme demo or our GitHub repo Ever take a long flight with children? It's horrendous-especially if they're your own. My wife and I have two (both under 3), so when we go somewhere we try to make the process as painless as possible.
Authored by: Snipcart
3 ways to use ES6 proxies to enhance your objects Blog
One of the aspects of programming I love the most is meta-programming, which references the ability to change the basic building blocks of a language, using that language itself to make the changes. Developers use this technique to enhance the language or even, in some cases, to create new custom languages known as Domain Specific Language (or DSL for short).
Authored by: LogRocket
JavaScript
Spread and Destructuring: A How-To Guide for JavaScripters
Get a better understanding of JS spread and destructuring Most common web-related programming languages have all the basic operators, and by the time they reach a job opportunity, every developer knows how to use them. But there are some operators that aren't that common and not every language has them or if they do, they might not share the same syntax.
Authored by: Bit
TypeScript
Testing static types in TypeScript
In this blog post, we'll examine how we can test static types in TypeScript (inferred types, etc.). For example, given the following function:
Authored by: Axel Rauschmayer
Angular
Network-aware Preloading Strategy for Angular Lazy Loading
This post explains how to make network-aware preloading strategy for lazy loading of Angular Router. It can improve user experience with lazy loading despite users network condition. Preloading is an important feature of Angular Router's lazy loading. This is available since 2.1.0.
Authored by: lacolaco / Suguru Inatomi
Improving State Slicing Performance
Learn how to optimize Redux state slicing in your Angular app Redux is the main state management pattern still used today. It puts our data in a global store and let components access it from anywhere in our app, they can modify and read from it at will.
Authored by: Bit
React
Exporting Data to Excel with React - Bits and Pieces
Learn how to export data from your React app to excel using XLSX and FileSaver We often export data from tables to excel sheets in web applications. There are two ways to implement the export functionality in React: one is by using any third party library, and the other is by creating your component.
Authored by: Bit
Advanced Unit and Snapshot Testing with React Native
Firstly let's deal with some configuration. Here is the package.json file: One feature of Jest I find really cool is the coverageThreshold object, it allows a high level of reconfigurability with regards to enforcing code coverage. For instance, we set a higher threshold for critical components, in particular ones that are more difficult to debug, such as our Redux related code.
Authored by: gitconnected
How to use OneSignal with a React Native Chat App
In this tutorial, we are going to learn how to integrate OneSignal push notification to React Native Chat app project. For this tutorial, we are only going to implement it in the Android platform using an android device. OneSignal is a popular service that enables push notifications on a device, abstracting details such as the platform the device is running on.
Authored by: TheBestDevlist
React Tree Graph
React Tree graph is a component which renders data as a tree using SVG Installing React Tree Graph Component Customizing Tree Graph Tree Graph Click Events Custom Path props Tree view animation Let's begin by creating a React app using the below command create-react-app tree-viewcd tree-viewnpm start If you would like to use TypeScript for your React application, then use the below command create-react-app tree-view --typescriptcd tree-viewnpm start Now we will install the react-tree-graph component using the below command npm install react-tree-graph --save If you are using TypeScript, then you need to add the types for the component.
Authored by: gitconnected
Create a Modal Route with React Router
Often times there is a route that is better served as a modal. You want to be able to link to it and still render the page behind it. With React Router this can be accomplished. We'll dive into rendering a route with a route that renders as a modal.
Authored by: Code Daily
Build a modal using React context, portals, and hooks
This article will demonstrate how to construct and render a modal component that can be accessed from anywhere within your React application and populated with dynamic content. Before attempting a bespoke solution I would advise exploring any pre-existing modules that can provide you with a viable solution (e.g.
Authored by: Andrew James
Building a Reusable React Login Component
Learn how to build a reusable and shareable Firebase Google login component In this chapter, we will continue from where we left off in the first chapter that dealt with implementing a Facebook login and initiating a react app structure. We are going to add Google login to the same app we created in the first chapter.
Authored by: Bit
Google Maps and React With a Custom Marker
Google Map React is a component wrapping a set of the Google Maps API functionality. It allows you to render any React component on the Google Map.
Authored by: gitconnected
How to convert your existing Redux containers to Hooks Blog
As React picked up the pace in the frontend engineering arena, new patterns emerged to help make our applications more scalable and maintainable. With the introduction of global state management tools like Redux and MobX, some of these patterns extended their influence across the industry.
Authored by: LogRocket
Vue
New Features in Vuex 3
As JavaScript has grown to have a suite of libraries and frameworks built off it, these frameworks, too, have grown to birth their own libraries and dependencies. The community is very stratified and...
Authored by: Bit
Node.js
How to use ECMAScript modules with Node.js Blog
We explore how far the journey of supporting ES modules has come in the world of Node.js, using the experimental modules flag and the esm library.
Authored by: LogRocket
How to Generate Dynamic PDFs Using React and NodeJS
Introduction In this article, you will learn how to generate dynamic PDFs using HTML code as a template. For this particular example, we are going to create a simple receipt that will have dynamic data coming from React's state object. Generate PDFs using JavaTable of Contents 1.
Authored by: freeCodeCamp.org
Understanding Worker Threads in Node.js
This blog post highlights how Worker Threads in Node.js function and how they can be used, and provides several working code examples. Worker Threads have been available since the release of Node.js 10, but are currently still an experimental feature.
Authored by: NodeSource
Node.js 12: The future of server-side JavaScript Blog
Node.js has been a game-changing technology since its initial release back in 2009. In a nutshell, it lets developers use JavaScript to run scripts on the server side producing dynamic web content before the page is sent to the user's web browser.
Authored by: LogRocket
Choosing the right Node.js Framework: Next, Nuxt, or Nest?
An examination of the performance differences between three very popular server-side rendering frameworks.
Authored by: NodeSource
What's Deno, and how is it different from Node.js?
Node.js is a great server-side JavaScript runtime, but it has inherent issues. Learn what Deno is and how it aims to fix the deficiencies in Node.
Authored by: LogRocket
Libraries and Tools
Decreasing Webpack bundle size with conditional imports
There are several tools used for bundling JavaScript modules or assets. Most bundlers have tree shaking system which clears up unused modules before compiling the whole code and decreases bundle size accordingly. That is, it removes any code that isn't actually used by your app.
Authored by: gitconnected
Docker Swarm vs Kubernetes: A Helpful Guide for Picking One
Docker and Kubernetes have taken the software world by storm. DevOps, containers, and container management are at the center of most conversations about what's relevant to technology. Tooling and services that ease running software in containers, therefore, occupy the minds of developers. Great tools and platforms create options and possibilities.
Authored by: Stackify
11 React Testing Tools and Libraries for 2019 - Bits and Pieces
React testing frameworks, libraries and utils for testing React applications and components. Discover Jest, Karma, Enzyme, React-testing library, Mocha, Chai, Cypress and more. How to test React apps
Authored by: Bit
Functional Programming
Caching Function Outcomes With CachedWithin Caches Both The Return Value And The Output Buffer In Lucee 5.3.2.77
Ben Nadel takes a quick look at the Function memoization feature of Lucee 5.3.2.77; and, demonstrates that the cachedWithin directive will cache both the return value of the Function as well as any changes made to the output buffer during the Function execution.
Authored by: Ben Nadel
Other
The complete best practices for minifying CSS Blog
CSS is what makes the web look and feel the way it does: the beautiful layouts, fluidity of responsive designs, colors that stimulate our senses, fonts that help us read text expressed in creative ways, images, UI elements, and other content displayed in a myriad of shapes and sizes.
Authored by: LogRocket
Docker Build: A Beginner's Guide to Building Docker Images
Docker has changed the way we build, package, and deploy applications. But this concept of packaging apps in containers isn't new-it was in existence long before Docker. Docker just made container technology easy for people to use. This is why Docker is a must-have in most development workflows today.
Authored by: Stackify
