ITs. Web Space

18/12/2022

How to pass data to other pages (in URL) in React JS?
In this video, We learned how to pass data to a URL in React JS.

With Dynamic routing, we can create Dynamic routes or URL Parameters in React JS, use route changes as the conditions, and render components without changing the layouts or pages completely. And by using the react-router dom's useParams() hook, we have access to the route parameters of our applications.

https://youtu.be/21G3lnmZ8RE

this video, We learned how to pass data to a URL in React JS.With Dynamic routing, we can create Dynamic routes...

05/12/2022

What does useEffect do? By using this Hook, you tell React that your component needs to do something after render. React will remember the function you passed (we’ll refer to it as our “effect”), and call it later after performing the DOM updates. In this effect, we set the document title, but we could also perform data fetching or call some other imperative API.

Hooks are a new addition in React 16.8. They let you use state and other React features without writing a class.

https://youtu.be/4NfVSltLKC8

In this video, we are learning how to use useEffect hook in react js.What does useEffect do? By using this Hook, you tell React...

25/09/2022

In this video, we are learning how to use External Stylesheet in react js.

You can create a new CSS file in your project directory and add your CSS inside it. You can import it into your component, class, or React JS page. The following code is used to import an external CSS stylesheet.

https://youtu.be/_dddDSQk4mY

In this video, we are learning how to use External Stylesheet in react js.You can create a new CSS file in your project directory and ...

18/09/2022

What is Props and State in React Js?

To get the jargon out of the way, “props” is short for “properties” so nothing particularly fancy there. And like props, state holds information about the component. However, the kind of information and how it is handled are different.

props (short for “properties”) and state are both plain JavaScript objects. While both hold information that influences the output of render, they are different in one important way: props get passed to the component (similar to function parameters) whereas state is managed within the component (similar to variables declared within a function).

https://youtu.be/cdCs0hJAaU8

this video, we are learning about props and states in react js.To get the jargon out of the way, “props” is short fo...

28/08/2022

I am setting up WordPress and React Js in our localhost so we can start learning Headless WordPress with React Js join me on this journey of mine of learning React Js.

React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes

Declarative views make your code more predictable and easier to debug.

https://youtu.be/5ALhozr0lbw

In this video, We are setting up WordPress and React Js in our localhost so we can start learning Headless WordPress with R...

10/07/2022

The rest parameter is introduced in ECMAScript 2015 or ES6, which improves the ability to handle parameters. The rest parameter allows us to represent an indefinite number of arguments as an array. By using the rest parameter, a function can be called with any number of arguments.

https://youtube.com/shorts/RqO5g6xQi5s

The rest parameter is introduced in ECMAScript 2015 or ES6, which improves the ability to handle parameters. The rest ...

10/07/2022

Arrow functions are introduced in ES6, which provides you a more accurate way to write the functions in JavaScript. They allow us to write smaller function syntax. Arrow functions make your code more readable and structured.

https://youtube.com/shorts/ymhGEUoaUSY

Arrow functions are introduced in ES6, which provides you a more accurate way to write the functions in JavaScript. T...

10/07/2022

The defer attribute is a boolean attribute. If the defer attribute is set, it specifies that the script is downloaded in parallel to parsing the page, and executed after the page has finished parsing.
Note: The defer attribute is only for external scripts (should only be used if the src attribute is present).

https://youtube.com/shorts/gNNppdXDk6M

The defer attribute is a boolean attribute. If the defer attribute is set, it specifies that the script is downloaded i...

03/07/2022

Always declare JavaScript variables with var, let, or const.
The var keyword is used in all JavaScript code from 1995 to 2015.
The let and const keywords were added to JavaScript in 2015.
If you want your code to run in an older browser, you must use var.

If you want a general rule: always declare variables with const.
If you think the value of the variable can change, use let.

26/03/2022

In this video, I explained how you could add custom fields on Woocommerce Simple product and display it on the Single Product page.

WooCommerce product page has a predetermined structure that shows product details in a fixed order. Generally, WooCommerce store themes do change this situation slightly by modifying the order of the information, but things do stay the same more or less.

Even though some plugins can help you, finding the one that has all the features you want can be a long process. So if you have some basic developer skills, an excellent option is to edit the WooCommerce product page programmatically. Not only can you avoid installing any third-party tools but you’ll also have much more flexibility to customize anything you want.

https://www.youtube.com/watch?v=3R1psnCWCmI

In this video, I explained how you could add custom fields on Woocommerce Simple product and display it on the Single Product page.WooCommerce product page h...

12/03/2022

In this video, I explained how you could develop a WooCommerce product slider on your own! We will set up the slider in multiple videos. In this video, I calculated the discount percentage of grouped products to get the max discount also I get the "Add to Wishlist" button working.

In this series, we are creating a custom plugin to have features like Product slider, Variation product custom data, Cart page Coupon list, and wherever else we come up with. So do subscribe for more interesting coding stuff.

https://youtu.be/jdDuIwiaukI

In this video, I explained how you could develop a WooCommerce product slider on your own! We will set up the slider in multiple videos. In this video, I cal...

05/03/2022

In this video, I explained how you could develop a WooCommerce product slider on your own! We will setup up the slider in multiple videos. In this video, I get the product price HTML, checked if the product is on sale, and calculated the discount percentage for Simple and Variation products.

In this series, we are creating a custom plugin to have features like Product slider, Variation product custom data, Cart page Coupon list, and wherever else we come up with. So do subscribe for more interesting coding stuff.

Product Sliders can make your shop or site show a large number of products in a tidy and professional way keeping your site fast. And it makes your site look much more professional, clean and sharp in your potential customers’ eyes.

A product slider is one of the best ways to highlight specific products and, if you are able to put in strategic spots, it will allow you to increase conversions and purchases in your shop.

Video: https://youtu.be/r_1QY8pQ0P0

In this video, I explained how you could develop a WooCommerce product slider on your own! We will setup up the slider in multiple videos. In this video, I c...