Веб-разработка *

Что делает разработчик, если ему нужно раскрасить кнопку в красный цвет? Ищет в npm пакет, окрашивающий кнопки в красный цвет

В реестре npm — более миллиона пакетов почти для чего угодно. Например, с их помощью можно минифицировать код, удалять и переименовывать файлы, создавать спрайты, отправлять сообщения в центр уведомлений операционных систем, работать с препроцессорами Less и Sass и выполнять многие другие действия, упрощающие и автоматизирующие работу над проектом. 

Конечно, бездумно использовать менеджер пакетов не стоит: некоторые задачи можно решить и без него. Но всё же npm-пакеты полезны и постоянно применяются в веб-разработке. Поэтому важно знать, как их правильно выбрать, где искать и на что обратить внимание перед установкой.

Пару лет назад наш коллега Анатолий Ерофеев написал эту статью, но как оказалось, она еще пока актуальна. Поэтому не судите строго.

Любите ли вы комиксы так, как люблю их я? Если нет, то вы просто неправильно их смотрите! Переписать сюжет в виде программного кода — и отдых, и развлечение, и возможность потренироваться. 

Всем привет, это снова Макс Кравец из Holyweb, и сегодня мы будем косплеить Ивана Ванко, то есть делать дронов. Много дронов. Для этого нам понадобится целая фабрика. Поехали!

Вы и без нас знаете, что у WordPress есть проблемы. Да, при создании сайтов им пользуются в 40% случаев — на то он и простой, как трёхколёсный велосипед. Но проблема в том, что при желании из этого велосипеда легко можно собрать хоть Франкенштейна социальную сеть с экосистемой встроенных сервисов — достаточно установить десяток-другой, а то и сразу сотню плагинов на сайт. В результате возникают проблемы с безопасностью, совместимостью расширений и скоростью загрузки сайта. Хорошая новость в том, что есть как минимум пять способов заставить WordPress работать лучше — подробней о них в нашей подборке плагинов. О большинстве из них вы уже наверняка слышали, но в списке есть и одна новинка — вместе с другими решениями она позволит вашим пользователям забыть об ожидании загрузки контента на сайте.

Эта статья для новичков и не претендует на высокий технический уровень, а если вам интересны сложные современные решения, обратите внимание, например, на статью о GIRAFFE, который для генерации реалистичного движения объединяет самые современные подходы в ИИ.

В конце статьи вы найдёте ссылки на проект очень простой веб-страницы с распознаванием рукописного ввода при помощи ИИ, а прочитав это руководство, переводом которого мы делимся к старту курса о машинном и глубоком обучении, сможете самостоятельно написать такую страницу. Для этого вам понадобится свой блокнот Colab или блокнот автора статьи. Скачиваемые блокнотом файлы модели занимают меньше мегабайта.

Сейчас, когда количество устройств стало бо́льшим, чем когда-либо прежде, мы, разработчики, больше не можем полагаться на область видимости, как единственный фактор, определяющий стилизацию сайта. До недавнего времени мы могли отталкиваться от размера устройства: например, считая, что на мобильных устройствах используется сенсорный ввод, а на устройствах с большим экраном — мышь. И на этом основании с помощь медиазапроса определить вариант стилизации содержимого:

Когда мы пишем статьи о своем сервере в комментариях очень часто находится читатель, который говорит:

"И зачем такой огород городить? Все это одной FFmpeg командой делается!"

К старту курса по Frontend-разработке делимся переводом подборки различных инструментов: от генератора CSS, который рассчитывает пространство так, что брейкпоинты (контрольные точки) заменяются переменными, до редактора анимации прямо в браузере, а также средства масштабирования для отзывчивости в SVG и даже визуализатора специфичности CSS, который пригодится при анализе больших таблиц стилей. Мы структурировали и, где это было возможно, расширили оригинал, добавив информацию и примеры из репозиториев и официальных описаний инструментов.

В начале 2016 года в опросе Лии Веру в Твиттере половина из 3578 человек ответили, что не очень комфортно чувствуют себя с JavaScript. И речь не только о новичках. Профессионалам тоже нелегко — ежедневно выходит огромное количество библиотек, и невозможно уследить за всеми современными трендами в мире веб-разработки. 

Но кое-что все-таки выделяется. В 2016 году появилась новая технология от лаборатории Массачусетского технологического института — Mavo. Он прекрасен тем, что позволяет прокачать HTML за счёт добавления в него относительно небольшого количества атрибутов. В результате вы получаете рабочее веб-приложение так, будто вы использовали JavaScript, но на самом деле кода JS там будет ноль. Точнее, там не будет JS-кода, который вам пришлось бы писать руками.

Дмитрий Шарабин, евангелист технологии Mavo, сегодня расскажет нам про ее 50 цветных оттенков. Видео его выступления на FrontendConf 2020 — здесь.

Представьте диалог:

—  Здравствуйте, я водитель КАМАЗа!

—  Добрый день, к сожалению, в нашем автопарке только ЗИЛы, позовите следующего кандидата, пожалуйста!

Странный диалог, не так ли? Ведь очевидно, что основной профессиональный «скилл» водителя — умение управлять транспортным средством. Каким конкретно — вопрос, по большому счету, вторичный. С разработчиками — то же самое.

Всем привет, это Макс Кравец из Holyweb, и сегодня мы поговорим о том, почему фронтенд-разработчику важно учить JavaScript, а не фреймворк или библиотеку.

Первый опыт в веб-разработке и работе с векторной графикой.

function test() {
  return 'one';
  return 'two';
  return 'three';
}

PHP 8.1 выйдет через несколько месяцев и я в восторге от множества нововведений! Хочу поделиться реальным влиянием PHP 8.1 на мой собственный код.

За что мы любим обучение в онлайне? За удобство и свободу учиться где угодно и когда угодно. За воплощение концепции life-long learning. А еще за технологичность. Сегодня мой рассказ о том, как используются технологии ИИ в работе крупнейшей в Европе онлайн-платформы обучения детей английскому языку Novakid.

Оцениваем

Начав изучать что-то новое, рано или поздно человек спрашивает себя: «Какого прогресса я добился?». В нашем случае этим вопросом задаются родители учеников: в Novakid учатся дети и подростки. Их интерес закономерен вдвойне. Для родителей результаты ребенка – главная метрика оправданности инвестиций в обучение. 

На платформе Novakid прогресс каждого ученика измеряет ML-система и оценка строится на основе 1 500 микронавыков. Параметрический анализ учитывает даже мельчайшие детали. Например, насколько свободно ребенок овладел той или иной грамматической конструкцией.  

Здесь может возникнуть вопрос о роли преподавателей. Они, конечно ставят оценки - после прохождения блока занятий или курса. В зависимости от того, как педагог оценил ту или иную компетенцию (Speaking, Reading, Grammar и тд.) ребенку назначают дополнительные упражнения и занятия. То есть вместо школьной 5-балльной шкалы оценка, наоборот, происходит незаметно для ученика (stress free) и показывает, "освоил" он материал, или "нужно еще поработать".   

Почему это важно? Во-первых, учитель – тоже человек и может ошибиться. Во-вторых, на объективность оценки может повлиять плохое настроение ребенка. Наконец, на уроках иногда меняются учителя. Кто-то из детей моментально адаптируется к новому преподавателю, а кому-то нужно больше времени для налаживания доверительного контакта. 

Наверно все работали с формами и понимают как это сложно. В свое время я смотрел разные решения и одним из лучших был Vuetify. Сейчас решений стало больше, но все они однотипны (я не буду брать во внимание форм генераторы). В чем то это связано с ограничением самого Vue и его философией. Но для меня все таки странно, что время идет, а прогресса нет. Странно что люди вокруг пытаются меня убедить что это нормально.

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

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

В этой статье я перескажу истории с некоторыми техническими деталями и порассуждаю, что делать дальше.

Время идет, технологии растут, а разработка тяжела на перемены. Все больше и больше ресурсов зависят от API (но нет единых стандартов и решений). До сих пор популярен REST... Что бы сделать запрос на такой сервер, необходимо задать header (auth token), указать тип запроса, адрес, задать get параметры, указать параметры в теле и тип этого тела (json/multipart). Благо есть axios и fetch и они от части решают проблему с отправкой запросов. Время идет дальше и количество запросов - которые нужно отправлять растет, а код начинает превращаться в свалку копипасты. Иногда делают мини конструкторы или обертки. Большая же часть живет по старинке.

Эта часть кода начинает жить в хранилищах (Store). В дальнейшем я буду приводить примеры на основе Vuex (Vue Store), но в целом думаю это актуально и для React и Angular. Мы разгрузим Store и перенесем все запросы в Request Manager.