Вёрстка сайтов | HTML, CSS, JS

Задача: Сделать тип, который делает все свойства объекта необязательными, кроме одного Есть тип пользователя:

    
        
  id: number
  name: string
  email: string
}{}
    

Нужно создать тип UpdateUser, который: • делает все поля необязательными • но поле id остаётся обязательным Результат должен быть таким:

    
        
  id: number
  name?: string
  email?: string
}{}
    

Условие: Нельзя писать тип вручную. Нужно использовать утилиты типов TypeScript. Подсказка: используй Partial и пересечение типов & Почему эти задачи полезны: 1. Они встречаются в реальных проектах например при работе с API или формами 2. Они учат использовать ключевые инструменты TypeScript keyof, Partial, пересечение типов 3. Это уровень middle-разработчика не синтаксис, а мышление типами #домашка

Макет для тренировки (technolabs) Перейти к макету 🧑‍💻 #практика | #макет

Анимация скролла с Grid Смотреть на codepen 👨‍💻 #практика

Яндекс вебмастер. Зачем нужен? Читать 👨‍💻 #полезности

Как frontend-разработчику вырасти в ЗП? День сурка frontend-разработчика выглядит так Зарплата замерла, задачи — бесконечный повтор, растет только кол-во бессмысленных созвонов Откликаешься на вакансии — отвечают только ноунеймы, на собесах закидывают странными алгоритмами «на скорость». И самое бесящее — пока буксуешь, кто-то вокруг спокойно забирает офферы в Яндекс и VK...

Ты тоже можешь получить оффер в компанию, в которой тебя будут ценить и хорошо платить.

👋 Меня зовут Тихон, привет! Я — действующий Frontend-разработчик и ментор. Я за руку довожу до оффера на хорошую позицию в Big Tech и сопровождаю на испытательном сроке. В своем канале: 👉Объясняю, как проходить HR-фильтр и превращать отклики в реальные приглашения 👉Помогаю найти мотивацию, борюсь убеждениями, которые мешают развиваться 👉На примерах объясняю, как проходить собеседования, включая техничку 👉Разбираю резюме и делюсь лайфхаками, например как аккуратно “пинговать” рекрутеров А еще регулярно публикую полезные материалы: ▪️Задачи, на которых валяться кандидаты ▪️База по микрофронтам ▪️Подборка из 100+ каналов с вакансиями для разработчиков ▪️100 вопросов, которые точно помогут тебе на собеседовании ▪️Чек лист проверки своего резюме А еще у меня множество успешных кейсов и трогательных отзывов, найти их можно в канале. Реклама, erid: 2W5zFGqHStH ИП Галактионов Тихон Витальевич, ИНН 771618975809

For...in Читать 👨‍💻 #js | #теория

Что такое type и зачем он нужен type это способ задать тип данных в TypeScript. Если говорить просто, type позволяет дать имя любому типу: объекту, строке, числу, объединению типов и даже функции. Начнём с самого базового примера:

    
        
  name: string
  isAdmin: boolean
}{}
    

Теперь этот тип можно использовать в любом месте кода: ```const user: User = { name: 'Tigran', isAdmin: false } По сути, type работает похоже на interface, когда речь идёт об объектах. Но у type есть возможности, которых нет у interface. 1. Можно создавать объединения типов (union types) type Status = 'loading' | 'success' | 'error' Теперь переменная может принимать только одно из этих значений: let status: Status status = 'loading' // OK status = 'done' // Ошибка Это очень удобно для состояний, ролей, типов уведомлений и других фиксированных значений. 2. Можно объединять типы type User = { name: string } type Admin = { permissions: string[] } type AdminUser = User & Admin Здесь используется оператор & — он объединяет типы. const admin: AdminUser = { name: 'Tigran', permissions: ['read', 'write'] } 3. Можно описывать примитивные типы type ID = string | number Теперь ID может быть строкой или числом: let userId: ID userId = 123 userId = 'abc-123' 4. Можно описывать функции type Calculate = (a: number, b: number) => number И использовать: const sum: Calculate = (a, b) => { return a + b } Когда использовать type: • когда нужны union или intersection типы • когда нужно дать имя примитивному типу • когда описываешь сложные типы данных • когда работаешь с утилитами типов (Partial, Pick, Omit и т.д.) Важно понимать: как и interface, type существует только во время разработки. В итоговый JavaScript он не попадает. Частый вопрос: в чём разница между type и interface? Коротко: • interface лучше подходит для описания объектов и их расширения • type более гибкий и подходит для сложных типов На практике в большинстве проектов используют оба. Для закрепления: попробуй описать тип Theme, который может принимать только значения 'light' или 'dark'. #ts

Подборка лучших постов за прошлую неделю Лучшие статьи @free_html_lessons: 1. Открытие окон и методы window 2. Как корректно измерять производительность JavaScript-кода 3. TypeScript: что такое interface и зачем он нужен Лучшие фронтенд вакансии @job_webdev: 1. Старший разработчик пользовательских интерфейсов 2. Стажер-frontend разработчик 3. HTML-верстальщик Лучшие дизайн вакансии @job_webdesign: 1. UX/UI-дизайнер 2. Дизайнер 3. Web-дизайнер (Junior+/Middle) #лучшеезанеделю

Задача: Сделать объект строго типизированным по ключам Есть объект с переводами:

    
        
  en: 'Hello',
  ru: 'Привет',
  hy: 'Բարև'
}{}
    

Нужно создать тип Language, который будет автоматически содержать только ключи этого объекта. То есть:

    
        type Language = ??? // 'en' | 'ru' | 'hy'{}
    

И затем использовать его:

    
        
  return translations[lang]
}
translate('en') // OK
translate('de') // Ошибка{}
    

Условие: Тип должен обновляться автоматически, если добавить новый язык в объект. Подсказка: используй keyof #домашка

Макет для тренировки (ломать не строить) Перейти к макету 🧑‍💻 #практика | #макет