- Регистрация
- 22 Февраль 2018
- Сообщения
- 11.084
Автор: udemy
Название: Дизайн и код домашней страницы Twitter с помощью JavaScript, CSS и Figma (2022)
Описание:
Design & Code Twitter Home Page with JavaScript, CSS & Figma
udemy
В этом курсе мы узнаем, как использовать нативную технологию веб-компонентов в своих интересах.
- Создавайте красивые веб-компоненты для Twitter с помощью Figma
- Перенесите все эти красивые дизайны во внешний код с помощью Lit JS.
- Создайте светлый и темный пользовательский интерфейс для домашней страницы Twitter, используя JavaScript и Figma.
Прежде чем мы погрузимся непосредственно в интерфейсное кодирование, мы сначала спроектируем все в Figma с нуля .
- Мы не только разработаем компоненты в Figma, но и создадим дизайн-систему для нашего проекта Twitter UI.
- Мы разработаем повторно используемые цвета, типографику и стили теней.
- В конце переносим стили Figma в переменные CSS
Мы узнаем, как использовать Lit JS для разработки нативных общих компонентов .
- Мы узнаем, как инкапсулировать наши HTML и CSS в классы JavaScript, используя Lit JS.
- Мы научимся создавать простые, готовые к будущему нативные веб-компоненты.
- Мы используем только чистый ванильный JavaScript для создания настраиваемых компонентов и применения наших стилей CSS внутри каждого из них.
Одна из лучших практик во фронтенд-разработке — как можно больше повторно использовать код. Однако перенос дизайна в HTML-разметку, как правило, представляет собой сложную задачу .
- Мы будем использовать Lit JS, чтобы упростить нашу жизнь, потому что он построен на основе собственного API веб-компонентов.
- Поскольку Lit JS использует собственный API веб-компонентов, наша среда разработки проста, но мощна.
- Это означает, что нам не нужно беспокоиться о Node Modules или сборщиках JavaScript для преобразования нашего синтаксиса в код.
Для кого этот курс:
- Дизайнеры, которые хотят добавить проект Twitter Figma в свое портфолио
- Разработчики, которые хотят перенести компоненты Figma в код
- Разработчики, которые хотят создавать нативные пользовательские компоненты с нуля
Требования
- Продвинутые знания HTML, CSS, JavaScript
- Среднее понимание Figma
Материал на английском языке
Подробнее:
Скачать:
Название: Дизайн и код домашней страницы Twitter с помощью JavaScript, CSS и Figma (2022)
Описание:
Design & Code Twitter Home Page with JavaScript, CSS & Figma
udemy
В этом курсе мы узнаем, как использовать нативную технологию веб-компонентов в своих интересах.
- Создавайте красивые веб-компоненты для Twitter с помощью Figma
- Перенесите все эти красивые дизайны во внешний код с помощью Lit JS.
- Создайте светлый и темный пользовательский интерфейс для домашней страницы Twitter, используя JavaScript и Figma.
Прежде чем мы погрузимся непосредственно в интерфейсное кодирование, мы сначала спроектируем все в Figma с нуля .
- Мы не только разработаем компоненты в Figma, но и создадим дизайн-систему для нашего проекта Twitter UI.
- Мы разработаем повторно используемые цвета, типографику и стили теней.
- В конце переносим стили Figma в переменные CSS
Мы узнаем, как использовать Lit JS для разработки нативных общих компонентов .
- Мы узнаем, как инкапсулировать наши HTML и CSS в классы JavaScript, используя Lit JS.
- Мы научимся создавать простые, готовые к будущему нативные веб-компоненты.
- Мы используем только чистый ванильный JavaScript для создания настраиваемых компонентов и применения наших стилей CSS внутри каждого из них.
Одна из лучших практик во фронтенд-разработке — как можно больше повторно использовать код. Однако перенос дизайна в HTML-разметку, как правило, представляет собой сложную задачу .
- Мы будем использовать Lit JS, чтобы упростить нашу жизнь, потому что он построен на основе собственного API веб-компонентов.
- Поскольку Lit JS использует собственный API веб-компонентов, наша среда разработки проста, но мощна.
- Это означает, что нам не нужно беспокоиться о Node Modules или сборщиках JavaScript для преобразования нашего синтаксиса в код.
Для кого этот курс:
- Дизайнеры, которые хотят добавить проект Twitter Figma в свое портфолио
- Разработчики, которые хотят перенести компоненты Figma в код
- Разработчики, которые хотят создавать нативные пользовательские компоненты с нуля
Требования
- Продвинутые знания HTML, CSS, JavaScript
- Среднее понимание Figma
Материал на английском языке
Подробнее:
Для просмотра содержимого вам необходимо авторизоваться.
Скачать:
Скрытое содержимое могут видеть только члены группы Премиум.
Скрытый контент для пользователей All-dar.