JavaScript is a great and fun programming language. It's very important to find a way to learn new things about language itself as well as general programming concepts. This week we are very lucky since we have many great articles that will help us with this task.
We highly recommend a great article "Understanding Memoization in JavaScript to Improve Performance" by Chidume Nnamdi. You will learn what memoization is and how you can use it to improve application performance.
A bit more JavaScript specific topic is covered in the excellent article "Understanding Javascript Mutation and Pure Functions" by Chidume Nnamdi. You shouldn't miss this one.
One more article that's a must read this week is "Transducers: Efficient Data Processing Pipelines in JavaScript" by Eric Elliott. As a part of the series on learning functional JavaScript programming, you have great opportunity to learn some great programming techniques.
Developers interested in redux will surely enjoy "An Unforgettable Way to Learn Redux — The Visual Guide" by Ohans Emmanuel.
Finally, Vue.js developers would want to check out "Build a Vue App with Firebase Authentication and Database" by Rajat S.
General
Understanding Memoization in JavaScript to Improve Performance
How to improve your application performance through better Javascript memoization Cranking up the performance rate of our apps is what we crave. Memoization is one of the techniques in JavaScript to speed up the lookup of expensive operations by caching the results and re-using the cache in the next operation.
Authored by: Chidume Nnamdi
Tech Stack 2019: Frontend Global State
Adding frontend global state to the core of a technology stack for 2019. This is one of a number of articles that add incremental functionality to the frontend and backend applications developed in the article Tech Stack 2019: Core . The final result of this article is available from the frontend-global-state branch of the tech-stack-2019-frontend (frontend-global-state ) repository.
Authored by: codeburst.io
How to remove duplicate elements from array javascript
In the above code, on each iteration, we check if an element is not present in the finalarray then we are pushing that element to the finalarray. On each iteration, we are using the Array.indexOf...
Authored by: Sai gowtham
Design Patterns in Web Development - #2 Memento
As some of you may remember, in the pilot episode I said I was about to explain with three examples: a UI kit, a CQRS application and an undo/redo implementation in Electron. In the Command episode though I didn't provide the latter and the reason is extremely simple: I am a jerk.
Authored by: Manuel Spagnolo
Using recursion to traverse data structures. Execution context and the call stack
Hello! Today we tackle a very interesting topic, which is recursion. The article describes its main principles and dives deeper to uncover how does it work under the hood of the language, covering execution context and the call stack. Let's go! JavaScript recursion Recursion An act of a function calling itself.
Authored by: Marcin Wanago
JavaScript
Understanding Javascript Mutation and Pure Functions
Boost your app performance by better understanding Mutation and Pure Functions in JS Immutability, Pure Functions, Side Effects, State Mutation are words we come across almost every day, but little do we know how they work or what they are or what goodies they bring to software development.
Authored by: Chidume Nnamdi
Tree Data structure in Javascript
In this tutorial, we are going to learn Binary search trees and its implementation in javascript. A tree is nonlinear data structure compared to stacks and queues, linked lists and arrays which are the linear data structure. Root: The top node in a tree.
Authored by: Sai gowtham
Map, Filter, Reduce vs For Loops (syntax)
The intention of this post is not to say one paradigm is better than the other. It is just to show common imperative patterns you run into and their functional equivalents. Sometimes things are easier to learn if you can relate it to something you are already familiar with and be given a map on how to transition back and forth.
Authored by: joelnet
TypeScript
Essential TypeScript Types | Get Started with TypeScript
TypeScript provides the ability to add typed variables to your JavaScript code. This article will cover the core types that are essential for any TypeScript developer and provide a starting point to begin using the language. To begin using TypeScript, you must have the compiler installed which can be done through npm.
Authored by: Trey Huffine
Angular
Angular Validators With Conditional Validation In Reactive Forms
Form is an essential part of building a robust and scalable Angular application. Validating your application form before reaching out to the server enhances security and performance.
Authored by: Codementor
Restoring And Resetting The Scroll Position Using The NavigationStart Event In Angular 7.0.4
Ben Nadel revisits his scroll storage and restoration polyfill in Angular 7.0.4 now that Angular 6 has added the ability for the Router to differentiate between imperative navigation and popstate navigation using the NavigationStart event.
Authored by: Ben Nadel
How to Protect Angular Code Against Theft and Reverse-Engineering
Angular is one of the most popular JavaScript frameworks. Since the Angular 2 release in 2016, Google has released yet 5 new major versions in just 2 years. This TypeScript-based framework enables developing front-end applications with ease for web and mobile.
Authored by: Jscrambler
React
An Unforgettable way to Learn Redux - This Visual Guide
The following is a visual guide to learning Redux. One focused on the core Redux principles explained with memorable associations and custom illustrations. Ready? Here we go! Consider an event you're likely conversant with - going to the bank to withdraw cash. Even if you don't do this often, you're likely aware of what the process looks like.
Authored by: JavaScript Kicks
What's new in Create React App 2
Create React App 2 adds more options to ease the creation and configuration of React applications. Personally, the three new features I find most helpful are TypeScript, Saas and Babel macros.
Authored by: LogRocket
GraphQL API with AWS and Use with React
GraphQL has become a go-to API implementation for developers looking to take advantage of features liketype safety, network efficiency, real-time data with subscriptions & more.
Authored by: Scotch Development
Higher Order Components in 3 minutes
A pattern for when we find ourselves repeating logic across components. They are not part of the React API. They are functions that take components and return new components! When you find that you are repeating patterns/logic across components. Examples; hooking into/subscribing to a data source adding interactivity to UI (also achieved with wrapper/render props) modifying/adjusting input data (sorting, filtering etc.)
Authored by: codeburst.io
React Firebase Authorization with Roles
A tutorial on how to use authorization with roles and permissions when using Firebase in React. You will learn how to protect your routes and pages with authorization rules ...
Authored by: Robin Wieruch
Vue
Build a Vue App with Firebase Authentication and Database
Comics Let's start with the component that users will get to see once they are successfully authenticated. I have named this file as Comics.vue and placed it inside the components folder. The .vue file is divided into three parts: the template, script, and style.
Authored by: Rajat S ⌨️
Vue for jQuery Developers
In this post you'll learn the fundamental components of Vue.js for developers already familiar with jQuery. Get started faster with this introduction to Vue. Vue.js, a framework for building web applications, has a reactivity system that allows you to model and manage your application state such that when data changes, it's reflected in the UI, without you having to query the DOM.
Authored by: Peter Mbanugo
Swipeable card stack using Vue.js and interact.js
I recently had an opportunity to work on a fantastic research and development project at Netguru. The goal of project (codename: "Wordguru") was to create a card game that anyone can play with their friends. You can see the outcome here. One element of the development process was to create an interactive card stack.
Authored by: CSS-Tricks
MEVN Stack Tutorial With Example From Scratch
MEVN Stack Tutorial With Example From Scratch is the topic, we will discuss today. We will generate FullStack Single Page Application(SPA) using MongoDB, Express, Vue, and Node.js CRUD Example Tutorial with step by step. For this example, we will not use Vuex for state management because this app will be simple and not complicated.
Authored by: KrunalDLathiya
Node.js
Building a Stable Node JS Project Architecture: Best Practices
Often product development process which involves JavaScript, is accompanied by the use of Node JS, a JavaScript runtime environment. The birth of this technology has certainly turned the use of JS upside-down. Today, JavaScript is in the category of the most preferred languages to build apps thanks to Node JS.
Authored by: JavaScript Kicks
Simple, but not too simple: how using Zeit's `micro` improves your Node applications
Leave the Express comfort zone to expand how you think about Node application architecture. tl;dr using a function composition model for building HTTP servers
Authored by: Hugo Di Francesco
Libraries and Tools
The Power of Redux and React.lazy
This article proposes a solution for dynamically changing Redux containers on the fly to reuse, not only of the UI components, but the data-layer too by switching the mapped action-creators on runtime
Authored by: Rubens Pinheiro
10 Javascript Compression Tools and Libraries for 2019
Top Javascript code compression and minifying tools and libraries for 2019. Try Closure compiler, Packer, Uglify, YUI Compressor, Terser, Minify, JS Minifier, Node-Minify, Ajaxmin, Producify, Snappy.
Authored by: Viclotana™
jQuery setTimeout() Function Examples
James Hibbard explains how the jQuery and JavaScript function setTimeout() works, and gives examples and links to further reading.
Authored by: James Hibbard
Testing
Real world testing recipes: Node service that calls an external API
This is the next post in my series on knowing what to test in your Node applications by applying recipes to real-world scenarios. In the first one, we went over scenarios you should cover in your tests when calling a database from a Node service.
Authored by: Corey Cleary
Functional Programming
Transducers: Efficient Data Processing Pipelines in JavaScript
Note: This is part of the "Composing Software" series on learning functional programming and compositional software techniques in JavaScript ES6+ from the ground up. Stay tuned. There's a lot more of this to come!
Authored by: Eric Elliott
Functional Programming Principles in Javascript
After a long time learning and working with object-oriented programming, I took a step back to think about system complexity. "Complexity is anything that makes software hard to understand or to modify." - John Outerhout Doing some research, I found functional programming concepts like immutability and pure function.
Authored by: TK
Other
Quick Tip: Get URL Parameters with JavaScript
So you want to get a parameter from a URL? URL parameters (also called query string parameters or URL variables) can have lots of useful data including product info, user preferences, link referrals, and more. Let's get started!
Authored by: SitePoint
NodeJS vs Django - Is JavaScript better than Python?
Node JS ( 55 432 ★) and Django ( 37 614 ★) are two powerful tools for building web applications. Node JS has a "JavaScript everywhere" motive to ensure JavaScript is used on the server side and client side of web applications and Django has a "framework for perfectionists with deadlines" motive to help developers build applications in quick time.
Authored by: Shaleynikov
Build a Login/Auth App with MERN Stack- Part 1
i. Initializing our project Set the current directory to wherever you want your project to live and initialize the project using npm. ➜ ~ mkdir mern-auth➜ ~ cd mern-auth➜ mern-auth npm init After running the command, a utility will walk you through creating a package.json file.
Authored by: Bit
5️ Techniques to Lazy-Load Website Content for Better 📈 SEO & User Experience
Developers love large JavaScript frameworks and libraries to build websites, but are they good for SEO and Customer engagement? Google says no. Learn why and what you need to know about JavaScript, SPAs & SEO.
Authored by: Chris Love
How to make any website faster
Web performance is such a big deal. In fact, the performance of your site can be the difference between remaining in business or losing money. So, how do you build web applications that remain consistently fast? There's an answer for that! In this article, I'll offer tips you can use right away to make any website faster.
Authored by: Ohans Emmanuel