Javascript

🟡Хардкорный тест по JS — Ответьте на 19 вопросов и проверьте, насколько хорошо вы знаете язык. Сможете сдать — пройдёте на продвинутый онлайн-курс по React.js со скидкой! 🚀За 4 месяца вы научитесь продвинутым возможностям Redux, Redux-Saga, Redux-thunk; созданию SPA-приложений и оптимизации их для production; чистому и лаконичному коду с TypeScript; применению интеграционных и юнит-тестов; работе в GraphQL, Apollo, Relay. 👉🏻ПРОЙТИ ТЕСТ ОНЛАЙН-КУРСА ПО REACT.JS

🗺 Дорожная карта для изучения React в 2023 году. Содержание этой статьи: ▪Введение в React ▪React vs другие фреймворки ▪Необходимые навыки ▪Полезные советы для изучения ▪Процесс онлайн-обучения ▪RoadMap для изучения React ▪Почему следует изучать React? ▪Проблемы во время обучения 📌 Читать @javascriptv

3D-эффект перехода между элементами В этом проекте интересным образом реализован эффект перехода между элементами. Так, например, вы можете, просматривая изображения в галереи, узнать подробности или описание, наведя на изображение. При этом, если до этого курсор был на другой карточке, то возникнет эффект «перекатывания кубика». Посмотреть код и поиграть с эффектом можно тут: https://codepen.io/noeldelgado/pen/nweYMz #codepen #фронтенд

Grid Items Share Background — сетка с анимированными блоками, выполненная с помощью SCSS и JavaScript. https://codepen.io/noahraskin/pen/JjrydbL Codepen Amazing

Пикачу в коробке Эта лягушонка в коробчонке пикачу в коробке отрисован и анимирован с помощью чисто CSS. Отдельные элементы графики сделаны с помощью DIV’ов и затем стилизованы. Чтобы запустить анимацию нужно нажать на верх коробки и потянуть курсов в сторону. Попробуйте сами. Там же вы найдёте код проекта: https://codepen.io/maxi83c/pen/JjOZdWX #codepen #css

Profile Card UI — карточка профиля, реализованная с помощью SCSS и JavaScript. Бомбическая анимация, которую вы обязаны попробовать сделать. https://codepen.io/team/jotform/pen/XWmqoMp Codepen Amazing

API Яндекс.Карты – геокодирование и маршрутизация на JavaScript Предположим, что перед пользователем стоит задача обработать большой список адресов/координат, а именно, посчитать расстояния между точками по автомобильным дорогам и определить координаты внушительного списка объектов. Тогда-то он и столкнется с отсутствием возможности пакетной обработки в пользовательском интерфейсе сервиса. Однако, Яндекс об этом позаботился, предоставив в условно-бесплатное пользование JavaScript API. ▪ Читать дальше @javascriptv

💡 GitHub Dark Mode Toggle — элегантный переключатель тёмной темы. https://codepen.io/milanraring/pen/qBEPzKB #js #css @javascriptv

✔️ Создание веб-компонентов с помощью WebC на vanilla JavaScript Итак, зачем использовать веб-компоненты? На высоком уровне двумя основными преимуществами веб-компонентов являются инкапсуляция и отсутствие внешних зависимостей. Веб-компоненты решают проблему инкапсуляции, позволяя вам ограничить влияние вашего кода CSS и JavaScript областью действия вашего компонента. Конечно, популярные фреймворки JavaScript, такие как React и Angular, помогают вам достичь аналогичных эффектов инкапсуляции. Итак, что же делает веб-компоненты особенными? Этот вопрос подводит нас ко второму преимуществу: веб-компоненты не зависят от библиотек, и вы можете создавать их, используя только встроенные API JavaScript. Независимый от библиотек характер веб-компонентов особенно полезен при разработке библиотеки компонентов пользовательского интерфейса. В отличие от других библиотек, созданных для конкретных фреймворков, вы можете использовать веб-компоненты для создания библиотеки, которая не связана с одним технологическим стеком. Это означает, что любой может использовать его, независимо от фреймворка JavaScript, который он использует для своего проекта. ▪Читать дальше @javascriptv