![[ERR!]](https://pbs.twimg.com/profile_images/828593972029317120/4UXq5Hmj_normal.jpg)
Making your web applications work well and look good at the same time is not easy. Check a list of "11 Javascript Data Visualization Libraries for 2018" by Jonathan Saring to make your life easier.
This week we also have a lot of great vanilla JavaScript articles. Two that stand out are "Learning JavaScript: Call By Sharing, Parameter Passing" by Chidume Nnamdi and Understanding JavaScript’s Prototypal Inheritance by Rajat S.
React developers will certainly enjoy learning about "How To Implement Better Drag and Drop in your React App" in one more article by Rajat S.
General
Three Steps For Increasing The Security of Your Web Apps
I recently shared the following QR code with my work's Slack group: Pro tip: never just scan a random QR code without checking it with a service like this first This QR code isn't malicious, it simply links to the site for my new podcast (https://dotnetcore.show/ ), and I'm happy to say that everyone at work passed.
Authored by: Jamie
5 Tips to Write Better Conditionals in JavaScript
When working with JavaScript, we deal a lot with conditionals, here are the 5 tips for you to write better / cleaner conditionals. Let's take a look at the example below: At first glance, the above example looks good. However, what if we get more red fruits, say cherry and cranberries?
Authored by: Jecelyn Yeen
'Parallelizing' JavaScript for fun and Profit.
Parallel programming in JavaScript is not as straightforward as it is in languages such as C/C++ and Java or even Python due to its event based paradigm. In this post I will focussing on parallel computation in JavaScript through Web Workers API.
Authored by: Codementor
Does JS really do that?!
Getting acquainted with some of the curve balls javascript is capable of throwing at you. After going through the amazing book series called You-Dont-Know-JS, I was baffled at how much weirdness javascript was capable of. Gradually though, I started seeing a method to the madness.
Authored by: codeburst.io
Limit concurrent asynchronous calls
Although Javascript is designed to be single threaded, you could still do things concurrently. For example, we can read multiple files concurrently. However, reading files could be quite computationally expensive; if there are more than 10k paths, you will probably hear the fans on your machine speed up as your machine struggles.
Authored by: Jason Yu
JavaScript
Master JavaScript: Call By Sharing, Parameter Passing
Code Area: This is the area the JS code to be executed is stored. Call Stack: This area keeps track of currently executing functions, perform computation and store local variables. The variables are stored in the stack in a LIFO method. The last one in is the first out.
Authored by: Chidume Nnamdi
Understanding JavaScript's Prototypal Inheritance
Inheritance is the process by which one object can be based on another. This lets the objects to share each other's properties. I have created the Hero prototype and used it to create a new object named superman. But we are not doing anything with this object.
Authored by: Rajat S ⌨️
10 JavaScript string methods you should know
In this post I will summarize 10 javascript string methods you should at least known according to me. If interested read here 10 javascript array methods you should know . String is anything inside single or double quotes. Here are 10 javascript string methods you should know. 1.
Authored by: Codementor
Intro to Linked Lists in JS
"A linked list is an ordered collection of data. The collection contains a number of different nodes. Each node contains some amount of data along with a reference to the next node. When we put a handful of these nodes together we refer to it as a linked list as it literally is a list of nodes linked together.
Authored by: Ryan Farney
Three dots ( ... ) in JavaScript
Hey! I'm Sagar. I love to write tutorials and articles to help developers better understand the magic of JavaScript. If you have any questions about the article, leave a comment and I'll get back to you, or find me on twitter @sagar_dev44.
Authored by: Sagar
Angular
Displaying Places on a HERE Map in an Angular Web Application
If you've been following along, I had previously written a tutorial that demonstrated including a visual map in your Angular web application using the HERE Maps API for JavaScript. In that tutorial we saw several methods towards using a map, leading up to creating a custom component for the job.
Authored by: HERE Developers at Disrupt 🌉
Angular Datepicker Example Tutorial
Angular Datepicker Example Tutorial is today's leading topic. The Datepicker allows us to enter a date either through the text input or by choosing the date from a calendar. It is made up of various components and directives that work together. Angular Material is ground running with large, modern UI components that work across the web, mobile, and desktop.
Authored by: KrunalDLathiya
React
Implement Better Drag and Drop in your React App
With the react-beautiful-dnd package. Learn more. The phrase drag-and-drop is used to describe the action of selecting an object, dragging it to wherever you desire, and then letting go or dropping it at that place on your screen. We use drag-and-drop everyday on our device. We use it to select text in our documents.
Authored by: Rajat S ⌨️
Async Rendering in React with Suspense
Why Suspense? There's a good chance you've come across SPAs that make use of a loading icon as an indicator that data is being fetched. This is a common method used to ensure good UX for apps that are fetching data from external sources.
Authored by: YE
Control Your Frontend Data Before It Controls You: When To Implement Redux in Your React App
React is great at rendering out components and boosting performance, but it lacks any formal pattern around state and data retrieval. Redux can help address some of the issues that arise as your web application grows in size. So, you've started a new project and built some React components.
Authored by: Telerik
React Image Upload (with Kittens!)
At the coding bootcamp where I teach, "How do I upload images with React?" is a question that comes up repeatedly. As with any programming problem there are a million ways to achieve this outcome with various tradeoffs. Below is a way that I feel accounts for as many possible scenarios you might encounter while maintaining a streamlined codebase.
Authored by: codeburst.io
An imperative guide to setState in React
States in React, like props, are objects that are used to store data and affect how the component renders or behaves. Unlike props, states are managed completely within the component and can be changed over time. The change in state for React components can be a result of triggers from user actions, network activity, API requests or specific application behavior.
Authored by: Nosakhare Obaseki
Immutability in React and Redux: The Complete Guide
Immutability can be a confusing topic, and it pops up all over the place in React, Redux, and JavaScript in general. You might've run into bugs where your React components don't re-render, even though you know you've changed the props, and someone said, "You should be doing immutable state updates."
Authored by: Dave Ceddia
Vue
Can A Vue Template Have Multiple Root Nodes (Fragments)?
If you try to create a Vue template without a root node, such as this: You'll get a compilation and/or runtime error, as templates must have a single root element. Typically, you'll fix this problem by adding a "wrapper" div as a parent.
Authored by: Anthony Gore
Building a Desktop App with Vue: Electron
In my previous article I was building a desktop application with Vue using Vuido and native GUI components. Now it's time to try Electron!
Authored by: Natalia Tepluhina
Create a Custom Vue.js Plugin in < 1 Hour [Code Included]
We're very excited to sponsor **VueConf TO 2018** https://vuetoronto.com Come hang out and learn some Vue.js with world-class developers (Nov. 15-16). In a rush? Skip to tutorial or live demo. It's no secret that we <3 Vue.js. So much so that it's a key part of our own product's rewriting.
Authored by: Snipcart
How to Deploy Your Secure Vue.js App to AWS
This article was originally published on the Okta developer blog. Thank you for supporting the partners who make SitePoint possible. Writing a Vue app is intuitive, straightforward, and fast. With low barriers to entry, a component-based approach, and built-in features like hot reloading and webpack, Vue allows you to focus on developing your application rather than worrying about your dev environment and build processes.
Authored by: SitePoint
Node.js
Why should your Node.js application not handle log routing?
It is not the responsibility of the application to route logs. 12 Factor says that logs should go to STDOUT. WAT? WHY? I just configured my whole application code to write logs to custom log files. What's wrong with that? Logging is one of those things that can sometimes be a black box for developers.
Authored by: Corey Cleary
Understanding the NodeJS cluster module (1/4)
NodeJS processes runs on a single process, which means it does not take advantage from multi-core systems by default. If you have an 8 core CPU and run a NodeJS program via $ node app.js it will run in a single process, wasting the rest of CPUs.
Authored by: Antonio Santiago
Express Error Handling Example Tutorial
One of the most crucial things in a building web applications are error handling. The system will depend on many services, databases, as well as consumers of those services, Express Error Handling Example Tutorial is today's leading topic. the unexpected becomes expected. Databases will fail, services become unavailable, server timeout.
Authored by: KrunalDLathiya
Bundle your Node app to a single executable for Windows, Linux and OsX
A question I get asked so many times by so many people is how to compile a Node app to a single executable. I am surprised because this is actually pretty simple.
Authored by: Jochem Stoel
Libraries and Tools
11 Javascript Data Visualization Libraries for 2018
Best dData visualization and charting in Javascript. Create charts and graphs in web or mobile: D3js, threejs, chartjs, Echarts, metrics-graphics, React-vis, Metabase, NVD3, Chartist, Highcharts & mor
Authored by: Bit
Component Libraries with Stencil.js
This is the second in a series of posts about creating a web component library using Stencil.js - Check out the first post Now that we've talked about the reasoning for choosing Stencil to build our web component library, let's jump right in. First things first, we need to get our base project structure set up.
Authored by: John Woodruff
Testing
JavaScript testing tutorial - part four. Mocking API calls and simulating React components interactions
1. JavaScript testing tutorial - part one. Explaining types of tests. Basics of unit testing with Jest2. JavaScript testing tutorial - part two. Introducing Enzyme and testing React components3. JavaScript testing tutorial - part three. Testing props, the mount function and snapshot tests.4. JavaScript testing tutorial - part four.
Authored by: Marcin Wanago
Functional Programming
Functional programming basics part 2: Higher order function
In order to be called a Higher order function, one must either take an other function as a parameter or return a function. Take function as a parameter??? what? no way!! Let's start by writing a simple function that is not from the highest order: Now lets try to pass this function to an other function: Woah that worked!!
Authored by: ysael
Other
Have you tried CSS Snap Scrolling in Chrome 69?
The author of Switching sides, not tabs , who earlier used to love Firefox, has now changed its default browser back to Chrome. Yes, it's me. And I'm no longer using Firefox...Well, this story is not about this topic as to why I changed back to Chrome, it's because of a few great features in the latest Chrome 69.
Authored by: Vaibhav Khulbe
New in Chrome 69: building doughnut charts with conical gradients
With the recent release of Chrome 69, we finally have support for the conical gradients. Now we can create both pie and doughnut charts in an extremely simple and semantic way.
Authored by: LogRocket
How browser rendering works - behind the scenes
This is not supposed to be a computer science networks class, but you may remember that data is sent over the internet as "packets" sized in bytes. The point I'm trying to make is that when you write some HTML, CSS and JS, and attempt to open the HTML file in your browser, the browser reads the raw bytes of HTML from your hard disk (or network).
Authored by: LogRocket
Solving JS equality game with Cypress test runner
Using Cypress end-to-end test runner to automate solving JavaScript equality game. Today a game has appeared that shows how tricky JavaScript == operator can be. You can check out the game yourself at https://slikts.github.io/js-equality-game/. You have to fill the field by clicking every cell where the row and column labels are equal when using == operator.
Authored by: Gleb Bahmutov
