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

Формошлёп (https://t.me/+hHvPeh2euSY5MGJi) — сотни хаков для фронтендеров в одном месте Никакой скучной теории, воды и прочей шляпы, только практические примеры, которые работают. 👉 Подписывайся на @frontbox — стань тем, кто знает, как решить проблему, пока остальные ищут ответ на Stack Overflow.

🕵️‍♂️ Pinkerton — инструмент для поиска секретов в JavaScript Это мощный open-source сканер, созданный для автоматического поиска чувствительных данных (API-ключей, токенов, паролей) в JavaScript-файлах на веб-сайтах. 🔍 Что делает Pinkerton: • Краулит сайт, собирая все JS-файлы • Ищет утечки с помощью регулярных выражений • Находит API-ключи, JWT, access tokens, пароли и многое другое ⚙️ Как использовать: git clone https://github.com/000pp/Pinkerton.git pip3 install -r requirements.txt python3 main.py -u https://example.com 🧠 Кому подойдёт: • Пентестерам и багхантером • DevSecOps специалистам • Любому, кто хочет проверить, не утекли ли ключи в фронт-коде 📦 Поддерживается в BlackArch Linux 🔓 Лицензия: MIT 🌟 300+ звёзд на GitHub 💬 Pinkerton — отличный инструмент для тех, кто хочет автоматизировать безопасность своего фронта и не допустить утечек ключей. #pentest #security #bugbounty #opensource #js #infosec #Pinkerton https://github.com/000pp/Pinkerton

Минималистичный hover-эффект для ссылок навигации #hover #меню #ссылки https://codepen.io/jstn/pen/mdoOZJ

💻 Хотите стать востребованным Fullstack-разработчиком? Откройте для себя новые возможности с обучением OTUS! ❗️На курсе вы научитесь всему, что нужно для того, чтобы стать универсальным разработчиком, который создает как фронтенд, так и серверную часть веб-приложений. Освоите: HTML, CSS, JavaScript, React, TypeScript, Node.js и многое другое. Пройдете все этапы разработки, от верстки до серверной настройки. По окончании программы у вас будет: ✅ 3 реальных проекта в портфолио ✅ Навыки, необходимые для работы в крупных компаниях ✅ Готовность к собеседованиям ✅ Уверенное понимание процесса разработки ✅ Возможность участвовать в интересных проектах ➡️ Оставьте заявку прямо сейчас: https://clck.ru/3MDcRF Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru

Минималистичная и красивая анимация для ненайденной страницы #страница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)