CodeRoll | Frontend
Open in Telegram
OZ — Лучшее для разработчика и дизайнера / IT инструменты, курсы и книги — Веб-разработка на JS, HTML, CSS, React, Vue,Angular Купить рекламу: https://telega.in/c/coderoll Чат: https://t.me/coderoll_chat По всем вопросам пишите сюда - @yankovsky_ads
Show more4 113
Subscribers
No data24 hours
-167 days
-4030 days
Posts Archive
4 113
const animals = {};
let dog = { emoji: '🐶' }
let cat = { emoji: '🐈' }
animals[dog] = { ...dog, name: "Mara" }
animals[cat] = { ...cat, name: "Sara" }
console.log(animals[dog])4 113
Воплощённые типы
Хочу представить вам подход к определению типов, позволяющий сделать ваш код чище и понятнее. Я называю это «Воплощённые типы» («Embodied types»).
Воплощённый тип - тип, для которого определена переменная с одинаковым именем и в которой содержится объект с утилитами для этого типа.
Ссылка
#статьи
4 113
Пора переходить на микрофронтенд? Опыт «Инферит Клаудмастер»
В этой статье вы узнаете о:
факторах, сформировавших тренд на уход фронтенд-разработки от монолита к микрофронтенду,
процессах со стороны команды разработки при переходе на микрофронтенд,
кейсе платформы “Инферит Кладумастер”: почему для нашей команды микрофронтенд с плагином Module Federation стал полезным решением,
признаках того, что пора переходить на микрофронтенд.
Ссылка
#статьи
4 113
Пояснение к ответу
Функция updateUser обновляет значения свойств email и password у пользователя, если их значения переданы в функцию, после чего функция возвращает объект user. Возвращаемое значение функции updateUser — это объект user, что означает, что значение updatedUser является ссылкой на тот же объект user, на который указывает user. updatedUser === user равно true.
4 113
const user = {
email: "e@mail.com",
password: "12345"
}
const updateUser = ({ email, password }) => {
if (email) {
Object.assign(user, { email })
}
if (password) {
user.password = password
}
return user
}
const updatedUser = updateUser({ email: "new@email.com" })
console.log(updatedUser === user)4 113
Создание интерактивных анимаций с помощью React Spring
Эта статья посвящена React Spring — библиотеке анимации на основе JavaScript. Мы рассмотрим её фичи, включая различные хуки и компоненты, и то, как использовать их в приложениях.
Ссылка
#статьи
4 113
Всем привет! Напоминаю, что сегодня начинается фестиваль по трудоустройству для фронтендеров.
В рамках него вы можете:
— получить персональный фидбэк и советы по вашему резюме
— решить тестовое задание и получить разбор вашего решения
— пройти тестовое собеседование
На стримах вы сможете посмотреть, что спрашивают, как разбирают ответы участников, получить знания и стать увереннее в себе.
Сегодня вечером можно прийти посмотреть первый эфир и прокачать свое резюме по ссылке — будет полезно и интересно 🥸
4 113
Пояснение к предыдущему посту
Мы устанавливаем переменную calc равной новому экземпляру класса Calc. Затем мы создаем экземпляр нового экземпляра Calc и вызываем метод увеличения для этого экземпляра. Поскольку свойство count находится в конструкторе класса Calc, свойство count не используется в прототипе Calc. Это означает, что значение count не было обновлено для экземпляра, на который указывает calc, count по-прежнему равен 0.
4 113
class Calc {
constructor() {
this.count = 0
}
increase() {
this.count ++
}
}
const calc = new Calc()
new Calc().increase()
console.log(calc.count)4 113
Взгляд на асинхронность в JavaScript: роль Event Loop, промисов и async/await
В этой статье мы сосредоточимся на ключевых элементах асинхронного программирования в JavaScript: Event Loop, микро и макро задачи, Event Bus, промисы и синтаксический сахар async/await. Разберемся, как эти концепции взаимодействуют между собой и как их использование помогает нам создавать более эффективные и отзывчивые веб-приложения.
Ссылка
#статьи
4 113
Материалы из этого канала дают на платных курсах
Frontend Portal — настоящий портал для тех кто хочет стать востребованным frontend-разработчиком. Полезные ресурсы, шпаргалки, разбор вопросов с собеседований, задачи, викторины и многое другое
👉 Присоединяйтесь к @FrontendPortal и станьте частью дружного frontend-комьюнити!
4 113
Пояснение к предыдущему посту
? позволяет нам дополнительно получить доступ к более глубоким вложенным свойствам внутри объектов. Мы пытаемся зарегистрировать элемент с индексом 1 в подмассиве с индексом 1 массива fruits. Если подмассив с индексом 1 в массиве fruits не существует, он просто вернет undefined. Если подмассив с индексом 1 в массиве fruits существует, но в этом подмассиве нет элемента с индексом 1, он также вернет значение undefined.
Во-первых, мы пытаемся зарегистрировать второй элемент в ['🍍'] подмассива [['🍊', '🍌'], ['🍍']]. Этот подмассив содержит только один элемент, что означает, что в индексе 1 нет элемента, и возвращает значение undefined.
Затем мы вызываем функцию getFruits без передачи значения в качестве аргумента, что означает, что fruits по умолчанию имеет значение undefined. Поскольку мы условно связываем элемент с индексом 1 массива fruits, он возвращает значение undefined, поскольку этот элемент с индексом 1 не существует.
Наконец, мы попытаемся зарегистрировать второй элемент в ['🍊', '🍌'] подмассива ['🍍'], ['🍊', '🍌']. Элемент с индексом 1 в этом подмассиве — 🍌, который регистрируется.
4 113
function getFruit(fruits) {
console.log(fruits?.[1]?.[1])
}
getFruit([['🍊', '🍌'], ['🍍']])
getFruit()
getFruit([['🍍'], ['🍊', '🍌']])4 113
Кеширование next.js. Дар или проклятие
В 13 версии команда next.js представила новый подход к проектированию приложения - так называемый App Router. В 14 версии его сделали стабильным и основным для новых приложений.
App Router значительно расширяет функционал next.js - частичный пререндеринг, шаблоны, параллельные и перехватываемые роуты, серверные компоненты и многое другое. Однако, даже несмотря на все эти улучшения - далеко не все решили перейти на App Router. И на это есть свои причины.
Ссылка
#статьи
4 113
Как создать консалтинговый бизнес с доходом 500к за 60 д
Открой свой маркетинг-консалтинговый бизнес с 0 за 60 дней
- Без команды
- Без стартовых вложений
- С долгим циклом жизни клиента (от 3х месяцев)
- Без необходимости уходить с работы
- Тратя по 2 часа
Я записал бесплатный курс
Урок 1
Что такое маркетинговый консалтинг.
Кто такой маркетолог-стратег.
Как устроено ценообразование в консалтинге.
Урок 2
Что такое Эталонная Модель Маркетинга.
Как увеличить прибыль клиенту.
Как найти клиента и продать ему свой консалтинг.
Урок 3
Как устроена система продаж консалтинга.
Как себя позиционировать, чтобы клиент платил большой чек.
Как продавать консалтинг (2х- ходовая рабочая модель).
Урок 4
Как и где искать клиентов на консалтинг.
Бесплатные способы.
Платные способы.
Урок 5
Дорожная карта. Пошаговый план действий.
Смотреть
#реклама 16+
lp.emm.ms
О рекламодателе
4 113
className убивает ваш UI kit
UI kit играет важную роль в разработке веб-интерфейсов. Он представляет собой набор компонентов и стилей. Основная ценность его использования - это экономия времени. Вместо того, чтобы создавать каждый элемент с нуля, разработчики могут использовать уже готовые элементы, что ускоряет процесс разработки.
Ссылка
#статьи
4 113
Как интернет-магазину увеличить доход в 2 раза
Узнайте, как с помощью медийных инструментов Яндекса выстроить качественное взаимодействие с пользователями на всех этапах воронки и
- на 21% увеличить количество брендовых запросов в Поиске
- на 11% вырастить посещаемость интернет-магазина
- в 2 раза повысить доход
Подробнее о тактике кампании и о том, как медийная реклама повлияла на контекстное размещение, в кейсе по ссылке:
Узнать больше
#реклама
yandex.ru
О рекламодателе
