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

Как скрыть свои свойства Angular — объяснение # vs private Заметили символ решетки, появляющийся в примерах кода Angular? Если нет, вы можете увидеть это в ближайшее время. Зачем нужен символ # и когда его использовать? Недавно # символ был добавлен в JavaScript для обозначения свойств частного класса. Создание переменной класса приватной означает, что доступ к переменной возможен только внутри ее класса. Это позволяет нам инкапсулировать данные, к которым мы хотим получить доступ только внутри сервиса. Все подробности в материале по ссылке. 👉 @sWebDev

Who's that Pokémon? Интерактивная викторина о покемонах, выполненная на Vue.js. 👉 @sWebDev

Требуются парни и девушки в возрасте 19–40 лет, желающие работать в сфере IT. Опыт в программировании не нужен. С 11 по 17 июля проводим бесплатный онлайн-интенсив по Frontend-разработке, где будем учить, как разрабатывать сайты и веб-приложения. За эти 7 дней обучения ты: 1. Создашь полноценный веб-сайт на HTML и CSS; 2. Оживишь страницу с помощью JavaScript; 3. Используешь фронтенд-фреймворк Angular; 4. Подключишь Backend и загрузишь сайт на хостинг; 5. Получишь советы по доработке своего проекта; 6. Узнаешь сколько можно зарабатывать и как работать; 7. Получишь в подарок чек-лист «45 мест для поиска работы». 🔥 А главное, ты увидишь, что разрабатывать сайты и приложения не так сложно, как кажется. И поймёшь, как тебе развиваться в этой профессии, чтобы уже в следующем году зарабатывать от 1000$ на вёрстке сайтов. 👉 Проскочить на интенсив бесплатно

Vue Vine Vue Vine - легковесная библиотека для управления состоянием и асинхронными операциями в приложениях Vue.js. Ее основной концепцией является использование винов (Vines) для описания и выполнения асинхронных операций. Vue Vine предоставляет чистый и декларативный API для управления данными и обновления состояния приложения. Она интегрируется хорошо с компонентами Vue.js и позволяет упростить разработку асинхронных операций, обеспечивая чистоту и модульность кода. 👉 @sWebDev

​«Асинхронная архитектура», о проектировании сложных распределенных систем 28 июля стартует 5 набор на курс «Асинхронная Архитектура». Приходите учиться, если уже напарывались на сервисную архитектуру, которая в итоге становилась распределённым монолитом, или просто хотите погрузится в мир больших распределённых систем. Темы курса: — обработка распределённых ошибок, — тестирование распределённых систем, — форматы данных и способы коммуникации, — отказоустойчивость, — эволюция — как добавлять новые события в сложные системы. Курс направлен на мидлов, сеньоров, тимлидов и CTO. Отважным джунам тоже можно прийти — прокачаете мышление проектировщика, которое позволит писать более понятный и изолированный код. Курс прикладной: будут домашки с разбором, которые готовят к реальной работе и реальным сложностям. За время курса вы сделаете проект с асинхронной архитектурой и положите себе в портфолио. Если успеете в дедлайн — получите сертификат на русском и английском языке, который можно привязать к линкедину. Материалы курса проверены на почти 1500 учеников. На курсе учились команды из Arrival, Toptal, Яндекс, Озон, Авито, Сбер и другие. Посмотреть программу, отзывы и бесплатный урок → По промокоду FrontLib10 скидка 10% до 11 июля. Платить можно самому сразу или частями. А лучше за счет компании из любой точки мира.

У React наступает момент Angular.js? В 2012 году Angular.js изменил ландшафт фронтенд-разработки и быстро стал успешным. Всего два года спустя команда Angular запустила Angular 2, полностью переписанную исходную библиотеку, основанную на другом наборе парадигм. Многие разработчики, в том числе и я, не хотели переписывать свои существующие приложения, чтобы они соответствовали этим новым идеям. И для новых проектов Angular.js больше не подходил, так как другие фреймворки были так же хороши. Недавно команды React и Next.js продвигали Server Components — новый способ создания веб-приложений, который не подходит для большинства существующих приложений React. В статье рассмотрим новые функции, которые представили команды React и Next.js. 👉 @sWebDev

​«Асинхронная архитектура», о проектировании сложных распределенных систем 28 июля стартует 5 набор на курс «Асинхронная Архитектура». Приходите учиться, если уже напарывались на сервисную архитектуру, которая в итоге становилась распределённым монолитом, или просто хотите погрузится в мир больших распределённых систем. Темы курса: — обработка распределённых ошибок, — тестирование распределённых систем, — форматы данных и способы коммуникации, — отказоустойчивость, — эволюция — как добавлять новые события в сложные системы. Курс направлен на мидлов, сеньоров, тимлидов и CTO. Отважным джунам тоже можно прийти — прокачаете мышление проектировщика, которое позволит писать более понятный и изолированный код. Курс прикладной: будут домашки с разбором, которые готовят к реальной работе и реальным сложностям. За время курса вы сделаете проект с асинхронной архитектурой и положите себе в портфолио. Если успеете в дедлайн — получите сертификат на русском и английском языке, который можно привязать к линкедину. Материалы курса проверены на почти 1500 учеников. На курсе учились команды из Arrival, Toptal, Яндекс, Озон, Авито, Сбер и другие. Посмотреть программу, отзывы и бесплатный урок → По промокоду FrontLib10 скидка 10% до 11 июля. Платить можно самому сразу или частями. А лучше за счет компании из любой точки мира.

Vue Book Content Typer Анимированный перенос текста из поля на элемент, выполненный на Vue.js. 👉 @sWebDev

Frontend meetup (Online) 1. Построение микрофронтендной архитектуры. Первый взгляд, боли и решения —Никита Морозов, АО "МТТ" В докладе будет представлен путь построения микрофронтендной архитектуры на примере проекта МТС «Exolve», а также поэтапный рассказ об эволюции проекта от webpack до vite, от SingleSPA до собственного решения 2. Бьем монолит. Основные практики — Гузенко Александр IT ONE Рассмотрим основные подходы к разбиению монолитных фронтедов. 3. Безопасный TypeScript. Защищаемся от any в кодовой базе —Максим Земсков, Яндекс Как получить максимум безопастности при использования TypeScript. Какие настройки стоит использовать и как улучшить типизацию стандартных функций. 4. Beyond Frontend — Алексей Тюльдюков, VK Как T-shape подход может помочь фронтенд разработчику стать техническим менеджером 🗓 12 июля, начало в 19:00 мск, Среда 🚀 Телеграмм канал с анонсами митапов ✅ Регистрация на мероприятие

Директива для двусторонней привязки данных Angular [ngModel] в Angular - директива для двусторонней привязки данных. Пример: <input [(ngModel)]="name">. Синхронизирует значение элемента формы с свойством компонента. Также позволяет добавлять дополнительные функциональности, такие как валидацию данных или управление состоянием элемента формы. Однако, чтобы использовать [ngModel], необходимо импортировать модуль FormsModule из @angular/forms и добавить его в список импортов модуля вашего приложения.

    import { FormsModule } from '@angular/forms';

    @NgModule({
      imports: [FormsModule],
      // ...
    })
    export class AppModule { }

👉 @sWebDev

Tron Parallax Параллакс эффект с персонажем фильма "Трон: Наследие". Выполнено на GSAP.js. 👉 @sWebDev

Какой хук выполняется перед уничтожением экземпляра Vue.js? Какой хук Vue.js будет выполнен перед уничтожением экземпляра? 👉 @sWebDev

Exploding Low Poly Heart Анимированная сцена, выполненная с применением библиотеки GSAP.js. 👉 @sWebDev

D3-Gauge D3-Gauge – это компактная и гибкая библиотека для создания красивых и анимированных графиков-измерителей на веб-страницах. Она предоставляет простой API для настройки параметров: минимального и максимального значений, что позволяет создавать индивидуальные и интерактивные графики-измерители. 👉 @sWebDev

Основы Angular: встроенные Pipes с примерами каждого В материале основы работы со встроенными пайпами в Angular и примеры их использования. Автор подробно объясняет, как пайпы помогают преобразовывать данные в шаблонах Angular, включая такие пайпы, как UpperCasePipe, LowerCasePipe, CurrencyPipe и другие. 👉 @sWebDev

Minimalist Thermostat Регулятор температуры, выполненный на CSS, SVG и GSAP.js. 👉 @sWebDev

Pizzicato.js Малоизвестный, но мощный инструмент для создания звуковых эффектов в веб-приложениях. Библиотека обладает простым API и поддерживает различные звуковые операции, такие как воспроизведение, пауза, регулировка громкости и наложение эффектов, таких как реверберация и эхо. 👉 @sWebDev

Работа с формами в Angular — модуль работы с формами и обертки полей Рассмотрим один из способов работы с формами в Angular-проектах, который упрощает создание новых форм и изолирует зависимость от внешней UI-библиотеки. В материале мало текста и много кода, пристегните ремни, мы начинаем. 👉 @sWebDev

⚠️ Как перейти из ручного тестирования в автоматизацию на JavaScript? 🦾 Конечно прокачивать свои скилы! Пройди хардкорный тест по автотестированию на JS и проверь свой уровень. Ответишь — пройдешь на продвинутый курс «JavaScript QA Engineer» от OTUS по специальной цене + получишь видео-курс по Git в подарок 🔥 ПРОЙТИ ТЕСТ https://otus.pw/XZ8D/ Нативная интеграция. Информация о продукте www.otus.ru