Обложка канала

Frontend Головного Мозга. Страница 35

12111 @frontend_mind
Открыть

Настоящий клондайк для frontend-разработчиков.

  • Frontend Головного Мозга

    Рябь, выполненная с помощью SCSS и библиотеки Three.js #codepen #scss #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇

  • Frontend Головного Мозга

    Joi - Библиотека для валидации данных Позволяет описывать данные простым, интуитивно понятным и языком. Особенности / преимущества: ✔️ Удобный API ✔️ Небольшой вес (42kB) ✔️ Подробная документация ✔️ Позволяет добавлять собственные расширения Сайт: https://joi.dev/ Гит: https://github.com/sideway/joi #библиотеки #полезно #js 👉 @frontend_mind

  • Frontend Головного Мозга

    Кубические часы, выполненные с помощью Haml, SCSS и JavaScript #codepen #scss #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇

  • Реклама

  • Frontend Головного Мозга

    Cssgradient — Инструмент для создания градиентных фонов Автоматически генерирует CSS-код для вашего градиентного фона. Особенности: 👉 Предоставляет туториалы и референсы по использованию градиентов 👉 Имеет библиотеку готовых градиентов 👉 Позволяет настраивать тип, направление и прозрачность градиента 👉 Выбор цвета в нескольких форматах (RGBA, HEX, палитра) 👉 Также предоставляет страницу с оттенками основных цветов Сайт: https://cssgradient.io/ #полезно #инструменты 👉 @frontend_mind

  • Frontend Головного Мозга

    Эффект при движении мышкой, выполненный с помощью SCSS и GSAP.js #codepen #scss #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇

  • Frontend Головного Мозга

    Решение задачи "Вектор" #codewars #легко #js #ответы #33kata 👉 @frontend_mind

  • Frontend Головного Мозга

    Вектор Ваша задача — определить связь между заданной точкой и вектором. Направление вектора важно! Чтобы определить, находится точка слева или справа, вы должны представить себя стоящим в начале вектора и смотрящим на конец вектора. Функция принимает координаты точки и координаты вектора на 2D-плоскости: точка = [х, у] вектор = [[x, y], [x, y]] (две точки, направление от первой ко второй) Функция должна вернуть: -1, если точка находится слева от вектора. 0, если точка находится на той же линии, что и вектор. 1, если точка находится справа от вектора. Пример: 
    vector = [[0, 0], [1, 1]]

pointVsVector([0,1], vector) - вернёт -1

pointVsVector([2,2], vector) - вернёт 0

pointVsVector([2,0], vector) - вернёт 1
    Векторы всегда имеют ненулевую длину, поэтому вам не нужно проверять это на данном этапе. ===Решать задачу на Codewars=== 📌 Пишите ваше решение в комментариях. Решение будет через несколько часов на этом канале. 👇 #codewars #легко #js #33kata 👉 @frontend_mind

  • Frontend Головного Мозга

    Анимированная сцена, выполненная с помощью Stylus и JavaScript #codepen #scss #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇

  • Frontend Головного Мозга

    ScrollMagic — Библиотека для взаимодействия с прокруткой Позволяет добавлять анимацию и эффекты при прокрутке. Особенности / преимущества: ✔️Поддержка мобильных устройств ✔️Небольшой вес (6kB) ✔️Поддержка прокрутки по осям x и y ✔️Не имеет зависимостей ✔️Возможна прокрутка внутри нескольких Div-контейнеров Сайт: http://scrollmagic.io/ Гит: https://github.com/janpaepke/ScrollMagic #библиотеки #полезно #js 👉 @frontend_mind

  • Frontend Головного Мозга

    ​На курсе «Мидл фронтенд-разработчик» студенты становятся уверенными мидлами за пять месяцев, а не за полтора года.  → Приходите учиться, если вы разбираетесь в HTML, CSS, JavaScript — мы поможем повысить грейд.  Выпускники смогут браться за более сложные задачи, чем одностраничные сайты или простые веб-сервисы. На курсе мы поможем глубже разобраться:  — в алгоритмах и структурах данных;  — в паттернах проектирования; — в том, как работают популярные в веб-разработке технологии. Что будет на учёбе: ⬛️ Код-ревью и обратная связь от старших разработчиков из Яндекса и других IT-компаний. ⬛️ Обучение на реальных рабочих задачах: студенты создадут мессенджер и веб-игру с нуля. ⬛️ Наставники и менторы будут делиться опытом на вебинарах и встречах один на один. ⬛️ Кураторы и дедлайны не дадут прокрастинировать. ⬛️ Карьерные консультации: наши специалисты помогут найти новый проект или сделать так, чтобы на текущей работе вам начали давать более амбициозные задачи. → Старт потока — 3 марта. Учёба длится пять месяцев. → Познакомьтесь с курсом и оцените свои силы — это бесплатно.

  • Frontend Головного Мозга

    3D-карточка, выполненная с помощью Haml и SCSS, без использования JavaScript #codepen #scss #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇

  • Frontend Головного Мозга

    Keyframes — Инструмент для создания анимации Позволяет создавать анимацию при помощи визуального онлайн-редактора с временной шкалой. Особенности: 👉 Сервис также предоставляет генератор теней и генератор палитры цветов 👉 Позволяет мгновенно скопировать CSS-код 👉 Предоставляет множество свойств для редактирования 👉 Позволяет экспортировать цвета в различных форматах Сайт: https://keyframes.app/ Гит: https://github.com/mitchas/Keyframes #полезно #инструменты 👉 @frontend_mind

  • Frontend Головного Мозга

    📱🔥 IT Network - первая в России соцсеть для айтишников Тысячи молодых айтишников уже нашли здесь наставника, работу и просто коллег по цеху для обучения программированию и решению повседневных задач. IT Network помогает находить известных экспертов, работу и быть в курсе всех новостей из мира IT и науки. Не упустите свой шанс стать одним из них! В приложении вы сможете: ● Обмениваться опытом с коллегами ● Получать интересные предложения о работе ● Расширять круг знакомств в сфере IT ● Следить за новостями из мира IT и науки Для тех, кто решил расти в кругу успешных айтишников, вот ссылка на приложение в App Store и Google Play.

  • Frontend Головного Мозга

    Интерактивные ползунки, выполненные на чистом CSS, без использования JavaScript #codepen #css #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇

  • Frontend Головного Мозга

    ✨Топ стоковых фоторесурсов, Часть 1: 👉 Free Nature Stock — Предоставляет бесплатные изображения природы высокого качества. Фотографии разделены по категориям. Кроме фотографий сервис предлагает стоковые видео. 👉 Foca — Предоставляет фото сгруппированные в коллекции. Помимо фотографий сервис предоставляет видео и шаблоны для социальных сетей. Также есть возможность выбрать размер изображения. 👉 Skitterphoto — Предлагает пейзажи, фото природы и уличную фотографию. Предоставляет палитру цветов с фотографии, также есть коллекция фото, составленная администратором. 👉 Life of Pix — Предоставляет фото в высоком разрешении. Фотографии разделены по категориям, также можно подписаться на понравившихся фотографов. Фотографиями можно поделиться или добавить в понравившиеся. 👉 Picspree — На сайте представлен большой выбор фото разделённых по категориям. Также можно воспользоваться поиском, чтобы найти нужное изображение. Сайт предложит похожие изображения при выборе. 👉 Rawpixel — Предлагает фотографии, иллюстрации и PNG-элементы. Позволяет загружать фотографии в разных форматах. Также позволяет добавить фото в понравившиеся или в сохранённое. Продолжение следует... А какими сервисами пользуетесь вы? Напишите в комментариях👇 #полезно #подборки_инструментов 👉 @frontend_mind

  • Реклама

  • Frontend Головного Мозга

    Анимация загрузки выполненная с помощью CSS и библиотеки GSAP.js #codepen #css #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇

  • Frontend Головного Мозга

    Two.js — Библиотека упрощающая создание 2D фигур Не зависит от рендеринга, позволяя использовать один и тот же api для рисования в нескольких контекстах: svg, canvas и WebGL. Особенности / преимущества: ✔️Не имеет зависимостей ✔️Предлагает множество функций для обработки и рендеринга растровых изображений ✔️Небольшой вес (40kB) ✔️Имеет встроенный цикл анимации, который может быть сопряжен с другой библиотекой для анимации Сайт: https://two.js.org/ Гит: https://github.com/jonobr1/two.js #библиотеки #полезно #js 👉 @frontend_mind

  • Frontend Головного Мозга

    GitHub теперь в Telegram! Подписывайтесь: @github_ru