​​👍Webpack: заменить нельзя оставить

В этой статье расскажет про свой опыт работы с webpack и поможет поставить запятую в заголовке статьи.

Читать...


Original post link: t.me/frontendnoteschannel/3275
Forwarded and filtered by @smartfeed_bot

Smooth Liquid Background Effect

"Кляксы" созданы в HTML, а в JS создана логика их передвижения и анимации.

👉 @seniorFront


Original post link: t.me/seniorFront/3781
Forwarded and filtered by @smartfeed_bot

​​🤔Микросервисы на фронтенде — что выбрать

В этой статье представлено сравнение четырех основных подходов к работе с микрофронтендами на фронтенде: Single SPA, Module Federation, NPM modules и Git Submodules.

Читать...


Original post link: t.me/frontendnoteschannel/3276
Forwarded and filtered by @smartfeed_bot

Объясните разницу между const person = Person() и const person = new Person() при function Person(){}

Если функция Person() не возвращает явным образом создаваемый экземпляр, то вариант const person = Person() присвоит константе person значение undefined, поскольку именно таков результат void функции.

Если функция Person явным образом возвращает экземпляр, он станет значением константы person при const person = Person().

Однако, вариант с использование оператора new "выигрывает", поскольку он устанавливает корректную связь объекта person с цепочкой прототипов Person, в то время как выражение const person = Person() просто присваивает константе результат вызова функции.


Original post link: t.me/senior_front/1848
Forwarded and filtered by @smartfeed_bot

This is a daily stats digest!
Today the bot processed: 14 messages
Today you received: 12 messages
Our filtering prevented you from: 2 messages

Top 3 source channels:
Frontender's notes [ru]: 9 message(s)
Senior Frontend - javascript, html, css: 2 message(s)
Веб-страница: 1 message(s)


React to posts with 👍, 👎, ❤️, or 🔥. Spot spam? Mark it with 🤬 or 💩. Your input is valuable!
Text t.me/OlegBEZb if you want to see something else in the daily report

Укорачивание массива

Этот способ позволяет зафиксировать размер массива и удалить все лишние элементы. Например, у вас есть массив из 6 элементов, а вам нужны только первые 3. В таком случае достаточно одной простой команды: array.length = 3.

#массивы


Original post link: t.me/senior_front/1849
Forwarded and filtered by @smartfeed_bot

‼️Всем кодерам посвящается‼️

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

🪩 Расставь приоритеты, добавь лёгкости в свою работу и становись лучше с @code_ready


Original post link: t.me/seniorFront/3782
Forwarded and filtered by @smartfeed_bot

​Почему TypeScript считает compatible тип функции с меньшим количеством аргументов?

Ковариантность в TypeScript:
В контексте TypeScript, если функция ожидает аргументы определенного типа, то она также считается совместимой с функцией, требующей более узкий объем аргументов или более конкретный тип. То есть, функция, принимающая меньшее количество аргументов, считается совместимой с функцией, ожидающей большее количество аргументов, если они имеют подходящие типы. Это согласуется с принципом поддержки того, чтобы "меньший" тип мог быть использован в контексте, где ожидается "больший" тип.

Пример:

 type User = { name: string; };
 type Admin = { name: string; adminRights: boolean; };

 function logUser(user: User) {
   console.log(user.name);
 }

 const admin: Admin = { name: 'Alice', adminRights: true };

 logUser(admin); // TypeScript разрешит передачу admin в logUser

Преимущества:
1. Это предоставляет бóльшую гибкость в работе с функциями.
2. При правильном использовании позволяет избежать избыточной информации в определении функций.

Недостатки:
1. Может потенциально вызвать ошибки в ситуациях, когда поддерживается передача дополнительных аргументов без явного указания этого в сигнатуре функции.
2. Может показаться непривычным для разработчиков, привыкших к более строгой типизации в других языках.

👉 @seniorFront

​​🎃Как сделать SILO-структуру сайта

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

Читать...


Original post link: t.me/frontendnoteschannel/3278
Forwarded and filtered by @smartfeed_bot

Day & Night Toggle

Внутри переключателя SVG картинка, стилизованная в CSS. Логика изменения фона реализована в JS.

👉 @seniorFront


Original post link: t.me/seniorFront/3784
Forwarded and filtered by @smartfeed_bot

💾 Responsive GSAP Slider – слайдер для представления продуктов с подвижными SVG-картинками. Слайдер можно легко настроить под себя.

Сайтодел | #сниппет #css


Original post link: t.me/sitodel/1651
Forwarded and filtered by @smartfeed_bot

​Фронтендеры: Это ошибки бэкенда.

Бэкендеры: На нашей стороне нет ошибок, ищите у себя.

Тем временем где-то в серверной:


Original post link: t.me/tproger_web/4342
Forwarded and filtered by @smartfeed_bot

​​🧐Микровселенная безумия, или Как устроены микрофронтенды в Dodo

В этой статье автор расскажет о процессе разработки и доставки микрофронтендов с использованием Single-spa, SystemJS и import-map-overrides, а также о подходе к Continuous Delivery микрофронтендов.

Читать...


Original post link: t.me/frontendnoteschannel/3279
Forwarded and filtered by @smartfeed_bot

This is a daily stats digest!
Today the bot processed: 14 messages
Today you received: 13 messages
Our filtering prevented you from: 1 messages

Top 3 source channels:
Веб-страница: 6 message(s)
Frontender's notes [ru]: 3 message(s)
Senior Frontend - javascript, html, css: 3 message(s)


React to posts with 👍, 👎, ❤️, or 🔥. Spot spam? Mark it with 🤬 or 💩. Your input is valuable!
Text t.me/OlegBEZb if you want to see something else in the daily report

Создаём генератор персонажа

Этот codepen-проект Kodama Generator показывает необычную стороны возможностей CSS и JavaScript для создания персонажей с рандомизацией некоторых деталей.

Исходники: https://codepen.io/pavlovsk/pen/rNYwKeo

#codepen


Original post link: t.me/tproger_web/4343
Forwarded and filtered by @smartfeed_bot