Frontender Libs - обзор библиотек JS / CSS

AOS – Animate On Scroll Отличный вариант библиотеки для одностраничного сайта. Animate on Scroll добавит приятную анимацию при прокручивании страницы. Библиотека поможет создать привлекательный дизайн со множеством элементов: эффекты затухания, размещение статических привязок и многое другое. 👉 @sWebDev

Можно ли использовать в Angular private переменные в шаблоне? Представим, что в своем Angular шаблоне вы использовали private переменную. Например, в таком формате:

  selector: 'private-error',
  template: ` <div>{{ message }}</div> `,
})
export class PrivateErrorComponent {
  private message: string = 'Variable should be public'
  constructor() {}
}

Повлечет ли это какие-то проблемы в приложении? Не уверены? Можно подсмотреть в наш пост за 24.10. 👉 @sWebDev

Tremor Tremor - Библиотека React для быстрого создания дашборд-панелей на вашем сайте. 👉 @sWebDev

Art Gallery Проект анимированной галереи, выполненный на CSS и Three.js. 👉 @sWebDev

Algolia Places Algolia Places – библиотека JavaScript для автоматического заполнения форм. Специализируется на адресах, может добавить карту в поиск и отобразить местоположение. Точная и сверхбыстрая библиотека повысит удобство работы пользователей с вашим сайтом. 👉 @sWebDev

SkyEng за 100к ? 💻 Английский для IT - БЕСПЛАТНО! Если ты знаешь английский, то уже наполовину знаешь IT. Канал Английский для IT поможет тебе в этом. Тысячи слов и словосочетаний на английском, которые пригодятся тебе в изучении языков программирования. Присоединяйся, чтобы погрузиться в компьютерный мир уже с багажом знаний! 😉

Гибкая ORM для Node.js – Sequelize При создании очередного проекта, появляется желание упростить себе жизнь и лишний раз не писать SQL-запросы. В таком случае было бы неплохо познакомиться с технологией ORM. 👉 @sWebDev

Anime.js Anime.js - это библиотека для создания анимаций, работает с CSS, SVG, атрибутами DOM и объектами JavaScript. 👉 @sWebDev

Фронтендеры на месте? Нашли для вас канал, где постят эффекты с готовым кодом на Codepen. Увидел – и сразу заюзал в своём проекте. Подпишись и пили сайты на уровне Apple – @frontend_formula

Back2School Проект забавной анимации школьника, выполненной на Anime.js. 👉 @sWebDev

Верстальщики, ловите лайфхак: Все макеты для верстки уже нашли и бесплатно выкладывают на канале Макеты Figma. Макеты для верстки: @figma_templates

React, я люблю тебя, но ты сводишь меня с ума Перевод резонансной статьи, посвященной React. Материал написан в шуточной форме, однако, это не уменьшает ее пользы при рассмотрении особенностей и подводных камней данной библиотеки. 👉 @sWebDev

Использование private переменных в шаблоне Создание Angular приложения просто невозможно без ошибок. Не всегда очевидно, в каком месте или в какой части кода она таится, а поиск может отнять немало времени. Например, использование private переменных в шаблоне является плохой практикой, т.к. все свойства компонента или сервиса, которые объявлены с модификатором private, должны использоваться исключительно в пределах своего класса. Обращение к ним в шаблоне или другом сервисе приведет к генерации исключения, но только в момент сборки приложения. Воспроизведём ошибку:

  selector: 'private-error',
  template: ` <div>{{ message }}</div> `,
})
export class PrivateErrorComponent {
  private message: string = 'Variable should be public'
  constructor() {}
}

Выполним сборку: ng build --prod В консоли увидим следующее: Property 'message' is private and only accessible within class 'PrivateErrorComponent'. 👉 @sWebDev

Аудиотека на GSAP.js Проект аудиотеки, выполненный на GSAP.js. Данный функционал можно использовать, например, для создания собственного музыкального сервиса или раздела с музыкой в вашем веб-приложении. 👉 @sWebDev

Как преобразовать значения в Angular приложении? При работе с приложением может возникнуть ситуация, когда вам необходимо преобразовать значение и сделать это нужно максимально быстро и в минимум строк кода. Например, если приложение на Angular, то можно использовать один из встроенных фильтров. Именно этот фильтр мы рассматривали в посте за 17.10. 👉 @sWebDev

Select на React По ссылке пошаговое руководство по созданию select с применением React. 👉 @sWebDev

Mobile VR Sonic По ссылке мини-игра, выполненная на Three.js. 👉 @sWebDev

Skeleton.js Библиотека для создания веб-приложений. Обладает собственной CSS сеткой и кроссбраузерностью. 👉 @sWebDev