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

Upside Towers - жизнь выше ожиданий! Upside Towers - технологичный квартал небоскрёбов-вершин, вдохновленный философией гор. 5 высотных футуристичных башен с квартирами от 11,3 млн ₽ с панорамными окнами «в пол» и потолками 3 м сдаются с отделкой white box или с премиальной отделкой. - Территория 7 га с ландшафтным парком и бульваром, приватные дворы с концептуальным благоустройством - Мультиформатный Upside Club площадью 2 000 кв. м. - пространство для общения и развития жителей - SKY SPA&Relax комплекс на 47 этаже - Всесезонное барбекю-патио - Смотровые площадки на высоте 200 метров - 15 000 кв.м. коммерческой инфраструктуры - Государственные школа и детский сад - 3 мин. до метро, 15 мин от Цветного бульвара - Виды на Останкинскую башню, ВДНХ, Ботанический сад, Москва-Сити и центр города Узнать больше Проектная декларация на сайте https://наш.дом.рф/. Застройщик: ООО "Апсайд Девелопмент" #реклама upside-towers.ru О рекламодателе

Немного магии за пределами бэкенда. 👉 @sWebDev | #юмор

Responsive Slider with Scrollbar | Swiper JS Адаптивный слайдер в стиле глассморфизма с полосой прокрутки на Swiper JS. 👉 @sWebDev

Бесит часами искать подходящие скрипты? Конечно, ведь в сети полно различных источников. Зато в Telegram достаточно одного канала – Сайтодел Зашел – подписался ✔️ – и сразу применил в своём проекте!

Реагирование на изменения входных данных в Angular ɵNgOnChangesFeature - это функция Angular, которая позволяет компоненту реагировать на изменения входных данных. Она используется во внутреннем API Angular, но может быть полезна и разработчикам. Как работает: 1. Когда компонент инициализируется, ɵNgOnChangesFeature создает объект SimpleChange, который содержит текущее и предыдущее значения каждого входного 2. При изменении входного ɵNgOnChangesFeature: - Сравнивает новое значение со старым. - Если значения не совпадают, ɵNgOnChangesFeature вызывает метод ngOnChanges компонента. - ngOnChanges получает объект SimpleChange с информацией о том, какие входные данные изменились. Пример использования:

export class MyComponent implements OnChanges {
  ngOnChanges(changes: SimpleChanges) {
    if (changes['input1']) {
      // Обработать изменение input1
    }
    if (changes['input2']) {
      // Обработать изменение input2
    }
  }
}

👉 @sWebDev

React против Angular: компонентная архитектура Данная статья представляет собой сравнительный анализ подходов к компонентной архитектуре в React и Angular. В ней рассматриваются такие аспекты, как: создание компонентов, взаимосвязь компонентов, обнаружение изменений и т.д. 👉 @sWebDev

Ребят, в начале своего пути сложно запомнить сразу весь пройденный материал, поэтому нужно периодически повторять его У нас не всегда есть время перечитывать учебники, но вот в телеграме мы сидим очень активно 😎 А значит даже быстрый просмотр полезных материалов будет тренировать нашу память Тем более теперь есть специальный канал для этого: @FrontendPortal Наглядная теория с примерами, полезные ресурсы, шпаргалки, разбор вопросов с собеседований, викторины - все там есть ➡️ Так что советую подписаться

Определяем завершение Async Transitions Как узнать, что Async Transitions завершена? 👉 @sWebDev

Внимание, разработчики! @TopSelectionWeb3 💼Хотите прокачать свой LinkedIn-профиль и привлечь внимание рекрутеров? 🚀Команда TopSel приглашает вас на еженедельный бесплатный Разбор профилей LinkedIn в прямом эфире, который состоится в это воскресенье, 7 апреля, в 14:00 по мск! 💻На этот раз мы сфокусируемся на профилях разработчиков: Frontend, Backend, Fullstack, iOS/Android. Не упустите возможность улучшить свой LinkedIn профиль и увеличить шансы на трудоустройство! Делитесь вашими профилями в комментариях под последним постом на канале @TopSelectionWeb3

Resizable.js Resizable.js - это JavaScript-библиотека, позволяющая сделать элементы HTML-страницы изменяемыми по размеру. 👉 @sWebDev

Spooky - ThreeJS Пример реализации трехмерной диорамы на Three.js. 👉 @sWebDev

🔥 Это база с 1400 вопросами с собеседований на Frontend разработчика. Фишка в том, что просчитана вероятность с которой вопрос буден задан и есть примеры ответов. Теперь можно легко получить оффер, подготовившись к самым популярным вопросам 😏

Реализация React Query в веб-приложении В этой статье рассматривается интеграция библиотеки React Query в базовое веб-приложение. React Query - это библиотека для управления, кэширования и синхронизации состояния сервера в приложениях React. В статье создается простое приложение, которое извлекает данные из открытого API, а для стилизации используется Bootstrap. 👉 @sWebDev

GSAP scrolltrigger exemple Пример скролл-анимации на GSAP.js. 👉 @sWebDev

ImagesLoaded ImagesLoaded – это JavaScript-библиотека, предназначенная для отслеживания загрузки изображений на веб-странице. Она позволяет вам выполнять код после того, как все изображения на странице (или в заданном селекторе) будут загружены. 👉 @sWebDev

Забывали ставить ;? 👉 @sWebDev

Background Generator Генератор баблов для фона на Anime.js. 👉 @sWebDev

Upside Towers - жизнь выше ожиданий! Upside Towers - технологичный квартал небоскрёбов-вершин, вдохновленный философией гор. 5 высотных футуристичных башен с квартирами от 11,3 млн ₽ с панорамными окнами «в пол» и потолками 3 м сдаются с отделкой white box или с премиальной отделкой. - Территория 7 га с ландшафтным парком и бульваром, приватные дворы с концептуальным благоустройством - Мультиформатный Upside Club площадью 2 000 кв. м. - пространство для общения и развития жителей - SKY SPA&Relax комплекс на 47 этаже - Всесезонное барбекю-патио - Смотровые площадки на высоте 200 метров - 15 000 кв.м. коммерческой инфраструктуры - Государственные школа и детский сад - 3 мин. до метро, 15 мин от Цветного бульвара - Виды на Останкинскую башню, ВДНХ, Ботанический сад, Москва-Сити и центр города Узнать больше Проектная декларация на сайте https://наш.дом.рф/. Застройщик: ООО "Апсайд Девелопмент" #реклама upside-towers.ru О рекламодателе

Синхронизация с внешним хранилищем useSyncExternalStore - это хук, позволяющий синхронизировать состояние компонента с внешним хранилищем данных. Пример использования:

const store = createStore();

function MyComponent() {
  const data = useSyncExternalStore(
    store.subscribe,
    store.getSnapshot,
  );

  return (
    <div>
      {data.map((item) => (
        <p key={item.id}>{item.text}</p>
      ))}
    </div>
  );
}

В этом примере: 1) store - это наше внешнее хранилище данных. 2) useSyncExternalStore принимает два аргумента: - store.subscribe: функция, которая подписывается на обновления хранилища. - store.getSnapshot: функция, которая возвращает текущее состояние хранилища. 3) data - это переменная, которая содержит текущее состояние хранилища. 4) Компонент MyComponent будет обновляться каждый раз, когда состояние хранилища меняется. 👉 @sWebDev