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

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

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

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

    ✨Топ библиотек JavaScript для создания PDF 👉 PDFKit — Предлагает поддержку и Node, и браузера через Webpack. Поддерживает пользовательские шрифты и встраивание изображений, не имеет высокоуровневого API. 👉 Pdfmake — Враппер, построенный вокруг PDFKit. Работает в Node и браузере, поддерживает TypeScript. Полностью декларативный, позволяет сосредоточиться на задачах. 👉 jsPDF — Отличается высокой надежностью и имеет хорошую поддержку. Просто использовать с Node, и с браузерами. Позволяет использовать пользовательские шрифты. 👉 Pdf-lib — Поддерживает склеивание, разрезание, встраивание PDF и много других функций. Полностью реализована на Typescript. 👉 Labelmake — Не требует от разработчика просчитывать макет самостоятельно: нужно лишь определить постоянные отступы, высоту строк и т. д. Позволяет использовать пользовательские шрифты, а также позволяет встраивать PDF-файлы. А какими сервисами пользуетесь вы? Напишите в комментариях👇 #полезно #подборки_инструментов 👉 @frontend_mind
  • Frontend Головного Мозга

    Панель выравнивания текста, выполненная с помощью Pug и SCSS, без использования JavaScript #codepen #scss #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇
  • Frontend Головного Мозга

    Infinite-scroll.js — Плагин для бесконечной прокрутки Позволяет автоматически подгружать следующую страницу на сайт. Особенности / преимущества: ✔️Небольшой вес (5kB) ✔️Возможность работы с WordPress ✔️Легко интегрировать в проект ✔️Возможность настроить функционал Сайт: https://infinite-scroll.com/ Гит: https://github.com/metafizzy/infinite-scroll #библиотеки #полезно #js 👉 @frontend_mind
  • Реклама

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

    Набор анимированных tabbar'ов, выполненный с помощью SCSS и JavaScript #codepen #scss #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇
  • Frontend Головного Мозга

    Асинхронность в JS Что такое Event loop, при чём здесь Web API, и как работают промисы и async/await Синхронный код и его проблемы Представим, что нам нужно выполнить какую-то операцию, например, напечатать в консоли приветствие, но не сразу, а через 5 секунд. Если бы мы запустили синхронную функцию задержки delay(), то движок бы ничем другим заниматься в это время не мог. Асинхронный код Теперь попробуем решить эту же задачу, но так, чтобы наш код не блокировал выполнение. Для этого мы воспользуемся функцией setTimeout(). Задача решена. Однако, в этот раз, в эти «5 секунд молчания» мы можем выполнять другие действия. Возникает несколько вопросов: ✔️Почему вторая строка кода выполнилась до первой, если JS однопоточный? ✔️Куда девается setTimeout() на время, пока выполняется другой код? ✔️Как движок понимает, что пора выводить Hello? Далее мы рассмотрим следующее: 👉 Стек вызовов 👉 Цикл событий 👉 Ад колбэков 👉 Промисы 👉 Асинхронные функции 👉 Читать статью полностью #статья #js 👉 @frontend_mind
  • Frontend Головного Мозга

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

    Carrd — Конструктор для одностраничных веб-сайтов Позволяет быстро создать полностью адаптивные одностраничные сайты, предоставляя множество различных шаблонов и готовых блоков. Особенности: 👉 Возможность создать полностью свой дизайн 👉 Подробная документация 👉 Внедрение собственного кода 👉 Интеграция с MailChimp Сайт: https://carrd.co/ #полезно #инструменты 👉 @frontend_mind
  • Frontend Головного Мозга

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

    Решение задачи "Удобное время" #codewars #легко #js #ответы #45kata 👉 @frontend_mind
  • Frontend Головного Мозга

    Удобное время Напишите функцию, которая принимает неотрицательное целое число (секунды) в качестве входных данных и возвращает время в удобочитаемом формате (HH:MM:SS). HH = часы, дополненные до 2 цифр, диапазон: 00–99 MM = минуты, дополненные до 2 цифр, диапазон: 00–59 SS = секунды, дополненные до 2 цифр, диапазон: 00–59 Пример:
    humanReadable(0) - вернёт '00:00:00'
    
    humanReadable(60) - вернёт '00:01:00'
    
    humanReadable(3599) - вернёт '00:59:59'
    
    humanReadable(86399) - вернёт '23:59:59'
    
    humanReadable(359999) - вернёт '99:59:59'
    
    
    Максимальное время никогда не превышает 359999 (99:59:59) ===Решать задачу на Codewars=== 📌 Пишите ваше решение в комментариях. Решение будет через несколько часов на этом канале. 👇 #codewars #легко #js #45kata 👉 @frontend_mind
  • Frontend Головного Мозга

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

    Upload.js — Библиотека для загрузки файлов Поставляется с интегрированным облачным хранилищем файлов, специально созданным для загрузки файлов. Особенности / преимущества: ✔️Небольшой вес (7kB) ✔️Преобразования файлов ✔️Загрузка многокомпонентных файлов ✔️Доступна для React, Vue, Angular и jQuery Сайт: https://upload.io/upload-js Гит: https://github.com/upload-io/upload-js #библиотеки #полезно #js 👉 @frontend_mind
  • Frontend Головного Мозга

    Генератор персонажа, выполненный с помощью SVG, CSS и JavaScript #codepen #css #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇
  • Frontend Головного Мозга

    Proto. io — Платформа для прототипирования Позволяет создавать прототипы с помощью интерфейса перетаскивания и готовых блоков. Особенности: 👉 Импорт из Figma, Sketch, PhotoShop и Adobe XD 👉 Поддерживает экспорт в PDF, PNG или HTML 👉 Добавление микро-анимации и интерактивности 👉 Приложение для IOS и Android Сайт: https://proto.io/ #полезно #инструменты 👉 @frontend_mind
  • Frontend Головного Мозга

    Планируете переезд или остаётесь в России? Если вы разработчик и у вас есть минута времени, поделитесь планами в анонимном опросе. Там всего 7 вопросов. Ваши ответы помогут крупному IT-работодателю понять, в каких странах стоит открывать офисы и как условия нужны разработчикам.
  • Реклама

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

    Виртуальная клавиатура, выполненная с помощью Pug, SCSS и JavaScript. Клавиатура реагирует на нажатие клавиш #codepen #scss #js #готовые_решения 👉 @frontend_mind 👇Код и демо доступны по кнопке👇
  • Frontend Головного Мозга

    ✨Топ сервисов для подбора шрифтов 👉 Fontsquirrel — Предоставляет подобранные вручную шрифты, лицензированные и готовые к использованию. Также предоставляет множество уникальных шрифтов. 👉 Fontasy — Предоставляет более 1000 шрифтов. Шрифты разделены по стилям и дизайнерам. Перед использованием можно попробовать шрифт, также к шрифтам можно оставлять комментарии. 👉 Typ.io — Поможет подобрать пару к шрифту, а также протестировать перед использованием и оставить оценку. 👉 Mixfont — Генерирует случайно выбранную пару шрифтов. В коллекции сервиса содержится 600 000+ шрифтов. Поддерживает 132 языка. 👉 Fontsinuse — Предоставляет шрифты с примерами использования. Также предоставит связанные шрифты, авторов и ресурсы для скачивания. 👉 Google Fonts — Библиотека предоставляет интерактивный каталог для просмотра шрифтов. Шрифты можно скачать или встроить на сайт с помощью CSS. А какими сервисами пользуетесь вы? Напишите в комментариях👇 #полезно #подборки_инструментов 👉 @frontend_mind
  • Frontend Головного Мозга

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