Senior Frontend - javascript, html, css

Ищу желающих выполнять задачи с помощью ИИ! Работа полностью на удаленке с зп до 150 000 рублей в месяц. Без опыта, нужен только телефон, занятость 3-6 часов в день. Всему обучат на бесплатном курсе и после возьму на работу: ✅ 3 дня уроков по 30 минут ✅ Домашки с проверкой и оплатой бонусами ✅ Плачу 10 тыс за каждую выполненную домашку Все кто пройдет курс, получат сертификат от школы с образовательной лицензией. ⚡ Набор заканчивается завтра. 👍 Для регистрации жмите кнопку "Зарегистрироваться": Зарегистрироваться #реклама 16+ ganstaagency.com О рекламодателе

Upload UI Это карточки, сообщающие о состоянии загрузки файла, свёрстанные на HTML и SCSS. 👉 @seniorFront

Издержки профессии 👉 @seniorFront

Password Strength Checker В этом видео создается анимированное поле ввода пароля с проверкой на надежность на чистом JS. 👉 @seniorFront

light and shadow Положение курсора отслеживается в JS и исходя из него задаются значения CSS переменным. 👉 @seniorFront

Следи за собой. Риски общения с ИИ За последние пять лет ИИ прошел путь от интересных экспериментов избранных инженеров и ученых, до фактически универсального помощника в каждом доме и офисе. К чему мы пришли: - Теперь ИИ рабочий интерфейс почти для всего. Уже не стоит вопрос — справится ли, скорее заказчики спрашивают: а почему в этом проекте до сих пор нет ИИ? - Мы получили возможность работать быстрее. ИИ выполняет роли программиста, писателя, творческого помощника, секретарь для формализации концепций и планов, ученый-энциклопедист, врач, художник, переводчик, эмпатичный собеседник, психотерапевт, специалист поддержки и многое другое. - И как всегда ложка дегтя. Появился и всерьез обсуждается незаявленный побочный эффект — психокогнитивная зависимость. Эту статью я написал на основе личного опыта и опыта общения с увлеченными пользователями ИИ. Большая часть указанных рисков подтверждается научными исследованиями. 👉 @seniorFront

​Собеседования в IT превратились в экзамены, которые с трудом проходят даже опытные разработчики Я нанимаю людей 10+ лет и верю, что в людях можно разглядеть потенциал. Мои команды решают сложные задачи, и 9 из 10 наймов — успешны. Провал? Обычно из-за неучтённого бэкграунда или усталости кандидата. Как было раньше 10 лет назад я стал тимлидом и участвовал в наймах. Техдиректор требовал фундаментальных знаний Computer Science: алгоритмы, задачки, лайвкодинг (да, на ноутбуке или даже бумаге!). Собеседования напоминали экзамены: кандидат отвечал, а "препод" оценивал. Люди краснели, терялись, диалог скатывался в "родитель–ребёнок". Мне это не нравилось, но казалось, что так "прощупывают" границы знаний. Новый подход Позже я изменил подход. Вместо олимпиадных задач и "круглых люков" начал говорить о реальных задачах компании и спрашивать, что интересно кандидату. Я делился, а не экзаменовал. Люди раскрывались, сами рассказывали о пробелах. Такой подход помогал собрать крутые команды. Позже я узнал про принцип "я нормальный — ты нормальный". Оказалось, "экзамены" часто идут от страха, что кандидат окажется "слишком скилловым". Проблема современных собеседований IT-индустрия изменилась. Собесы усложняют: лайвкодинг, задачи с LeetCode, вопросы, не связанные с реальными кейсами. Опытный разработчик может не пройти, если не решит задачу мгновенно. Это демотивирует. Коллега с 10+ годами опыта жаловался: его проекты игнорируют, а HR задают вопросы про RPS, не учитывая кейсы. Собесы стали экзаменами, где ошибка "обнуляет" опыт. Что делать? Фундамент важен, но важнее — живой ум и реальные результаты. Работодателям стоит: - Чётко описывать требования в вакансиях (RPS, технологии, задачи). - Сократить этапы до 1–2 встреч. Больше — трата времени. - Смотреть на кейсы, а не на скорость решения задачек. Корпорации, вероятно, продолжат закручивать гайки, чтобы кандидат "ценил" работу. Но я верю: найм — это диалог, а не экзамен. Надеюсь, мой опыт поможет пересмотреть подход к собеседованиям. 👉 @seniorFront

Как зарабатывать удаленно с нейросетями? Присоединяйся! Подпишись прямо сейчас, чтобы не потерять: Свежие обзоры нейросетей, которые реально работают — без лишнего хайпа и воды, только проверенная информация, которую можно использовать для заработка. Пошаговые видео-уроки, после которых всё станет понятно — научитесь быстро осваивать новые профессии и автоматизировать рутинные задачи. Как находить клиентов, готовых платить дорого — секреты эффективного поиска заказов и построения стабильного потока заказов. Автоматизация работы — научитесь выполнять 2-часовую работу за 20 минут без выгорания, автоматизируя рутину с помощью нейросетей. Дополнительный доход — узнаете, как зарабатывать в свободное время, не уходя с основной работы или учебы. Подписаться #реклама 16+ О рекламодателе

Falling Text with Gravity Реализовано и анимировано с использованием библиотеки gsap. 👉 @seniorFront

Каким образом html превращается в страницу ? Процесс преобразования HTML-документа в веб-страницу, отображаемую в браузере, включает несколько ключевых этапов. Рассмотрим этот процесс шаг за шагом. 1. Загрузка HTML-документа Когда пользователь вводит URL в адресную строку браузера или переходит по ссылке, происходит запрос HTTP (или HTTPS) к серверу, на котором находится веб-страница. Сервер отвечает на этот запрос, отправляя HTML-документ. 2. Парсинг HTML-документа Браузер получает HTML-документ и начинает его парсинг. Это включает в себя разбор HTML-кода и создание структуры данных, известной как DOM (Document Object Model). 3. Построение DOM-дерева Браузер читает HTML-документ построчно, создавая узлы для каждого элемента и текста. Эти узлы образуют DOM-дерево, которое представляет структуру веб-страницы. Каждый элемент HTML превращается в объект, который браузер может использовать для дальнейших операций. 4. Загрузка внешних ресурсов В процессе парсинга HTML браузер также обнаруживает ссылки на внешние ресурсы, такие как CSS-файлы, JavaScript-файлы, изображения, шрифты и другие ресурсы. Браузер отправляет дополнительные HTTP-запросы для загрузки этих ресурсов. 5. Применение CSS и построение CSSOM После загрузки CSS-файлов браузер парсит их и строит CSSOM (CSS Object Model) — объектную модель, представляющую стили, применяемые к элементам на странице. Затем браузер объединяет DOM и CSSOM для создания рендер-дерева (render tree), которое содержит видимые элементы страницы и их стили. 6. Расчет макета (layout) Браузер рассчитывает размеры и положение каждого элемента на странице, основываясь на рендер-дереве и правилах CSS. Этот процесс известен как layout или reflow. 7. Отрисовка (painting) На этапе отрисовки браузер берет рендер-дерево и начинает преобразовывать его в пиксели на экране. Этот процесс включает рисование каждого элемента, включая текст, цвета, изображения, границы и другие стили. 8. Выполнение JavaScript Если HTML-документ содержит теги <script> или ссылки на внешние JavaScript-файлы, браузер загружает и выполняет эти скрипты. JavaScript может изменять DOM, CSSOM и влиять на отрисовку страницы в реальном времени. 9. Обработка событий После первоначальной загрузки и отрисовки страницы браузер начинает обрабатывать события, такие как клики, ввод данных, перемещение мыши и другие взаимодействия пользователя. JavaScript-код может быть привязан к этим событиям, чтобы обеспечить динамическое поведение страницы. 👉 @seniorFront

«Великолепный» CSS. Коллекция странностей CSS, на которые я потратил кучу времени CSS часто преподносит сюрпризы, способные запутать даже опытных разработчиков. Я понимаю их раздражение. Тут всё закономерно. Однако, несмотря на потраченные нервы, мне нравится CSS. Именно поэтому мне хочется, чтобы разработчики тратили меньше времени на борьбу с ним. С этой целью я собрал ряд не самых очевидных моментов, которые в своё время ставили в тупик меня и моих коллег. 👉 @seniorFront

Convert A Hex String To RGB При работе со значениями цвета иногда может быть полезно извлечь отдельные значения красного, зеленого и синего (RGB) компонентов цвета. Реализуйте функцию, отвечающую этим требованиям: - Принимает в качестве параметра шестнадцатеричную цветовую строку без учета регистра (например, "#FF9933"или "#ff9933") . - Возвращает объект со структурой {r: 255, g: 153, b: 51}, где r , g и b находятся в диапазоне от 0 до 255. Примечание: ваша реализация не обязательно должна поддерживать сокращенную форму шестнадцатеричной записи (т.е. "#FFF") Пример:

"#FF9933" -->  {r: 255, g: 153, b: 51}
"#beaded" -->  {r:190, g:173, b:237}
"#000000" -->  {r:0, g:0, b:0}

👉 @seniorFront

Card Animations Showcase Реализовано несколько анимаций при помощи библиотеки gsap, между которыми можно переключаться с помощью табов. 👉 @seniorFront

Image Slider В этом видео создается бесконечный 3D слайдер на CSS и JS. 👉 @seniorFront

Запустите рекламу в телеграм-каналах с Яндекс Директом Перфоманс-реклама теперь в телеграм-каналах ⚡ Яндекс Директ знает, как привлечь целевую аудиторию 💰👌 Попробовать #реклама yandex.ru О рекламодателе

shadow Параметры тени изменяются через JS и зависят от положения курсора. 👉 @seniorFront

REKONFA Live 6 ноября приглашаем всех, кто имеет отношение к маркетингу и рекламным технологиям, обсудить рынок, тренды, вызовы и их решения. С докладами на актуальные темы выступят лидеры индустрии и медийные спикеры. Принять участие можно офлайн и онлайн. Мероприятие бесплатное, нужно только зарегистрироваться. Зарегистрироваться #реклама 18+ ya.rekonfa.ru О рекламодателе

CSS Sprite-Based Flip Carouse Карусель в виде книги, реализованная на чистом CSS при помощи CSS Scroll-Timeline 👉 @seniorFront

Мы? Мы! 👉 @seniorFront