How to Upload Images with JavaScript ( The Ultimate Guide ) - JavaScript - Part #1

Подписаться 15 тыс.

Просмотров 19 тыс.

50% 1

How to upload and preview images with JavaScript? This image uploading guide teaches you everything you need to know about uploading images with JavaScript. I broke the process down into three parts.
Part 1: How to upload and preview images on the frontend.
Part 2: How to save the images in a server file system with Node.js and Multer.
Part 3: How to save the images in a MySQL database / Amazon Web Services (AWS) S3.
Codepen for CSS:
codepen.io/miguelznunez/pen/G...
Prefer to read the ultimate JavaScript image uploading guide?
/ how-to-upload-and-disp...
Follow my blog:
/ miguelznunez
Like the intro to my video? Learn how to make one:
paykstrt.com/11298/66358
Email : mignunez@csumb.edu
Medium : / miguelznunez
Codepen : codepen.io/miguelznunez
GitHub : github.com/miguelznunez

Опубликовано:

31 май 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 18

@GoobNoob Год назад

Good video brother.

@mangeshkalmegh648 10 месяцев назад

great video👍👍buddy

@YDDRGtHdDKS75Xw Год назад

Yes I will do this too.

@RaddyDev Год назад

When you delete a file, maybe you can have the 'delete' button switch to a different colour and say 'update' instead. Regadless, this is awesome. Looking forward to the next videos

@codefoxx Год назад

Good constructive criticism, Raddy. Would love to collab with you sometime in the future on some RU-vid stuff

@RaddyDev Год назад

@@codefoxx I am up for it!

@timokimo8206 Год назад

Thanks🌹

@codefoxx Год назад

Absolutely

@deepestbars3889 Год назад

Awesome Tutorial, Thank you so much. I noticed that after the "let queuedImagesArray = []," array you created, the remaining variables such as "savedForm, queuedForm, savedDiv etc." do not have the let, var or const keyword. I want to know if they are also part of the "queuedImageArray" or we can also create variable without using the "let, var or const" keyword. Thank you

@codefoxx Год назад

You can create a let, const, or var keyword for each of them if you'd like or you can do it the way I did it. The way I did it just avoids having to create a "let" keyword for each of them, so it basically just saves you from repeating yourself.

@beargrill7564 7 месяцев назад

I keep getting this error, and it doesn`t show any images.. Why it can happen? Arleady wasted hours trying to fix it.. Uncaught TypeError: Failed to execute 'createObjectURL' on 'URL': Overload resolution failed. at scripts.js:86:34 at Array.forEach () at displayImages (scripts.js:84:16) at HTMLInputElement. (scripts.js:79:3)

@armanmalik2908 6 месяцев назад

👍👍👍👍👍👍

@md.mahidunnobi4739 11 месяцев назад

It would be great content if you did not type all the code simultaneously. You should type a bunch of code and show us the result of it in the browser. But you are writing all the code at a time and showing us the final result. Which I don't think really helps the beginners.