ООП на простых примерах

Статья объясняет основные концепции объектно-ориентированного программирования (ООП) в JavaScript с помощью доступных примеров. В ней рассматриваются ключевые принципы: наследование, инкапсуляция, абстракция и полиморфизм. Примеры включают создание классов, использование конструкторов, наследование свойств и методов между классами, а также применение методов для инкапсуляции данных и абстракции функций. Это позволяет наглядно увидеть, как реализовать ООП в JavaScript и применять его в разработке приложений.

👉 @web_craft | #frontend

CSS Switch Day and Night - Cat

Анимированный переключатель с кошкой на CSS.

👉 @web_craft | #frontend

Реагирования на изменения сетевого состояния

Какое событие генерируется объектом window, когда соединение с сетью восстановлено?

Если забыли, то вернитесь к посту от 25.06.2024.

👉 @web_craft | #frontend

Управление промисами в JavaScript

promise.withResolvers() — удобный метод в JavaScript для создания промиса и доступа к его resolve и reject. Это упрощает управление промисами.

Пример:

const { promise, resolve, reject } = promise.withResolvers();

promise.then(value => {
    console.log('Промис выполнен с:', value);
}).catch(error => {
    console.error('Промис отклонен с ошибкой:', error);
});

// Разрешение промиса
setTimeout(() => resolve('Успех!'), 2000);

// или отклонение промиса
// setTimeout(() => reject('Ошибка!'), 2000);

Реализация promise.withResolvers():

function promiseWithResolvers() {
    let resolve, reject;
    const promise = new Promise((res, rej) => {
        resolve = res;
        reject = rej;
    });
    return { promise, resolve, reject };
}

Этот метод полезен для управления асинхронными операциями из внешнего контекста.

👉 @web_craft | #frontend

Объединение веб-приложений и нативных приложений с помощью неизвестных JavaScript API

Статья описывает четыре малоизвестных JavaScript API, которые помогают сблизить возможности веб-приложений с нативными. API Web Share позволяет веб-приложениям делиться контентом с другими приложениями на устройстве пользователя. Статья включает примеры и код для внедрения этих API, показывая, как они могут улучшить взаимодействие пользователей с веб-приложениями.

👉 @web_craft | #frontend

Neuro Noise

Интерактивный фон реализованный с использованием GLSL.

👉 @web_craft | #frontend

Прерывание запросов в JavaScript с помощью AbortSignal

AbortSignal — это встроенный объект в JavaScript, который используется для отмены асинхронных операций, таких как сетевые запросы, до их завершения. Это полезно для управления долгими или ненужными запросами.

Метод AbortSignal.timeout() позволяет установить тайм-аут для запроса fetch. Если запрос не завершится за заданное время, он будет автоматически отменен.

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

async function fetchData() {
  try {
    const response = await fetch(url, {
      signal: AbortSignal.timeout(5000)
    });
    // Обработка успешного ответа
  } catch (e) {
    if (e.name === 'TimeoutError') {
      // Обработка ошибки тайм-аута
    } else {
      // Обработка других ошибок
    }
  }
}

В этом примере запрос будет отменен, если ответ не поступит в течение 5 секунд. Если запрос отменен по причине истечения времени, будет выброшена ошибка TimeoutError.

👉 @web_craft | #frontend

Запуск приложения Remix с Postgres, используя Prisma

Статья объясняет, как создать приложение на Remix с использованием базы данных Postgres и ORM Prisma. Руководство включает настройку и развертывание приложения на платформе Fly.io, а также настройку базы данных и переменной окружения для подключения.

👉 @web_craft | #frontend

Neon Clock

Неоновые анимированные часы на CSS.

👉 @web_craft | #frontend

Работа с scheduler.postTask

Какой приоритет задачи можно задать с помощью scheduler.postTask?

Забыли? Вернитесь к посту от 08.07.2024.

👉 @web_craft | #frontend