React 18 Tutorial - Local Images Source Folder

React 18 Tutorial
Episode 35 - Local Images Source Folder

Entire Playlist

Source Code

[franklinmayoyo]

This is like charity. I can't explain how you're helping me in building a career. I send you a big heart ❤️

[alisajadahmadi]

Me: What is the best course for React in Youtube?
ChatGPT, Google: Of course Coding Addict

[boxhe]

ChatGPT: Both webpack and Vite support the ability to process static assets such as images during the build process, and both can be configured to handle imported images in a similar way.

When you import an image using the import statement in a JavaScript file, Vite (and webpack) will handle the file and emit the necessary output files based on the configuration that is set up in the Vite (or webpack) config.

For example, in Vite, you can use the vite-plugin-image plugin to optimize and process image imports in your application. This plugin automatically optimizes and resizes the images for different screen sizes and devices, and can also generate WebP versions of the images for browsers that support it.

Similarly, in webpack, you can use the file-loader or url-loader to handle imported images and output the necessary files.

Overall, the idea of importing images in a JavaScript file can be a useful technique for optimizing and processing images in your application, regardless of the build tool you are using.