The latest articles on DEV Community by Aaron Nevalinz (@nevalinz). https://dev.to/nevalinz https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F921017%2F06f10500-a4ec-4e61-baaf-413a511623a6.png https://dev.to/nevalinz en Aaron Nevalinz Tue, 20 Feb 2024 21:41:20 +0000 https://dev.to/nevalinz/the-day-you-became-a-better-react-dev-what-is-react-5gna https://dev.to/nevalinz/the-day-you-became-a-better-react-dev-what-is-react-5gna <p>React is a JavaScript library for building user interfaces out of individual components, and it is designed to let you seamlessly combine components.</p> <p>For instance, a navigation bar of a website is a standalone component, and then the hero’s section of a web page could also be a standalone component. These two components can be combined to make a web-page.</p> <p>React is used to develop single page applications, and react is majorly concerned with the user interface and rendering of components to the virtual DOM. The advantage of react is that it only renders once, and only re-renders only those parts of the page that need be changed. This makes the website fast, user-friendly, and easily maintainable.</p> <p>If we go history, React was initially released in May of 2013 and was authored by a guy called; Jordan Walke. Since then React has gained a lot of popularity and has a big community that supports and maintains it in partnership with META.</p> <p>Written in Javascript, react was developed to be used on facebook social media platform and later adopted by instagram too.</p> react frontend webdev javascript Aaron Nevalinz Fri, 29 Dec 2023 08:02:29 +0000 https://dev.to/nevalinz/the-day-you-understood-useselector-and-usedispatch-a-better-redux-developer-1kcm https://dev.to/nevalinz/the-day-you-understood-useselector-and-usedispatch-a-better-redux-developer-1kcm <p>Absolutely! Imagine you have a big toy box with lots of different toys inside it. Now, you want to play with your favorite toy car, but you don’t want to go through the entire box to find it every time you play.</p> <p>useSelector is like having a magical pair of glasses that lets you see exactly where your favorite toy car is without rummaging through the whole box every time. With these glasses, you can just look inside the box and pick your favorite toy car directly.</p> <p>In the world of coding, your toys are like pieces of information or data. Sometimes, your React components need specific pieces of data from a big collection of data. useSelector is like those magical glasses, helping your components see and use the exact piece of data they need, making everything faster and easier, just like finding your favorite toy! 🚗✨</p> <p>Whilst for the useSelector, let’s continue with our toy box analogy.</p> <p>Imagine you have a magic wand. Now, this magic wand doesn’t just do tricks; it can also send messages. Sometimes, you want your toys to do something special, like transform or change color, but you don’t want to touch them directly every time.</p> <p>useDispatch is like using your magic wand to send a special message to a specific toy in your toy box. You wave your wand and say, "Hey, toy number 5, turn into a robot!" And magically, toy number 5 transforms into a cool robot without you having to touch it physically.</p> <p>In the world of coding, your toys are like pieces of data, and sometimes you want to change or update them. useDispatch is your magic wand; it helps you send a message (an action) to a specific part of your application (a reducer) and make something happen without directly changing the data yourself. It keeps your code organized and your toys (data) can do exciting things without getting all messy! 🪄✨</p> <p>Hope this analogy was helpful, What do you think?</p> redux react statemanagement webdev