JavaScript задачи с собеседований

Минималистичная и красивая анимация для ненайденной страницы #страница404 https://codepen.io/digilou/pen/vzWjJo

Как получить карьерный буст и MacBook за подписку В интернете полно курсов по самопиару и карьерному развитию в IT, но все они не сравнятся с реальными кейсами от действующих практиков. Не нужно покупать дорогие консультации, чтобы перенять чужой опыт — достаточно подписаться на папку, где собралось более 30 лучших экспертов из IT и digital Это люди, которые не только построили успешную карьеру с нуля, но и основали собственные компании. Они собрались, чтобы прокачать тебя в маркетинге и дизайне, а ещё провести розыгрыш. Подпишись на них и получи один из 3 призов: 🥇Главный приз — MacBook Air (M2) 🥈2 место: Яндекс Станция Лайт 2 🥉3 место: Наушники HUAWEI Freebuds 5i Участвуешь? 1. Подпишись на папку 2. Подтверди участие в боте 19 июня в прямом эфире опубликуем итоги розыгрыша!

🌐 Руководство: Как создать онлайн-конвертер изображений в PDF с помощью HTML, CSS, JS и NodeJS! 🔗 Ссылка: *клик* (https://www.freecodecamp.org/news/build-an-online-image-to-pdf-converter-with-html-css-js-nodejs/)

🎭 Maska — легковесная библиотека для масок ввода. Инструмент весит всего 3КБ кода, но с поддержкой кастомных токенов, динамических масок и даже специального режима для денежных значений. Библиотека работает как с нативными input, так и с кастомными компонентами, а ещё поддерживает Vue, Alpine.js и Svelte из коробки. 🤖 GitHub (https://github.com/beholdr/maska)

Не просто кнопка "Загрузить": Секреты работы с файлами в React 🎓 19 мая в 20:00 — бесплатный вебинар для разработчиков, которые хотят делать удобную и безопасную загрузку файлов в React-приложениях. Что покажем: — Drag & Drop, предпросмотр, валидация — всё, что ждали от UX; — Обработка PDF, Excel и изображений прямо в браузере; — Как не «положить» интерфейс при загрузке тяжёлых файлов; — Защита от XSS, проверка MIME-типов и другие нюансы безопасности. 📌 Для фронтендеров и fullstack-разработчиков, которым важна клиентская оптимизация. В программе — реальные примеры кода, которые можно сразу использовать. Урок пройдет в преддверии старта курса «React.js Developer». Каждый участник вебинара получит скидку на обучение. Регистрация: https://clck.ru/3M4cso Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576

🚀 Nova — новый движок JavaScript/Wasбm на Rust. Этот экспериментальный проект пытается переосмыслить архитектуру JS-движков через призму data-oriented design. Вместо классических указателей Nova использует индексы и векторы, чтобы минимизировать накладные расходы и улучшить кэширование. Пока движок далёк от готовности, но подход к разработке вызывает интерес, например safepoint garbage collector, построенный на особенностях системы заимствований Rust — это попытка максимально приблизить структуру кода к ECMAScript-спецификации. 🤖 GitHub (https://github.com/trynova/nova)

Плавное выделение карточек при клике на них, а также при переходе с помощью клавиши Tab. #формы #переключатели #чекбоксы #карточки https://codepen.io/havardob/pen/BapJYMg

🔥 В Qwen теперь появились песочницы для написания и запуска программного кода. Web Dev — новый инструмент для создания готовых фронтенд-страниц и приложений в Qwen Chat. 🎨 Просто напишите: «Создай сайт как ...» — и всё готово! Вы получаете код приложения. Мы сгенерировали несколько лендингов и простую игру для проверки — система хорошо понимает запросы и работает быстро. ➡️ Попробовать: https://chat.qwen.ai/?inputFeature=web_dev @ai_machinelearning_big_data #qwen #codegenerator #online

Встречайте Vue DnD Kit — новую мощную библиотеку для Vue 3, предназначенную для реализации функционала drag-and-drop! Она обеспечивает высокую производительность, гибкость и полную поддержку управления с клавиатуры, мобильных устройств, а также позволяет настраивать под любые задачи. Этот инструмент основан на композабельных функциях Vue, что делает его отличным выбором для создания сложных и интерактивных интерфейсов. Документация уже доступна по адресу (https://zizigy.github.io/vue-dnd-kit/), а в ближайшем будущем планируется выпуск новых пакетов и интеграция с DevTools. #Vue3 #DragAndDrop #Frontend #WebDev https://habr.com/ru/news/902384/

Pokemon Slide Gallery. Анимация выполнена без применения JavaScript. Используются только HTML и CSS. Переключение осуществляется с помощью радио-кнопок. https://codepen.io/cbolson/pen/raBJWOJ

🔌 Node-OPCUA — это промышленный стандарт OPC UA, выполненный для платформы Node.js. Данный набор инструментов реализует протокол OPC UA непосредственно в Node.js и в браузере, предоставляя интерфейсы на TypeScript для взаимодействия с реальным оборудованием. Данный инструмент особенно популярен в системах SCADA и в промышленной автоматизации. Он поддерживает создание как OPC-серверов, так и клиентов, включая сложные варианты подписки на данные и защищённое соединение. 🤖 GitHub (https://github.com/SciSharp/BotSharp)

Создавать 3D-модели прямо в браузере стало возможно за считанные секунды — появилась мощная программа для дизайнеров, художников и разработчиков игр. Она работает на основе текстового описания: вводишь идею — и получаешь готовую модель, которую можно сразу же редактировать. Поддерживаются все популярные форматы, а также есть большая библиотека шаблонов для вдохновения. Доступно бесплатно — пользуйтесь (https://3daily.ai/).

🌍 FBT — это фреймворк для интернационализации от Facebook, который не создает лишних сложностей. Этот инструмент интегрируется непосредственно в JSX с помощью специальных тегов и функции fbt(), автоматически извлекая строки для перевода на этапе сборки. Проект уделяет большое внимание грамматической правильности: система учитывает род, число и другие особенности языка без необходимости вручную описывать все варианты. В основе лежит преобразование кода с помощью Babel-плагинов, а готовые переводы загружаются во время выполнения. 🤖 GitHub (https://github.com/facebook/fbt)

👩‍💻 Как превратить веб-разработку на JavaScript в свою суперсилу? ✔️ Научиться создавать web-приложения на последних версиях React.js, Vue.js или Angular с серверной частью на Node.js. ✔️ Освоить Webpack, PostgreSQL, современные паттерны проектирования, DOM API и Ajax. ✔️ Научиться проектировать и организовывать контроль состояния и тестирование серверных и клиентских приложений. И все это всего за 5 месяцев на онлайн-курсе «JavaScript Developer. Professional» от OTUS. Под руководством опытных экспертов вы не только изучите лучшие инструменты и практики, но и создадите сильные проекты для портфолио. ➡️ Пройдите короткий тест, чтобы получить персональную консультацию менеджера и специальную цену на курс: https://clck.ru/3LmLqg Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576

‍📱 expo-app-template — это современный шаблон для React Native и Expo. [expo-app-template](https://github.com/nkzw-tech/expo-app-template) от nkzw-tech представляет собой продвинутый шаблон, который позволяет быстро начать разработку мобильных приложений на React Native с использованием Expo и TypeScript. 🚀 Ключевые особенности: - Современные технологии: Expo 53, React Native 0.79 с новой архитектурой. - Навигация: Expo Router для удобного перемещения по приложению. - Стилизация: Tailwind CSS с помощью NativeWind. - Встроенные библиотеки: - @gorhom/bottom-sheet для модальных окон. - Legend List для работы со списками. - react-native-svg и react-native-svg-transformer. - expo-linear-gradient для создания градиентов. - Международная поддержка через fbtee. - Поддержка TypeScript и ESM. - Управление пакетами с помощью pnpm. - React Compiler для улучшения производительности. 🛠️ Как установить и запустить: Требования: - Node.js версии 22 и выше. - pnpm версии 10 и выше. - Cocoapods для iOS. Для установки выполните команду: pnpm install && pnpm dev:setup ▪ Репозиторий на Github: https://github.com/nkzw-tech/expo-app-template

🖌️ LUME — это инструмент для создания 2D/3D-интерфейсов на HTML. Он превращает стандартные HTML-элементы в полноценные графические объекты, начиная от CSS3D-преобразований и заканчивая рендерингом с помощью WebGL. Внутри используется AssemblyScript для компиляции в WebAssembly, что обеспечивает стабильную производительность. В примерах даже есть шаблон для FPS-игры на этом движке. 🤖 GitHub (https://github.com/lume/lume)

📝 OpenSign – это инструмент с открытым исходным кодом, который предлагает полный набор возможностей для безопасного подписания документов. Проект предоставляет не просто функцию добавления подписи в PDF, а целый рабочий процесс: он поддерживает множество подписантов, предлагает шаблоны документов, OTP-верификацию и даже возможность отклонения подписания с комментарием. При этом OpenSign не требует подписок и скрытых платежей, что позволяет развернуть систему как локально, так и в облаке. 🤖 GitHub (https://github.com/OpenSignLabs/OpenSign)

Пример анимированного подчеркивания с градиентной заливкой. #ссылки #hover https://codepen.io/cultofgeek/pen/RJRdVO

📊 Phantomas — это мощный инструмент для анализа производительности веб-сайтов. Он собирает множество метрик, включая количество запросов, сложные CSS-селекторы и события jQuery. Проект имеет модульную архитектуру, что позволяет легко добавлять новые функции. Его можно запустить с помощью npm, Docker или как модуль в проекте на Node.js. Кроме того, инструмент позволяет эмулировать мобильные устройства и даже добавлять кастомные метрики прямо в код страницы. 🤖 GitHub (https://github.com/macbre/phantomas)

Хотите собрать первое приложение на React за 60 минут? Присоединяйтесь к открытому уроку от OTUS. Без скучных теорий и банальных todo-листов: только практика, код и живое общение. Вы узнаете, зачем нужны хуки и как компоненты делают интерфейс «живым», и самостоятельно создадите интерактивную игру. Урок пройдет в преддверии старта курса «React.js Developer». Каждый участник вебинара получит скидку на обучение. Встречаемся 7 мая в 20:00 МСК, регистрируйтесь прямо сейчас, чтобы не пропустить: https://clck.ru/3LeW4V Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576