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

Полезный сервис для прокачки JavaScript — формат квестов и кода в одной геймифицированной платформе. Похоже на Codewars, но с вайбом мини-игры: Особенности: — Задания создают реальные пользователи — Пишешь JS прямо в браузере, сразу проверяется — Платформа open-source — можно форкнуть и сделать свою версию 🟣 Попробовать (https://jsdares.com/?)

🖥 Прокачай JavaScript без тонны скучных туториалов Опенсорсный челлендж на 30 дней (на самом деле более 120 😂) с понятным роадмапом и десятками проектов — от драм-машины и часов до Flappy Bird, 2048 и визуализации алгоритмов. Что внутри: - 30 стартовых задач + 96 продвинутых проектов с анимациями, играми и утилитами - Демо и полный исходник к каждому проекту - Мини-приложения: генератор паролей, погодный виджет, анимация частиц - Постепенный рост сложности — комфортно и новичкам, и прокачанным Как работать: 1. Иди по плану или выбирай интересные проекты 2. Разбирай код, переписывай и улучшай 3. Делай по 1 проекту в день — и уже через месяц увидишь результат Запускай челлендж сегодня — через 30 дней твой JavaScript будет на новом уровне. Начать учиться (https://30daysofjs.netlify.app/)

🌿 Tagify — удобный инструмент для превращения обычного поля ввода в компонент тегов с поддержкой React, Vue и Angular. Библиотека предлагает гибкую настройку, высокую производительность и компактный код. Она умеет работать с ванильным JS и популярными фреймворками, поддерживает валидацию, редактирование тегов и даже подгрузку предложений через AJAX. 🤖 GitHub (https://github.com/yairEO/tagify)

💎 RisuAI — кроссплатформенный клиент для общения с ИИ. Этот проект объединяет поддержку разных языковых моделей в одном интерфейсе с необычными функциями. Например, можно создавать групповые чаты с несколькими персонажами, добавлять эмоциональные изображения в диалоги и использовать TTS для озвучки ответов. Проект имеет встроенный редактор regex для кастомизации вывода моделей и система «Lorebook» для сохранения контекста беседы. Есть версии для веба, ПК и Docker. 🤖 GitHub (https://github.com/kwaroran/RisuAI)

London Tube Map - Navigation Bar Concept Концепция панели навигации в виде схемы лондонского метро. https://codepen.io/MrDarrenGriffin/details/gOZWmYB

🧮 bignumber.js — библиотека для работы с числами произвольной точности в JavaScript. Она поддерживает как десятичные, так и недесятичные числа, предлагая полный набор арифметических операций без потери точности. Проект выделяется простым API, компактным размером и отсутствием зависимостей. Он особенно полезен в финансовых расчётах, криптографии и научных вычислениях, где важна точность. Библиотека работает даже в старых браузерах, так как использует только возможности ES3. 🤖 GitHub (https://github.com/MikeMcl/bignumber.js)

📦 Carbon Design System — дизайн-система от IBM с готовыми компонентами для React, Angular, Vue и Svelte. Проект предлагает не просто UI-кит, а полноценную экосистему: от цветовых палитр и типографики до адаптивной сетки и анимаций. Система обладает модульностью. Можно использовать только нужные части через отдельные npm-пакеты вроде @carbon/icons или @carbon/react. Всё собрано по Atomic Design, а документация объясняет не только как работает определенный компонент, но и почему именно так, с акцентом на доступность и UX-логику. 🤖 GitHub (https://github.com/carbon-design-system/carbon)

⌨️ Хотите научиться создавать полноценные API-серверы с использованием Node.js и TypeScript? Приглашаем на открытый урок «Как создать API-сервер с TypeScript и Node.js». (https://otus.pw/Bo2Z/?erid=2W5zFJVQFPN) 🗓 4 августа в 20:00 МСК 🆓 Бесплатно. Урок в рамках старта курса «Node.js Developer». На открытом уроке мы покажем, как быстро настроить сервер с помощью Express, создать маршруты для работы с данными и обрабатывать запросы от клиентов. Вы освоите основы TypeScript и API-разработки, получите знания для работы с типами данных и ошибок. 🎯 Погрузитесь в мир востребованной backend-разработки: создайте API-сервер, научитесь писать чистый и безопасный код и откройте для себя возможности Node.js. 🔗 Ссылка на регистрацию: https://otus.pw/Bo2Z/ (https://otus.pw/Bo2Z/?erid=2W5zFJVQFPN)

🔺 Delaunator — молниеносная триангуляция Делоне на JavaScript. Библиотека выполняет разбиение 2D-точек на треугольники с впечатляющей скоростью — обрабатывает миллион точек за секунду. Основной алгоритм основан на оптимизированных sweep-line методах из научных работ 2010-2013 годов. Инструмент имеет компактные структуры данных (Uint32Array для треугольников, Int32Array для рёбер), минимизирующие нагрузку на память. Поддерживает дегенеративные случаи через robust-predicates и обновление триангуляции на лету. 🤖 GitHub (https://github.com/mapbox/delaunator)

Совет по CSS 💡 Используйте табличные цифры для отображения таймеров ✅ https://www.codewithshripal.com/playground/css/use-tabular-number-for-timers

🌳 Fancytree — проверенная временем JavaScript-библиотека для создания интерактивных деревьев с поддержкой редактирования, drag'n'drop и ленивой загрузки. Хотя проект перешёл в режим поддержки, он остаётся стабильным решением для таблиц с иерархией и файловых менеджеров. Интересно реализована модульная структура: можно подключать только нужные функции вроде фильтрации или чекбоксов. Для современных проектов автор рекомендует наследника — Wunderbaum, но Fancytree всё ещё активно используют в legacy-системах. 🤖 GitHub (https://github.com/mar10/fancytree)

⏳ AWS Amplify — библиотека для фронтенд- и мобильных разработчиков, упрощающая интеграцию приложений с облачными сервисами AWS. Она предлагает готовые решения для аутентификации, хранения данных, аналитики, API и даже машинного обучения, скрывая сложность бэкенд-настроек за простым JavaScript-интерфейсом. Хотя инструмент заточен под AWS, архитектура позволяет подключать и кастомные бэкенды. Amplify особенно удобен для React Native и веб-приложений, например, можно добавить авторизацию через Cognito или работу с S3 буквально парой строк кода. 🤖 GitHub (https://github.com/aws-amplify/amplify-js)

✔️ Card Mouse Hover Effect Карточки с интересным эффектом при наведении. Сделаны на CSS и JavaScript. Открыть код (https://codepen.io/yudizsolutions/pen/wvZEeNE) https://telegra.ph/file/2f96c1157916fe57d4fe1.mp4

🧠 HASH — открытая база данных с элементами ИИ, которая самостоятельно структурирует информацию и проверяет её достоверность. Проект объединяет данные из разных источников в реальном времени, предлагая удобные инструменты для работы с ними даже не-техническим пользователям. HASH имеет автономных агентов, которые автоматически дополняют и очищают данные, а в будущем система превратится в полноценную рабочую среду с AI-интерфейсами. Для старта можно использовать облачную версию или развернуть локально. 🤖 GitHub (https://github.com/hashintel/hash)

Хотите углубить знания в JavaScript и работать с самыми популярными фреймворками? Прокачайте свои навыки до профессионального уровня с курсом «JavaScript Developer. Professional» от OTUS. Мы предлагаем практический курс, где вы: - Изучите передовые технологии, такие как ReactJS, Angular, Vue, Node.js и другие. - Научитесь работать с такими инструментами, как Webpack, TDD, и PostgreSQL. - Примените знания на практике: создадите сложные веб-приложения, протестируете их, организуете хранение данных и многое другое. Вы сможете: • Создавать приложения для реальных проектов. • Применять паттерны проектирования. • Работать с асинхронностью, тестированием, оптимизацией. Пройдите вступительное тестирование и получите скидку на обучение: https://clck.ru/3NFvzi Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576

🧩 FossFLOW — опенсорс PWA для создания стильных технических диаграмм прямо в браузере Этот инструмент идеально подойдёт для архитекторов, инженеров и DevOps-специалистов, которым нужно быстро визуализировать инфраструктуру. 🎨 Особенности: — работает как полноценное веб‑приложение (PWA) — поддерживает кастомные цвета, подписи, офлайн-режим — удобный drag‑and‑drop интерфейс и управление компонентами — ничего не надо устанавливать — всё прямо в браузере 🚀 Разворачивается за секунды: — GitHub Pages — Netlify — Vercel — Docker или можно просто открыть онлайн-демо: stan-smith.github.io/FossFLOW/ 💡 Быстрая, приватная и лёгкая альтернатива тяжёлым десктопным редакторам. 🔗 GitHub: github.com/stan-smith/FossFLOW

🪐 Новый UI-фреймворк в стиле Sci‑Fi — Cosmic UI 🌌 Cosmic (https://github.com/rizkimuhammada/cosmic-ui) UI — это open-source библиотека футуристичных компонентов на React + TailwindCSS + TypeScript. Всё выполнено в стиле научной фантастики — идеально для проектов с «космическим» вайбом. 🔧 Внутри: - Компоненты с анимациями и голографическими эффектами - Документация + демо: [cosmic-ui.com](https://cosmic-ui.com/docs) - MIT лицензия — можно использовать как угодно - Поддержка Vite, TS, ESLint, Vercel ⚡ Почему стоит попробовать? - Готовые стилизованные компоненты экономят кучу времени - Идеально для игр, дашбордов, кастомных интерфейсов - Выглядит не как все остальные boring UI-библиотеки 📦 Установка: npm install cosmic-ui 📌Github (https://github.com/rizkimuhammada/cosmic-ui)

🚀 Реактивное программирование в Angular Современный Angular предоставляет два подхода к реактивному программированию: RxJS и Signals. На открытом уроке мы разберём оба подхода, покажем, в чём их различия, как они дополняют друг друга, и как выбрать правильный инструмент под задачу. 👉Какие ключевые темы и вопросы будут рассмотрены на вебинаре? - Что такое реактивное программирование в контексте Angular - Observable и Signals: в чём разница, когда что использовать - Операторы RxJS - Создание и управление сигналами (signal, computed, effect) - Как внедрить сигналы в компоненты, шаблоны и сервисы - Связь между RxJS и Signals через rxjs-interop Бесплатный вебинар проходит в рамках курса “Angular Developer“ Регистрация и подробнее о курсе Angular Developer - https://clck.ru/3NDgF7 Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576