React Testing - VI - Mocking API
Frontend is mostly about displaying and fetching data from the backend using API. The web application is based on a client-server model....
top of page
![React Testing V - [Providers]](https://static.wixstatic.com/media/1f7141_44e0badbb2f5480a8824cff99b6ceed5~mv2.png/v1/fill/w_454,h_341,fp_0.50_0.50,q_95,enc_auto/1f7141_44e0badbb2f5480a8824cff99b6ceed5~mv2.png)
- Mar 10
- 2 min
React Testing V - [Providers]
Sometimes you may work with third-party component libraries like MUI. It might have a wrapper component that wraps our whole App...
![React Testing - IV [User Interactions]](https://static.wixstatic.com/media/1f7141_3083a65b6f8749e9a0aa63f82c2c8491~mv2.png/v1/fill/w_454,h_341,fp_0.50_0.50,q_95,enc_auto/1f7141_3083a65b6f8749e9a0aa63f82c2c8491~mv2.png)
- Mar 10
- 2 min
React Testing - IV [User Interactions]
When you display something on the browser, the user interacts with it. Say the button is clicked, typing in the input field, etc. That...
![React Testing - III [RTL Queries]](https://static.wixstatic.com/media/1f7141_909bcb5d67f44bafb7bd733ad668cc18~mv2.png/v1/fill/w_454,h_341,fp_0.50_0.50,q_95,enc_auto/1f7141_909bcb5d67f44bafb7bd733ad668cc18~mv2.png)
- Mar 10
- 2 min
React Testing - III [RTL Queries]
Any test has these three steps, Render the component Find the element rendered by the component Assert against the element found in the...
![React Testing - II [Coverage - Assertion - Matchers ]](https://static.wixstatic.com/media/1f7141_c8a809a53bd942489432983d8f47b98c~mv2.png/v1/fill/w_454,h_341,fp_0.50_0.50,q_95,enc_auto/1f7141_c8a809a53bd942489432983d8f47b98c~mv2.png)
- Mar 10
- 2 min
React Testing - II [Coverage - Assertion - Matchers ]
Code Coverage: Code coverage is a metric in software development to measure how much code is tested. More coverage, less the bug....
![React Testing - I [Intro - JEST-RTL with CRA ]](https://static.wixstatic.com/media/1f7141_29f1c3a94c6f4f82a862963d13e69fc8~mv2.png/v1/fill/w_426,h_171,fp_0.50_0.50,q_95,enc_auto/1f7141_29f1c3a94c6f4f82a862963d13e69fc8~mv2.png)
- Mar 10
- 3 min
React Testing - I [Intro - JEST-RTL with CRA ]
We do tests to deliver a confident product to the client. If you are a developer, you must have a basic understanding of testing. If you...
- Feb 22
- 3 min
What is Webpack and How it works? II
Make sure to read this before proceeding - https://www.pansofarjun.com/post/what-is-webpack-and-how-it-works-i Add any console log...
- Feb 20
- 4 min
What is Webpack and How it works? I
No definitions! Yes, we will create a project and learn while using it. Create a folder called 'webpacktut.' Initialize git. Create a...
- Jun 24, 2022
- 3 min
React Router DOM v6 - Part - I
React enables us to develop single-page applications i.e single HTML pages. Essentially we render different components in a single HTML...
![An investigative guide to React JS[State and Props] Part-X](https://static.wixstatic.com/media/1f7141_0ed75ad5ed21404485fa847b0a7821c3~mv2.png/v1/fill/w_429,h_341,fp_0.50_0.50,q_95,enc_auto/1f7141_0ed75ad5ed21404485fa847b0a7821c3~mv2.png)
- Apr 2, 2022
- 2 min
An investigative guide to React JS[State and Props] Part-X
We know that State is like a variable that can be of data type numbers to array/objects. If the variable is dynamic(changes), we use...
![An investigative guide to React JS[State and Props] Part-IX](https://static.wixstatic.com/media/1f7141_62ca52e092544b9097c3009a0316992f~mv2.png/v1/fill/w_454,h_341,fp_0.50_0.50,q_95,enc_auto/1f7141_62ca52e092544b9097c3009a0316992f~mv2.png)
- Mar 28, 2022
- 2 min
An investigative guide to React JS[State and Props] Part-IX
Till the last article, we have been dealing more with the UI part of React. Now let's get shifted to the Data part of react. Data brings...
![An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-VII](https://static.wixstatic.com/media/1f7141_8ff50bbd79c24eac89bd59afbbd6c7ea~mv2.png/v1/fill/w_454,h_242,fp_0.50_0.50,q_95,enc_auto/1f7141_8ff50bbd79c24eac89bd59afbbd6c7ea~mv2.png)
- Mar 23, 2022
- 2 min
An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-VII
We can't write React.createElement() every time to create a virtual DOM. Therefore we need some sort of syntax for converting what we...
![An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-VI](https://static.wixstatic.com/media/1f7141_a6ae0dca39c74f4fb3f3258173c14a0d~mv2.png/v1/fill/w_454,h_192,fp_0.50_0.50,q_95,enc_auto/1f7141_a6ae0dca39c74f4fb3f3258173c14a0d~mv2.png)
- Mar 19, 2022
- 3 min
An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-VI
Highlights of part - V React is a Javascript framework and hence React virtual DOM is created by javascript methods. This method is...
![An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-V](https://static.wixstatic.com/media/1f7141_685b1786391b4c6aad4e31219a91e172~mv2.jpg/v1/fill/w_454,h_341,fp_0.50_0.50,q_90,enc_auto/1f7141_685b1786391b4c6aad4e31219a91e172~mv2.jpg)
- Mar 15, 2022
- 2 min
An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-V
Highlights of Part - IV Every time a new repaint happens in a real DOM tree, it comes with a huge performance cost. This is because more...
![An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-IV](https://static.wixstatic.com/media/1f7141_2b7646ac5bf34c048d7f0e5bb4b73227~mv2.jpg/v1/fill/w_454,h_341,fp_0.50_0.50,q_90,enc_auto/1f7141_2b7646ac5bf34c048d7f0e5bb4b73227~mv2.jpg)
- Mar 10, 2022
- 3 min
An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-IV
Highlights of part III JS's real purpose is to add dynamicity to the webpage Most of the time it happens through user interaction with...
![An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-III](https://static.wixstatic.com/media/1f7141_bb8388338f1a48079bb0bcbba586c278~mv2.jpg/v1/fill/w_454,h_341,fp_0.50_0.50,q_90,enc_auto/1f7141_bb8388338f1a48079bb0bcbba586c278~mv2.jpg)
- Mar 6, 2022
- 2 min
An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-III
Highlights of Part-II HTML and CSS are parsed to DOM and CSSOM respectively DOM and CSSOM get mixed up in the process called rendering...
![An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-II](https://static.wixstatic.com/media/1f7141_0b188c0410474e23a6bbe2b68b5fee83~mv2.jpg/v1/fill/w_454,h_341,fp_0.50_0.50,q_90,enc_auto/1f7141_0b188c0410474e23a6bbe2b68b5fee83~mv2.jpg)
- Mar 2, 2022
- 2 min
An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-II
Highlights of Part-I Browsers parse our HTML code into a DOM tree This happens because browsers understand only DOM DOM basically has 4...
![An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-I](https://static.wixstatic.com/media/1f7141_9d5928ee06274356b69b6fcf64d9edbe~mv2.png/v1/fill/w_454,h_341,fp_0.50_0.50,q_95,enc_auto/1f7141_9d5928ee06274356b69b6fcf64d9edbe~mv2.png)
- Feb 27, 2022
- 2 min
An investigative guide to React JS[DOM, Virtual DOM and JSX] Part-I
Prerequisites Basics of HTML,CSS and Javascript(ECMA) Why React? What is the need for React? 'Necessity is the mother of invention' if so...
bottom of page