![[ERR!]](https://pbs.twimg.com/profile_images/828593972029317120/4UXq5Hmj_normal.jpg)
Mocking is generally never acceptable, except when we talk about API Mocking. API mocking is a process in which developers imitate the actual APIs with mock APIs. These mock APIs behave similarly to the actual APIs and perform the basic functionality required to develop or test. Check out Nishani Dissanayake's "JavaScript API Mocking Techniques" on Syncfusion for more.
Other popular stories this week include "How to Improve React Code readability with Simple Conditional Rendering", "Automatically generating tests for JS/TS functions in VS Code with GitHub Copilot" and "Server Components vs. Client Components in Next.js 13" on Bits and Pieces.
General
Scalable APIs with TypeScript & Node.js
TypeScript is a programming language that helps simplify debugging and reduces errors during development through enforcing static typing. It also improves code organization and maintainability as the application grow in complexity. When used in collaboration with Node.js, TypeScript provides access to powerful features like async/await that enable non-blocking code execution to improve over all application performance.
Authored by: Bit
Server Components vs. Client Components in Next.JS 13
Newly launched Nextjs 13 introduced a hybrid system with "Server Components" and "Client Components." In this article, I'll show you briefly what are they and when to use them. Server Component is a component that is fetched and rendered ON THE SERVER, while Client Component is the one that is fetched and rendered ON THE CLIENT(browser).
Authored by: Bit
The Reusable Revolution: Best Practices for Component Development
Everyone knows that by definition a component should be reusable, otherwise, why would you want to turn that code into a component in the first place, right? Well, while everyone might know that, not everyone is aware of the best way to make a reusable component.
Authored by: Bit
The Benefits of Combining Zod and Generics Type in Next.js Applications
I have worked on numerous Next.js applications and have come across various libraries that aid in building robust and scalable applications. One such library that has recently gained a lot of popularity is Zod. Zod is a TypeScript-first schema validation library that provides a concise and type-safe way to validate inputs, outputs, and API responses.
Authored by: Bit
You Need Vite, Here's Why ⚡
Ifyou're a web developer looking for a faster and more efficient way to build your projects, you need to start using Vite . Vite is a modern build tool that was created specifically for the needs of modern web development.
Authored by: Bit
Can multiple web workers boost the speed of your web application?
In this article I will tell about some experiments I did creating a web-application called cloc-web, you can find it here.The application is a single web page that implements a very simple version of CLOC (Count Lines Of Code).
Authored by: Deepak Kumar
JavaScript
JavaScript API Mocking Techniques
API mocking plays a significant role in the software development process. It allows developers to simulate the actual APIs and receive realistic responses generated with custom data. For example, you can use mock APIs when writing unit tests or situations where external dependencies are unavailable to make things easier.
Authored by: Syncfusion
Security Flaws Prevention in JavaScript
JavaScript is the most popular programming language for web development. In my opinion, developers must remain defensive in securing their JavaScript applications to keep the web safe. This post will go into common JavaScript vulnerabilities and how to fix them.
Authored by: Bit
Mastering Array Manipulation with Map, Filter, and Reduce in JavaScript
The methods of map, filter, and reduce are widely used by developers and are commonly asked in interviews. Understanding these methods and knowing where to apply them is important. In this article, you will also learn how to create your own custom methods. Let's start...
Authored by: Amnah Khatun
Advanced JavaScript Technique: Reloading a Page with Location.reload(true)
Have you ever felt like you needed to start over and pressed the refresh button? Well, that's exactly what you can do with a simple JavaScript technique. Whether you're a beginner or an experienced JavaScript developer, it's important to stay up-to-date on the latest advanced techniques.
Authored by: Rahul⚡️
Check If Two String Arrays are Equivalent in JavaScript
We will be discussing multiple solutions. Solution 1: The arrayStringsAreEqual the function takes two parameters, word1 and word2, which are arrays of strings. The function concatenates all the strings in word1 and all the strings in word2, and then compares the resulting concatenated strings. If the two concatenated strings are equal, the function returns true.
Authored by: JavaScript Kicks
Hiding Your JavaScript Code from Prying Eyes: A Complete Guide
U2FsdGVkX1/7DNglflcflNX1NepqxK7hBWR8E7BW3ZYSrQ4a7/EuyFNJe2mVXZqb63/Ln0Jf93I+ZX3h7oT1ew== This is our JavaScript file! The above encrypted string is a JavaScript array, containing a list of words that our web page needs to use. This article will show how to easily generate this encrypted string, as well as to download and decrypt it to a variable in your web page.
Authored by: Kory Becker
JavaScript Replace - How to Replace a String or Substring in JS
When working with JavaScript, you might need to replace a string or substring with a new one. For example, you might want to replace a certain string (like "color" - American English) or substring in a larger text or document with a different string ("colour" - British English). You may
Authored by: Joel 🦸♀️
10 Mind-blowing JavaScript Datatypes You Need to Know
If you're a developer who's been working with JavaScript for a while, you're probably already familiar with some of the data types in the language, like strings and numbers. But did you know that JavaScript actually has ten built-in data types?
Authored by: JavaScript In Plain English
TypeScript
Advanced TypeScript Techniques for Managing Async Data in Next.js
Next.js is a popular React-based framework for building web applications that offers server-side rendering, optimized production builds, and other features that make it a powerful tool for building complex, high-performance web applications. TypeScript is a statically-typed superset of JavaScript that adds additional safety and functionality to your code.
Authored by: Bit
Typescript Advanced Types
In this article, we will mostly talk about interfaces. Before we get into that, I'd like to get a couple of terminologies out of our way. I believe that addressing them will give us a better understanding of interfaces. What I'd like to talk about before interfaces is Type aliases .
Authored by: Frontend Weekly
TypeScript Made Easy: A Guide To Your First Type-Safe App with Next.js, WunderGraph, and Prisma
I've noticed an interesting sentiment brewing on social media lately. Dissatisfaction that essentially boils down to this: All of my favorite educators, content creators, and industry people are shifting to TypeScript-first for their content! How could they?! Now, I love TypeScript. For years, it has made React development so much easier for me.
Authored by: JavaScript In Plain English
Full-Stack TypeScript with tRPC and React
tRPC allows developers to create fully type safe APIs with TypeScript in full-stack applications. While the server application produces a type safe router with type safe functions (e.g. CRUD operations: create user, get user by identifier, get all users), the client application can call these functions directly on the inferred type safe router.
Authored by: Robin Wieruch
Angular
Angular Routing in 5 Minutes
You can use the Angular Route ( angular/router) if you'd like to have your users navigate to different pages in your application. Angular Route turns your application into a Single Page Application, one that has multiple views by adding routing. Just like majority of SPA architectures, Angular provides a URL route to component mapping.
Authored by: Arseniy Tomkevich
How Much Does it Cost to Hire AngularJS Developers in 2023?
Source: Google AngularJS is a popular JavaScript framework used for building dynamic web applications. Developers and companies widely use it to create complex and feature-rich web apps. With the increasing demand to hire Angular JS developers, it is important to understand the cost of hiring them in 2023.
Authored by: Emma Jhonson
React
Clean-er ReactJS Code - Conditional Rendering
Move render conditions into appropriately named variables and abstract the condition logic into a function. This makes the render function code a lot easier to understand, refactor, reuse and test. Conditional rendering is when a logical operator determines what will be rendered. The following code is taken from examples given in the official ReactJS documentation.
Authored by: Miha Šušteršič
Why and How do I use React Query?
Most front-end developers do not care about the number of network requests they make. I mean most resources do not teach it. I started to care about the network requests when I was building my first production-grade full-stack project. Why? Because I also hosted it on AWS and every request has a cost to it!
Authored by: Yarala Hruthik Reddy
Build micro web features in a React way
As a web developer, I love the concept of web components, which allow us to write universal code that can be easily plugged in to support custom elements. However, as promising as web components are...
Authored by: JavaScript In Plain English
Vue
What is ref() in Vue?
Well-designed reactivity is one of the selling points of Vue. When a reactive value is updated (after a user event) then automagically the components using the reactive value are updated. refs, created by ref() composition API, are the primary tool of Vue reactivity. Knowing refs is a requirement if you want to understand reactivity.
Authored by: Dmitri Pavlutin
Interviewer: What Happens When You Use "reactive({ name: fatfish })" in Vue3?
The first front-end interview in 2023 Recently, a friend of mine went through a very interesting interview, and his excellent performance was well received by the interviewer... We can learn Interviewer: Vue3 Young man, you are very confident! How about a live show?
Authored by: fatfish
Node.js
Mastering Advanced JavaScript Techniques for High-Performance Node.js Applications
Node.js is a popular server-side JavaScript runtime that is widely used for building scalable and high-performance applications. However, as your Node.js application grows and becomes more complex, it can become challenging to maintain its scalability and performance. In this article, we'll explore some advanced JavaScript techniques that you can use to build scalable Node.js applications.
Authored by: JavaScript In Plain English
Libraries and Tools
Creating Custom JavaScript Libraries: A Guide to Reusable and Efficient Code
JavaScript is a popular programming language used by developers for building web and mobile applications. While there are many built-in functions and libraries in JavaScript, sometimes you need to create your custom library to reuse code across different projects.
Authored by: Bit
Functional Programming
How would you implement debounce and throttle functions in JavaScript?
Debounce and throttle are utility functions that basically control when a function will be executed over time. These are available in libraries like lodash or underscore. Implementing debounce or throttle in JavaScript is one of the most commonly asked questions in technical interviews. Debounce: introduces a delay before invoking any task/request, like a call to an API.
Authored by: JavaScript In Plain English
Automatically generating tests for JS/TS functions in VS Code with GitHub Copilot
Want to automatically generate tests for your JS/TS functions? GitHub CoPilot now does that. GitHubNext added a TestPilot experiment that can generate tests for a function by analysing it and scanning the docs and comments.
Authored by: Christian Heilmann
Functions Are Killing Your React App's Performance
Functions are an integral part of all JavaScript applications, React apps included. While I've written about how peculiar their usage can be, thanks to the fact that all functions are values, they help split up the monotony of your codebase by splitting similar code into logical segments.
Authored by: Unicorn Utterances
