Слайдер на GSAP.js

Проект анимированного слайдера, выполненный с применением библиотеки GSAP.js.

👉 @sWebDev

Как я структурирую свои приложения Angular

В материале представлен систематический поход к организации приложений Angular. Автор предлагает использовать модульную архитектуру, разделять компоненты на контейнеры и презентационные компоненты, а также использовать сервисы для обработки бизнес-логики.

👉 @sWebDev

CharmUI

Библиотека CharmUI - это набор инструментов для создания пользовательских интерфейсов веб-приложений с использованием HTML, CSS и JavaScript. Библиотека предлагает разнообразные компоненты, включая кнопки, формы, модальные окна и многое другое. CharmUI является гибкой и обладает хорошей документацией.

👉 @sWebDev

Photo Tear

Анимированная сцена, выполненная на Three.js и GSAP.js.

👉 @sWebDev

Создание лучших форм с помощью Vue.js 3 Composition API: практическое руководство

Руководство по созданию форм с использованием Composition API в Vue.js 3. Автор предлагает использовать Composition API для улучшения управления состоянием форм, обработки валидации и управления событиями. В статье рассматриваются различные концепции, такие как реактивные переменные, встроенные хуки и композиционные функции.

👉 @sWebDev

Как вернуть изменяемый ref-объект React?

Представьте, что вам нужно вернуть ref-объект, свойство .current которого будет инициализироваться переданным аргументом. Каким хуком для этого воспользоваться?

👉 @sWebDev

Three.js isometric cubes animation

Анимированная сцена из кубов, выполненная на Three.js.

👉 @sWebDev

Верстаешь?

Оцени 7 причин пройти наш бесплатный интенсив по Frontend-разработке:

1. Сверстаешь веб-сайт на HTML + CSS;
2. Оживишь страницу с помощью JavaScript;
3. Используешь фронтенд-фреймворк Angular;
4. Подключишь Backend и загрузишь сайт на хостинг;
5. Получишь советы по доработке своего проекта;
6. Добавишь в портфолио 1 качественный проект;
7. Получишь в подарок чек-лист «45 мест для поиска работы».

А главное, ты проведёшь 7 дней в приятной компании Fullstack-разработчика с 10-летним стажем – Романа Чернова.

👉 Проскочить на интенсив бесплатно

Начинаем 13 июня.

Метод вызываемый перед уничтожением экземпляра Vue.js

Хуки уничтожения помогают прибраться или отправить данные для аналитики. Данный тип хуков срабатывает при демонтаже элемента и его удалении из DOM. beforeDestroy() выполняется перед уничтожением экземпляра.

        ExampleComponent.vue
        <script>
        export default {
        data() {
            return {
            someLeakyProperty: 'I leak memory if not cleaned up!'
            }
        },

        beforeDestroy() {
            // Perform the teardown procedure for someLeakyProperty.
            // (In this case, effectively nothing)
            this.someLeakyProperty = null
            delete this.someLeakyProperty
        }
        }
        </script>

👉 @sWebDev

Создание одностраничного приложения с помощью Vue и Kendo UI

Рассмотрим создание одностраничного приложения с использованием фреймворка Vue.js и библиотеки компонентов Kendo UI. Материал предоставляет пошаговое руководство по настройке окружения, созданию компонентов Vue, интеграции с Kendo UI, работе с данными и маршрутизацией.

👉 @sWebDev

On / Off Switch

Анимированный тоггл, выполненный на GSAP.

👉 @sWebDev

Vivus.js

Библиотека для создания анимированных рисунков и логотипов SVG. Она предлагает простой способ добавить плавные и привлекательные анимации к векторным графикам. С помощью Vivus.js вы можете контролировать различные параметры анимации, такие как скорость, направление и запуск анимации при прокрутке. Библиотека легко интегрируется в проекты и предоставляет гибкие возможности для создания уникальных визуальных эффектов.

👉 @sWebDev

Три способа раскрыть API внутренних компонентов Vue

Рассматриваем три способа раскрытия API компонентов Vue. Автор подробно объясняет использование "renderless components" (компонентов без отображения), прокси-компонентов и функциональных компонентов для предоставления гибкого и управляемого доступа к их функциональности.

👉 @sWebDev

3D Space Mouse Move and Device Motion

Анимация, доступная в двух цветах. Выполнено с применением Three.js.

👉 @sWebDev

Tagify

Библиотека, которая облегчает работу с тегами в веб-приложениях. Она предоставляет удобные и гибкие инструменты для создания интерактивных полей ввода с возможностью добавления и удаления тегов. Библиотека Tagify обеспечивает автодополнение, кастомизацию внешнего вида, а также поддерживает различные события и методы для манипуляции с тегами.

👉 @sWebDev

10 лучших (бесплатных) ресурсов Angular

В материале представлен список из бесплатных ресурсов по Angular. Учебники, блоги, видеоуроки и готовые проекты, которые помогут разработчикам изучить и улучшить свои навыки. Подборка будет особенно актуальна, если вы только начинаете свое знакомство с фреймворком.

👉 @sWebDev

Как реализовать условное отображение элементов в Angular?

В вашем приложении есть элемент, который вы хотите отображать по определенному условию. Какой директивой воспользоваться, чтобы реализовать данный функционал в Angular?

👉 @sWebDev

The frantic run of the valorous rabbit

Игра раннер, выполненная на Three.js.

👉 @sWebDev

Динамическое отображение содержимого шаблона в текущем месте использования Angular

Директива ngTemplateOutlet в Angular используется для динамического отображения содержимого шаблона в текущем месте использования. Она позволяет вставлять содержимое одного шаблона внутрь другого.

Пример использования ngTemplateOutlet:

    <!-- Определение основного шаблона -->
    <ng-template #mainTemplate>
      <h2>Главный шаблон</h2>
      <p>Содержимое главного шаблона</p>
    </ng-template>

    <!-- Использование ngTemplateOutlet для отображения содержимого главного шаблона -->
    <div *ngTemplateOutlet="mainTemplate"></div>

У нас есть основной шаблон с идентификатором #mainTemplate, содержащий заголовок и абзац текста. Затем мы используем ngTemplateOutlet для отображения содержимого этого шаблона внутри элемента <div>. Теперь содержимое главного шаблона будет отображаться внутри этого <div>.

👉 @sWebDev