📖 Веб-компоненты в действии
🖋 Бен Фаррелл, 2020

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

💾 Скачать книгу

#book #web

📑 Паттерн порталов в Angular: для чего нужен root-компонент в Taiga UI

Что такое портал?

Представьте себе компонент select. У него есть выпадашка с вариантами на выбор. Если хранить ее в том же месте в DOM, что и сам компонент, можно нарваться на ряд проблем. Нижестоящие элементы могут выскочить поверх, а контейнер — срезать содержимое...

#статьи #angular #typescript

🛠 Vant — более 60 компонентов для Vue.js, включая ввод формы, различные виды мобильных меню, а также другие виджеты, такие как цифровые кнопки, панели поиска, средство загрузки файлов и многое другое. Она также поддерживает настраиваемые темы и содержит понятные, простые в использовании документы.

#инструменты #js

💡 Замыкания в JavaScript

Часть 2

Перед прочтением рекомендуем ознакомиться с первой частью.

...Или же более «правдоподобный» пример. У вас может быть некая функция apiConnect(apiKey), которая возвращает некоторые методы с использованием API ключа. В таком случае этот ключ нужно передать только один раз.

function apiConnect(apiKey) {
 function get(route) {
   return fetch(`${route}?key=${apiKey}`);
 }

 function post(route, params) {
   return fetch(route, {
     method: 'POST',
     body: JSON.stringify(params),
       headers: {
         'Authorization': `Bearer ${apiKey}`
       }
     })
 }
 return { get, post }
}

const api = apiConnect('my-secret-key');

// Больше передавать ключ не нужно
api.get('http://www.example.com/get-endpoint');
api.post('http://www.example.com/post-endpoint', { name: 'Joe' });

#советы #coding #js #web

📑 Что не так с WebAssembly?

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

WebAssembly, в теории, может позволить кому угодно писать низкоуровневый код, выполняющийся в браузере, в безопасном виртуальном окружении. И, что ещё интереснее, технология WASM (сокращение от WebAssembly) была спроектирована как цель компиляции для других языков, позволяя коду, который обычно выполняют в серверной среде (например — коду, написанному на C или на C++), компилироваться в соответствующий формат и выполняться в браузере.

У WASM был огромный потенциал и невероятные перспективы. Что же пошло не так? Почему WASM, через 3 года после релиза, ещё не используется в каждом веб-проекте? Есть ли у WASM будущее в веб-разработке? Поищем ответы на эти вопросы.

#статьи

Выберите правильный вариант 👇🏼 #test #js

🛠 Barba.js — библиотека JavaScript для создания плавных переходов между страницами сайта. Она берёт статический веб-сайт и с помощью небольшой настройки превращает его в одностраничное приложение. Это помогает уменьшить задержку между загрузкой страниц, сводит к минимуму HTTP-запросы и улучшает взаимодействие с пользователем.

#инструменты #js

💡 Деструктуризация в JavaScript

▍Часть 1

Деструктуризация — это просто способ извлечения свойств из объектов.

const obj = {
 name: 'Joe',
 food: 'cake'
}
const { name, food } = obj;
console.log(name, food);
// 'Joe' 'cake'

Если вам нужно извлечь свойство, дав ему другое имя, — делайте так:

const obj = {
 name: 'Joe',
 food: 'cake'
}

const { name: myName, food: myFood } = obj;
console.log(myName, myFood);

// 'Joe' 'cake'

Продолжение следует...

#советы #coding #js #web

📑 Яндекс отключил расширения с аудиторией в 8 млн пользователей

Яндекс принял решение отключить расширения SaveFrom.net, Frigate Light, Frigate CDN и некоторые другие, установленные у пользователей Яндекс.Браузера. Совокупная аудитория этих инструментов превышает 8 млн человек.

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

#статьи

🛠 URL Pages — инструмент, который объединяет все содержимое страницы (включая HTML, CSS и JS) и сохраняет его в URL-адресе. Это позволяет создать мгновенно доступную и редактируемую веб-страницу, которую сможет увидеть любой, у кого есть ссылка. Включает конструктор, с помощью которого вы можете создавать свои собственные URL-страницы.

#инструменты #web #js #html #css

Выберите правильный вариант 👇🏼 #test #js

📑 Mozilla «убила» прогрессивные веб-приложения в Firefox 85

На днях Mozilla представила новую версию Firefox — Firefox 85. Основное внимание пользователей привлекла защита от supercookies в браузере. Но, как оказалось, вместе с положительными изменениями, в свежем релизе нашлось место и «большому шагу назад».

#новости

💡 Деструктуризация в JavaScript

Перед прочтением рекомендуем ознакомиться с первой частью.

▍Часть 2

В следующем примере деструктуризация применяется для «чистой» передачи объекта person в функцию introduce. Иначе говоря, деструктуризация может использоваться для непосредственного извлечения передаваемых параметров. Для тех, кто разрабатывает на React, это может показаться знакомым.

const person = {
 name: 'Eddie',
 age: 24
}

function introduce({ name, age }) {
 console.log(`I'm ${name} and I'm ${age} years old!`);
}

console.log(introduce(person));
// "I'm Eddie and I'm 24 years old!"

#советы #coding #js #web

🎁 Бесплатная раздача для подписчиков

Специально для подписчиков наших каналов о программировании, мы бесплатно раздаем файл 📦 Moleculed - Design Starter Library через UI8 Bot. Чтоб получить этот файл бесплатно, достаточно нажать на кнопку под постом.

Внимание! Раздача ограничена по времени.

TypeScript за 100 секунд

Изучите основы TypeScript всего за 100 секунд с помощью данного видео.

📺 YouTube

#видео #typescript #js

🔥 Лучшее на канале за неделю

1. Mozilla «убила» прогрессивные веб-приложения в Firefox 85.

2. Barba.js — библиотека JavaScript для создания плавных переходов между страницами сайта.

3. Деструктуризация в JavaScript: Часть 1 | Часть 2.

📑 Защитник Windows нашёл троян в свежем обновлении Google Chrome

Недавно случилась достаточно интересная история. Защитник Windows для бизнеса (Microsoft Defender ATP) определил новейшее обновления браузера Google как троян

#новости

Выберите правильный вариант 👇🏼 #test #js