These last few months have seen quite an unprecedented surge in hacking attacks and whether it's just because they've had more time on their hands or because more inexperienced people are being forced into online living, it's never a waste to review security issues and best practices. To that end, Mahdhi Rezvi helps in understanding XSS & CSRF in "JavaScript Security Issues and Best Practices" on Bits and Pieces.
In How To news this week, Dwayne Charrington shows us to How To Deploy Aurelia 2 Apps To GitHub Pages, Girish Ramloul implements graph algorithms in "How to Implement 8 Essential Graph Algorithms in JavaScript" and Dmitri Pavlutin gets detailed in "How to Get the Screen, Window, and Web Page Sizes in JavaScript."
General
Blazor SSRS Report Viewer Component using Bold Reports
Yes, you read it right, we have provided a way to use Bold Report Viewer component in Blazor apps. In this blog post, we will walk you through integrating Bold Reports JavaScript Report Viewer control into your Blazor apps.
Authored by: Syncfusion
Why Frontend Developers Choose Gatsby Over Traditional CMS
Today, having a modern and attractive website is at the forefront of any business. Most of these websites are rich with content and provoking user interactions. You will find more unique designs, timely updated never than before. When we think about dynamic content and websites, its a no surprise that Content Management Systems (CMSs) become the best suited for the job.
Authored by: Bit
How to Count Objects in an Array
Knowing how to quickly iterate through an array and count objects is deceptively simple. The length() method will tell you the total number of values in the array, but what if you only want to count those values based on certain conditions?
Authored by: freeCodeCamp.org
Start Using forEach() and map() with DOM Selections
Memo to self: I'm working with the DOM (Document Object Model). I need to select all the elements in the document. Then I need to iterate over the results to change each element in some way. I've done this before. My first instinct is to reach for the trusty ol' for loop...
Authored by: Dave Gray
ECMAScript 2020 biggest new features
The official release of ECMAScript 2020 is upon us - time to find out what it brings to the table! π #JavaScript #JS #WebDevelopment #WebDev #ECMAScript #ES2020 #TypeScript
Authored by: areknawo
How a pool of web workers helped to solve the UI performance issue?
How a pool of Web workers helped to solve a UI performance issue? Do you know we can achieve multi-threading in javascript with the help of HTML Web Workers API? A web worker is a JavaScript that runs in the background, independently of other scripts.
Authored by: Aatif Bandey
Gatsby E-Commerce Recipe: Integrate a Shopping Cart in a Few Steps
In a rush? Skip to tutorial or how to use our e-commerce recipe. No tool in the Jamstack ecosystem has made more steps towards an optimal developer experience than Gatsby. What started as a simple, albeit performant, static site generator is today so much more than that.
Authored by: Snipcart
How Much Does it Cost to Develop Any Mobile App in 2020?
With approximately five million applications available on various OSs, including Android, iOS, and others, it is clearly portraying the increasing competition between businesses and different applications. Developing a mobile app or creating a digital presence for your brand has become an urgent need of an hour, and organizations have clearly understood this thing.
Authored by: Frontend Weekly
Refactoring optional chaining into a large codebase: lessons learned
Now that optional chaining is supported across the board, I decided to finally refactor Mavo to use it (yes, yes, we do provide a transpiled version as well for older browsers, settle down). This is a moment I have been waiting for a long time, as I think optional chaining is the single most substantial JS syntax improvement since arrow functions and template strings.
Authored by: Lea Verou
Using the Priority Hints API to Prioritize Network Requests
The Priority Hints API gives developers a way to communicate to the browser the importance of a resource to the user experience. The browser may take this signal into consideration when prioritizing the request (as you would expect, browsers have their own default prioritization of resources).
Authored by: Bit
JavaScript
How To Build A Presentation Using HTML, CSS, & JavaScript
The process of conceiving and constructing a presentation is often hard.Sometimes we're stuck with Keynote or PowerPoint, and the templates... | Web design web development news, website design and online marketing. Web design, development, javascript, angular, react, vue, php, SEO, SEM, web hosting, e-commerce, website development and search engine optimization, social media management.
Authored by: MA-NO WebDesign&Dev
7 Interesting JavaScript Features in ES2020 That You Should Know - Kriss
The world of web development moves fast, particularly in the JavaScript ecosystem. New features, frameworks, and libraries are continually emerging, and the minute you stop learning is the minute your skillset starts to become obsolete. One major part of keeping your JavaScript skills sharp is staying current on the latest features in JavaScript.
Authored by: kris
Constructors vs Literals in JavaScript
In JavaScript, we do have the freedom to get the same result in different ways. We can create strings, numbers, objects, arrays, etc. values using both constructors and literals approach. You can get the same values using any of those approaches. However, there are still some differences to know which might be useful to avoid runtime bugs.
Authored by: Raj Maharjan
JavaScript Security Issues and Best Practices
Cross-Site Scripting is one of the most common browser-side vulnerabilities. XSS in itself is a threat that is brought about by the internet security weaknesses of client-side scripting languages, such as HTML and JavaScript. In XSS, attackers are able to manipulate legitimate but vulnerable web applications into performing malicious tasks.
Authored by: Mahdhi Rezvi
How to Get the Screen, Window, and Web Page Sizes in JavaScript
To detect whether the browser window is in landscape or portrait mode, you can compare the browser window's width and height. But from my experience it's easy to get confused in the bunch of sizes: screen, window, web page sizes. How are these sizes defined, and, importantly, how to access them is what I'm going to discuss in this post.
Authored by: Dmitri Pavlutin
JavaScript Shorthand Coding Techniques
Anyone can publish on Medium per our Policies, but we don't fact-check every story. For more info about the coronavirus, see cdc.gov. Evaluation Shorthand This might be meaningless, but worth a mention. When doing "if checks", assignment operators can sometimes be omitted.
Authored by: Frontend Weekly
How to Implement 8 Essential Graph Algorithms in JavaScript
In this article, I will implement 8 graph algorithms that explore the search and combinatorial problems (traversals, shortest path and matching) of graphs in JavaScript. The problems are borrowed from the book, Elements of Programming Interviews in Java [https://www.google.com/books/edition/Elements_of_Programming_Interviews_in_Ja/ux3PCwAAQBAJ?hl=en&gbpv=0] .
Authored by: freeCodeCamp.org
TypeScript
Understanding Mixins in TypeScript
One of the limitations imposed by TypeScript when it comes to class inheritance is that you can only extend a single class at a time. In most normal cases this is not a problem, but if you're working with a complex enough architecture, you might find yourself a bit constrained by the language.
Authored by: Bit
Angular
Angular- Getting started
Hi all, This is my first post on Angular . I wish to do a post series of angular. I hope it will be a funny journey for both you and me.π Before dive in to deep, let us see what is Angular ?Angular...
Authored by: Frontend Weekly
React
Lazy Loading Images in React for Better Performance
In some cases, we need to load a list that contains a lot of images on a single page. Most of the images not even visible on the screen when it is loaded. We need to scroll down to see them. By...
Authored by: Muhammad Naufal
React Visual Editors in 2020
React is already known as a sort-of "universal language" thanks to react-dom and react-native but recently we've seen an explosion of frameworks and tools that make it possible to build with React for every device and platform. React is more than a JavaScript library. It is a philosophy and methodology.
Authored by: Bit
Optimize Your React App with React.memo
You would have noticed that Table component gets re-rendered anytime a state update happens in App component. It makes sense for Table component to re-render when the houseId state changes but it also re-renders when the theme state changes. We can optimize the Table component by re-rendering it only when houseId state changes.
Authored by: Bit
Aurelia
How To Deploy Aurelia 2 Apps To GitHub Pages (gh-pages) - I Like Kill Nerds
You have yourself an Aurelia app (or you will soon), and you want to host it on GitHub Pages because GitHub provides a generous free hosting solution that gets powered from the Git repository itself. Fortunately, the process couldn't be more straightforward. A lot of this post will apply to other frameworks and libraries besides [...]
Authored by: Dwayne Charrington
Vue
Vue Best Practices- Props, Spacing, and Naming
Vue.js is an easy to use web app framework that we can use to develop interactive front end apps. In this article, we'll look at some best practices for props, spacing, and naming. In Vue apps, props should be named in a consistent way. They should be valid JavaScript identifier names in camelCase.
Authored by: John Au-Yeung
Node.js
π₯Free book and video course π₯- Deploying node.js applications
"Deploying Node.js" is a free hands-on book and video course that teaches you how to manage, secure, provision and deploy node.js servers and applications. Learn how to horizontally scale your multi-tier applications over multiple servers, database installation and backups, production best practices.
Authored by: Kati Frantz
6 Most Useful NPM commands that you may do not know
npm view to view information about the package $ npm view axios Get only the version information about the axios (installed package): $ npm view axios version > 0.19.2 Executable commands can be searched visa -h option $ npm -h Especially, npm -h is a command to get a quick help for the specific .
Authored by: JavaScript in Plain English
Libraries and Tools
An Introduction to Regex In JavaScript
Regex, short for Regular Expressions are useful tools to find matching patterns in a string. They can be used to validate text from user input, check formatting of the string (like an email or a 12-digit phone number) and allows the search for a certain pattern of words or numbers in a string.
Authored by: JavaScript Kicks
10 libraries for machine learning in JavaScript
JavaScript is currently one of the most popular programming languages. Its main application is in web applications, used to give... | Web design web development news, website design and online marketing. Web design, development, javascript, angular, react, vue, php, SEO, SEM, web hosting, e-commerce, website development and search engine optimization, social media management.
Authored by: MA-NO WebDesign&Dev
Testing
Visual testing for React components using open source tools
Comparing React components pixel by pixel to catch style problems Let's take a look at a modern React application like this Sudoku game that you can play online at https://sudoku-raravi.now.sh/. The game is nicely done. There are different difficulty levels, game modes and it looks very polished.
Authored by: Gleb Bahmutov