По каким материалам вы предпочитаете изучать фронтенд-разработку?
anonymous poll

Статьи на русском языке – 405
👍👍👍👍👍👍👍 53%

Статьи на английском языке – 194
👍👍👍 25%

Видео на русском языке – 112
👍👍 15%

Видео на английском языке – 56
👍 7%

👥 767 people voted so far.

​Веб в 2020 году: расширяемость и совместимость

В 2020 году основными трендами сообщества веб-разработчиков вполне предсказуемо станут расширяемость и совместимость.

* CSS Houdini
* Вариативные шрифты
* Кастомные свойства
* Веб-компоненты
* Логические свойства
* Учет пользовательских предпочтений
и еще много интересного

Читать: https://prglb.ru/156nl

#css

ПЕРВЫЙ ОНЛАЙН-КУРС В РУНЕТЕ, по Flutter в мобильной разработке.

Перспективной технологии, которую уже используют Google, Alibaba, eBay, BMW и другие мировые бизнес-империи!🔥

Курс предлагает изучение мультиплатформенной разработки на языке Dart. Вы научитесь создавать эффектный Frontend и максимально отзывчивый UI с потрясающей анимацией и стабильными 60 FPS.

• Длительность курса 3,5 месяца
• Более 40 часов лекций и 100 часов практики
• Code Review вашего проекта
• Cистема автоматической проверки заданий

❗️Результатом обучения станет реально выполненный проект – созданное вами мобильное приложение на Flutter, и сертификат, подтверждающий полученные навыки.
⠀
Узнай больше о новом курсе по Flutter-разработке от Skill-Branch.🚀
Перейти на сайт
===========================
🗣Приобщайся к сообществу в чате, посвящённом Flutter-разработке
👉🏼 @Flutter_Mobile_Dev

Внутренние размеры в CSS

Что такое min-content, max-content, fit-content и как ими пользоваться?

Разбираемся с размерами, зависящими от контента, и рассматриваем несколько популярных кейсов, в которых они могут быть полезны.

Читать: https://prglb.ru/yj5

#css

Все, что вам нужно для начала работы с VueJS

Небольшое вводное руководство, в котором вы найдете целых 4! способа создания первого приложения на Vue. Бонусом - много полезных ссылок и советов.

Читать: https://prglb.ru/wd8d

#frameworks #vue

Небезопасные промисы

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

Подробнее о проблеме и ее решении: https://prglb.ru/2z3uz

#javascript #advanced

​Подборка библиотек для создания анимаций и эффектов

Выбирайте 🤗

CSS

Простые эффекты:

👉 CSS WAND
Очень маленькая copy-past библиотечка с симпатичными эффектами наведения и загрузки

👉 CSShake
Забавные shake-эффекты

👉 Three Dots
Классические анимации загрузки с тремя точками

Коллекции популярных анимаций появления-исчезновения (bounce, slide и т.д.):

👉 Vov.css
👉 Tuesday
👉 Animation library
👉 Animate.css (очень большой набор эффектов)
👉 Magic (много нестандартных анимаций)
👉 Woah.css (эксцентричные анимации)

JS

👉 Scene.js
Мощный инструмент с поддержкой CSS, JS и SVG-анимаций

👉 Micron.js
Контролируемые микроанимации

👉 Popmotion Pure
Анимации и эффекты на любой вкус, гибкая настройка

Графика:

👉 Granim.js
Красивые анимированные градиенты

👉 Curtains.js
Невероятные WebGL-эффекты для изображений и видео

Скролл-анимации:

👉 AOS
👉 Sal.js
👉 ScrollReveal

Анимация частиц:

👉 Particles.js

#tools #library #animation

Повесть об однонаправленном потоке данных в Angular

Направление потока данных зачастую путают с концепцией двустороннего связывания. Это происходит потому, что оба явления связаны с данными.

Разбираемся, что есть что, и почему однонаправленный поток рулит.

Читать: https://prglb.ru/3syte

#frameworks #angular

JavaScript Web Workers: руководство для начинающих

Веб-воркеры позволяют преодолеть однопоточные ограничения браузера и вынести тяжелые операции в отдельные фоновые потоки выполнения.

Пишем самый простой веб-воркер и учимся общаться с ним.

const worker = new Worker("worker.js");

Читать: https://prglb.ru/21jlh

#pwa #javascript

Используем Google-таблицы вместо базы данных

🗓 А вы знали, что данные для вашего сайта можно хранить в обычных гугл-таблицах? Оказывается, это невероятно просто!

Попробуйте сами: https://prglb.ru/1zsjk

#tools #library

Все, что вы хотели знать о TypeScript

Полноценное введение в TypeScript

🐣 для начинающих

Статическая типизация
Как указывать типы
Линтинг на лету
Работа с функциями
Интерфейсы
Enum
Абстрактные классы
Модификаторы классов

🦁 для продвинутых

Конфигурация компилятора
Дженерики
Декораторы
Пространства имен

#typescript #beginners #advanced #video

React vs Svelte

Создаем одно и то же приложение на React и на Svelte. Есть ли разница?

Сравнить: https://prglb.ru/2k9a5

#frameworks #react #svelte

«Каждый охотник желает знать»: теория цвета для веба и приложений

Рассказываем, как правильно подбирать и комбинировать цвета. Цветовой круг, модель HSL, цветовые схемы и психология, советы и правила. Показываем на примерах, как применять в CSS.

Смотреть: https://prglb.ru/19u2h

#interface #css

Секреты правильной растяжки: адаптивные графики в вебе без клиентского JavaScript

О том, как делать графики, которые сами приспособятся к размерам области вывода данных. На случай, если в браузере выключен JavaScript или что-то пошло не так.

Узнать подробнее: https://prglb.ru/5bcel

#tools #svg #library

Parcel

Очень быстрый сборщик модулей без всяких настроек.

Умеет работать с JS, TS, Babel, процессорами CSS, Pug, Vue, React и еще некоторыми типами ассетов из коробки. Он даже необходимые модули самостоятельно скачивает!

Просто берите, подключайте - и пишите проект. Parcel позаботится о его сборке самостоятельно.

Идеальное решение для небольших/несложных проектов со стандартными технологиями.

Документация: https://ru.parceljs.org
Обновляющийся список полезных материалов: https://prglb.ru/1fd4b

#tools

Хотите быть в курсе новых конференций, митапов по фронтенду? Мы сделали бота, который оперативно оповещает о новых мероприятиях, и вы не пропустите все самое интересное.

Подписывайтесь: t.me/event_listener_bot

Все, что вы должны знать о каркасных экранах

Каркасные экраны (Skeleton Screens) позволяют загружать данные по мере их готовности, не вызывая при этом беспокойства у пользователей.

Читать: https://prglb.ru/1lyxt

#interace

Шпаргалка по самым распространенным операциям над массивами в JavaScript

15 важнейших операций - от перебора до сортировки с наглядными примерами.

Смотреть: https://prglb.ru/3pbwq

#javascript #core #cheatsheets

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

Прекрасные новости для каждого, кто хочет вывести работу своей команды на новый уровень! GeekBrains запускает трёхдневный интенсив по методологии Agile.

В ходе интенсива вы не только познакомитесь с «гибкими» подходами, но научитесь выбирать подходящие для решения любой задачи. На практике вы разберёте реальные кейсы и научитесь внедрять и применять Agile-методы в своих проектах.

Успейте подать заявку и повысьте свою эффективность - https://prglb.ru/3ph0p