Предпросмотр изображения при загрузке файла!

Привет! В этом гайде создаём простой компонент загрузки изображений с предпросмотром, проверкой типа файла и ограничением по размеру.

Ключевые моменты:

• HTML: файловый input, зона загрузки и блок предпросмотра.

• CSS: центрирование, карточный UI, аккуратные тени и отступы.

• JS: обработка выбора файла, проверка MIME-типа и размера, работа с Object URL.

Элемент отлично подойдёт для аватаров, профилей пользователей, форм обратной связи, карточек товаров и любых интерфейсов, где требуется наглядная загрузка изображений.

Code Ready | #гайд