Calculator

Калькулятор, выполненный с применением библиотеки Babel.js.

👉 @sWebDev

Location в Angular

Сервис Location позволяет получить URL текущего окна браузера. В зависимости от используемой стратегии LocationStrategy, Location будет сохраняться либо в пути URL, либо в сегменте хэша URL.

С помощью Location мы можем перейти по URL, перемещаться вперед в истории платформы, вернуться назад в истории платформы, изменить URL браузера, или заменить верхний элемент в стеке истории платформы.

Для использования сервиса Location мы внедряем его из CommonModule.

     import { Location } from "@angular/common"
   @Component({
       ...
   })
   export class AppComponent {
       constructor(private location: Location) {}
       navigateTo(url) {
           this.location.go(url)
       }
       goBack() {
           this.location.back()
       }
       goForward() {
           this.location.forward()
       }
   }

👉 @sWebDev

Concatenated Figures

"Резиновый" эффект при наведении, выполненный с использованием GSAP.js.

👉 @sWebDev

Создание страницы новостной рассылки с помощью Vue и Firebase Cloud Firestore

Включение возможности подписки на новости на веб-сайте имеет важное значение в рамках цифровой стратегии. Это позволяет расширить список адресов электронной почты и информировать подписчиков о последних продуктах, историях, блогах, новых функциях и других бизнес-событиях. Также этот инструмент помогает продвигать нашу продукцию среди широкой и разнообразной аудитории. В данной статье мы разберем понятия Firebase и Cloud Firestore, а также узнаем, как создать мощную страницу подписки на новости с использованием этих инструментов.

👉 @sWebDev

Blip

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

👉 @sWebDev

Slider Swiper.js

Карточки блюд, выполненные с применением библиотеки Swiper.js.

👉 @sWebDev

Руководство по Angular Signals с практическими примерами использования (часть 1)

Руководство по сигналам в Angular с практическими примерами. Материал освещает концепцию сигналов, их роль в управлении данными и взаимодействии компонентов. Структурированный подход к сигналам улучшает организацию кода и обеспечивает более гибкую архитектуру. Это первая часть из серии, в которой будут рассмотрены вариации использования сигналов.

👉 @sWebDev

Flatpickr

Flatpickr - легковесная и настраиваемая JavaScript библиотека для выбора даты и времени в веб-приложениях. Она обладает богатым функционалом и поддерживает различные форматы дат, локализацию и темы оформления. Удобен для создания интерфейсов с выбором дат и времени.

👉 @sWebDev

Представляем атомарный дизайн в Vue.js

Атомный дизайн — это методология создания систем дизайна, которая разбивает пользовательские интерфейсы на небольшие повторно используемые компоненты.
Рассмотрим:
1. Атомы.
2. Молекулы.
3. Организмы.
4. Шаблоны.
5. Страницы.

👉 @sWebDev

Как установить заголовок страницы в Angular из компонента?

В Angular есть функционал, позволяющий задавать title из компонента. Как это можно сделать?

👉 @sWebDev

Falling autumn leaves shader

Осенняя атмосфера в анимированном проекте на Three.js.

👉 @sWebDev

Декоратор Attribute в Angular

В Angular есть декоратор Attribute, который позволяет передавать статическую строку без дополнительной нагрузки на производительность путем устранения проверки на изменения в ней. Значения декоратора Attribute проверяются однократно. Подход имеет сходство с декоратором @Input:

    @Component({
        ...
    })
    export class BlogComponent {
        constructor(@Attribute("type") private type: string ) {}
    }

👉 @sWebDev

Loader

Прелоадер, выполненный в формате разделения клеток. Реализовано на Splitting.js и Gsap.js.

👉 @sWebDev

Создание доступных форм в Vue с помощью Formkit

Рассмотрим использование FormKit во Vue для создания доступных форм. Материал дает понимание о том, как обеспечить доступность веб-форм для всех пользователей, включая людей с ограниченными возможностями.

👉 @sWebDev

ngx-mask

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

👉 @sWebDev

The Basement

Анимированная загрузка текста, выполненная на Splitting.js.

👉 @sWebDev

Топ 8 инструментов для разработки на Angular в 2023 году

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

👉 @sWebDev

ngx-spinner

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

👉 @sWebDev