![[ERR!]](https://pbs.twimg.com/profile_images/828593972029317120/4UXq5Hmj_normal.jpg)
Welcome to the month of love! Our shared love of Javascript is always cause to celebrate and what better way is there to celebrate than by laughing? Check out Ariana Milasincic's "10 JavaScript Memes" to get the month started right.
Other popular stories this week include Nethmi Wijesinghe's "Building Custom Structural and Attribute Directives in Angular" on Syncfusion, Dmitri Pavlutin's "JavaScript Closure: A Simple Explanation" and Simon Ugorji's "Node.js App Step-by-Step Guide for Frontend Developers" on Bits and Pieces.
General
Best Practices in Handling Errors in Web Components
Almost all modern-day web applications are bound to run into errors at some point during their lifetime. Unfortunately, it is never "fail-safe," as your users can run into an error depending on how they use your application. For instance, two users may execute the same feature differently, causing one user's action to fail while the other to succeed.
Authored by: Bit
Fetching Data From an API in Next.js - Upmostly
Fetching data in a Next.js app is an essential part of building any web application. Axios is a popular library for making HTTP requests in JavaScript. It can
Authored by: Upmostly
Context API vs Redux
Every React developer has surely come across the question: "What's the difference between Redux and Context API, and can the Context API replace Redux ? ".This is one of the most discussed and maybe conflicting questions within the React community.
Authored by: JavaScript In Plain English
Turn Your Figma Designs into Code with a Single click
We've all been there, working on a brand new site, we hear that the designer is ready with the mockups, and the next thing we know, they're sending us the actual mockup, that Photoshop image. Sure, we can use it to start getting the different graphic assets out, and slowly but surely begin to build our components and our website.
Authored by: Bit
Why doesn't JSON support comments?
Did you ever curse the JSON data format for not allowing comments and wondered what the heck? Yeah, same here. Surprisingly, JSON, in its initial spec, did allow comments, but comment support was removed for three reasons: People put parsing instructions into comments breaking portability across platforms and languages.
Authored by: stefan judis
10 Web Development Trends in 2023
While, in my personal opinion, the web development landscape slowed down for a few years (2016 - 2021), it started to gain lots of traction just last year (also see State of JS where the images for this article are taken from).
Authored by: Robin Wieruch
Adding Multi-Version Support to Your Astro-based Documentation
Building a docs site is like building a static site with lots of pages. What happens if those pages change when the version of your product changes?
Authored by: Bit
How To Build an Animated Dashboard with Framer Motion in Next.js - Upmostly
Framer Motion is a powerful animation library that makes it easy to create smooth, complex animations in your Next.js projects. In this article, we will explore the benefits of using Framer Motion in a Next.js project. By combining the two, you can create highly interactive and visually appealing Next.js applications with minimal effort.
Authored by: Upmostly
JavaScript
JavaScript 101: All About Timers
JavaScript timers are great tools for achieving recurrent behavior or even triggering delayed actions. Whatever time-based logic you have, timers are the answer to your questions. But if you don't fully understand how they work, then you'll be hitting your head against a JavaScript-made wall.
Authored by: Bit
Speed Up Your JavaScript: Proven Techniques for Optimizing Performance
JavaScript performance optimization is critical for creating fast and responsive web applications. Optimizing JavaScript code can reduce load times, improve the overall user experience, and increase the scalability of a web application. JavaScript is a client-side scripting language, which runs on the user's device rather than the server.
Authored by: Liudas Drejeris
How to Switch Blockchains on MetaMask with JavaScript
With over 10,000 blockchains currently operating, there are endless possibilities for deploying your smart contracts. For anybody to be able to use your Decentralized Application (DApp), they need to be connected to the blockchain where you've deployed your smart contract. This article will show you how to prompt your
Authored by: freeCodeCamp.org
Understand the Lexical Scoping in JavaScript
Are you ready to learn about one of the quirks of JavaScript? Today, I'm going to talk about lexical scoping. It might sound intimidating, but by the end of this post, I'll make sure you know everything you need to know about how it works and how it can make your code better.
Authored by: Olivia Brown
10 JavaScript Memes
Haven't done one of these for quite some time, enjoy!. "10 JavaScript Memes" is published by Ariana Milasincic in JavaScript in Plain English.
Authored by: JavaScript In Plain English
Advanced Data Structures: Implementing the A* Algorithm in JavaScript
Without getting into code just yet, the basic algorithm behind A* is the following: You first need to define a grid-based map, where each cell in the grid represents a location that the search can visit.
Authored by: Bit
JavaScript Closure: A Simple Explanation
The callbacks, event handlers, higher-order functions can access outer scope variables thanks to the closure. The closure concept is important in functional programming and is often asked during the JavaScript coding interview. While being used everywhere, closures are difficult to grasp. If you haven't had your "Aha!"
Authored by: Dmitri Pavlutin
5 Rare Native APIs for JavaScript
This article brings 5 rare JavaScriot native APIs that bring unexpected convenience to our front-end development. The Element.getBoundingClientRect() method returns a DOMRect object that provides information about the size of the element and its position relative to the viewport.
Authored by: Maxwell
10 Must-Know JavaScript Tricks & Tips to Make You a Better Programmer
In the past, I wrote a lot of junk code, and now that looks terrible. When I saw those code fragments again, I even doubted whether I was suitable to be a programmer... Promises provide an elegant way to handle asynchronous operations in JavaScript.
Authored by: fatfish
Building a Temperature Converter App using HTML, CSS, and JavaScript
A temperature converter is a tool used to convert temperatures, to and from Celsius, Fahrenheit, and Kelvin. In this article, we will learn how to build a temperature converter application using HTML, CSS, and JavaScript. Here's a screenshot of what the finished application looks like: Basic understanding of HTML, CSS, and JavaScript.
Authored by: Frankie | frankiefab.eth/.lens (🧱, 🚀)
TypeScript
Exploring Advanced Ways in TypeScript
TypeScript is a powerful tool for building large and complex JavaScript applications. It offers a number of advanced features that can help developers write more maintainable and scalable code. In this article, we'll cover some of the best practices for mastering TypeScript, including working with interfaces, classes, and decorators, as well as debugging and testing.
Authored by: Suman Giri
Angular
Building Custom Structural and Attribute Directives in Angular
Angular directives assist us in manipulating the DOM. We may customize a DOM element’s look, behavior, or layout using directives. In addition, they help us extend the power of HTML via actions, reactions, and interactions. For example, directives will accept arguments, perform some action with them, and then produce a reactive action on your HTML.
Authored by: Syncfusion
Advanced Lazy Loading Techniques in Angular
Welcome to our blog on advanced lazy loading techniques in Angular! If you're not familiar with lazy loading, it's a technique that allows you to optimize the performance of your Angular app by only loading the parts of the app that are actually needed at any given time.
Authored by: Frontend Weekly
Ace your Angular Interview: Top Questions and Pro Tips
Are you ready to take your Angular skills to the next level and impress your interviewer? Look no further! In this article, we will be diving into the top questions and answers with code samples to help you ace your Angular interview and land your dream job.
Authored by: JavaScript In Plain English
React
How does React's Reconciliation Algorithm work? - Upmostly
Fiber is a reconciliation algorithm used in the popular JavaScript library React to efficiently update a web application's user interface (UI). It was introduced in version 16.0 of React in 2017 and has significantly improved the performance of React applications.
Authored by: Upmostly
Master the Art of Referencing with React's useRef Hook: A Beginner's Guide
The useRef hook in React allows you to create a reference to a DOM element or a component instance. This can be useful for various tasks such as creating animations, managing focus or text selection or triggering imperative methods on a component. In this blog post, we will explore the use cases and examples of the useRef hook.
Authored by: JavaScript In Plain English
Vue
Introduction to Vue Components
When developing a large application, it is always a good idea to break it down into smaller components to make the code easier to read, structure, and maintain. Most Vue beginners understand what components are at least conceptually, but they might not understand what they can and cannot do fully.
Authored by: StackAbuse
5 Must-Know Differences Between ref() and reactive() in Vue
If you landed on this post most likely you have a basic understanding of Vue reactivity. However, like me, you might be asking yourself the eternal question: what are the main differences between ref() and reactive()? And when would you use one or another? Let's find the answer together.
Authored by: Dmitri Pavlutin
Node.js
Node.js App Step-by-Step Guide for Frontend Developers
App development is the process of creating software applications that run on mobile devices, such as smartphones and tablets. These apps can be native, which means they are built specifically for a particular platform or device, or they can be cross-platform, which means they can run on multiple platforms or devices.
Authored by: Bit
How to read excel file in Node.js
IDEA - Create a get api in Node.js to read below excel file using xlsx and convert data in json format which can be used by client side for further manipulation. If you are not sure as to how to create an api in Node.js, do refer my blog for clarity.
Authored by: JavaScript In Plain English
Let's build APIs with Node, Express, and PostgreSQL
This article is part two of the "Develop APIs with Express Framework and PostgreSQL" series. In part one, you learned how to create a NodeJS app with a simple get API responding with data from a connected PostgreSQL database. In part two, we will focus on creating a complete modern backend app with create, read, update & delete APIs.
Authored by: Yogesh Datir
How to solve Cannot find module 'bcrypt' error in Node.js
In this tutorial, we are going to learn about how to solve the cannot find module 'bcrypt' error in Node.js. This error occurs due to the bcrypt module is not installed in the node.js build or the package is corrupted while updating the node version.
Authored by: Sai gowtham
Functional Programming
JavaScript Require - How to Use the require() Function in JS
In JavaScript, modules refer to a file that holds JavaScript code which performs a specific purpose. Modules are self-contained, making it easy to add, remove, and update functionalities without affecting your entire code because they are decoupled from other pieces of code. When you have these modules in separate JavaScript
Authored by: Joel 🦸♀️
