Идеальные подсказки с clip-path и mask-image в CSS

Современные возможности CSS позволяют создавать сегодня действительно красивые и уникальные страницы. Красивые всплывающие подсказки с текстом или даже изображением отличный тому пример.

В этой статье автор рассказал и показал, как можно сделать такие подсказки на чистом CSS и также упомянул на что стоит обратить внимание, чтобы избежать проблем с их созданием:

https://tprg.ru/ULbB

#css #фронтенд

Или взятый с CodePen

Различия между Docker, containerd, CRI-O и runc

Считается, что Docker позволяет работать с контейнерами. Это действительно так, но только отчасти. Для работы с контейнерами используется множество инструментов, взаимодействующих с Docker — Dockershim, CRI и так далее.

В этой статье попытались понятно объяснить, как всё-таки работает экосистема контейнеров и из чего она состоит:

https://tprg.ru/CKSb

#docker #kubernetes

​Понимаем каррирование в JavaScript

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

Как это работает и где можно такое встретить, вы можете узнать здесь:

https://tprg.ru/Tq75

#javascript

​5 приёмов по разделению «бандла» и «ленивой» загрузке компонентов в React

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

В этой статье вы найдёте 5 способов, как можно разделить код и использовать его с ленивой загрузкой:

https://tprg.ru/97HB

#react #javascript

​Промисы в JavaScript: then(f, f) vs. then(f).catch(f)

Промисы в JS позволяют получить значения их выполнения или отказа сразу двумя способами — указать в then сразу два аргумента для успешного выполнения и ошибки, а также с помощью последовательного вызова then и catch. В двух этих способах есть важные различия.

Подробнее о них читайте в статье:

https://tprg.ru/6HAa

#javascript

​Чат: Как будет развиваться веб-разработка?

Прогресс не стоит на месте и каждый год появляются новые технологии и решения в веб-разработке. Если раньше сайт представлял из себя статичную HTML-страницу даже без CSS, то сегодня это сложные приложения, которые могут успешно заменять десктопные программы.

Поэтому мы предлагаем сегодня обсудить с вами, как будет развиваться веб в ближайшие несколько лет — появится что-то лучше JavaScript для фронтенд-разработки, каждый сайт превратится в PWA-приложение, CSS превратится в полноценный язык программирования или что-то ещё интереснее? Пишите своё мнение в комментарии.

#чат

​Как перейти с WordPress на headless CMS

Headless CMS это следующее поколение CMS, таких как WordPress. Сегодня нас окружает множество устройств повсюду и эти устройства дают нам множество способов взаимодействия с контентом на разных ОС, платформах и так далее. Headless CMS позволяют универсализировать содержимое, которое может в последствии использоваться где угодно.

Если у вас уже назрела необходимость модернизировать текущий WordPress проект под использование на различных платформах, то эта статья поможет вам перенести его на Headless CMS:

https://tprg.ru/m9Y6

В .gitignore добавить забыли, чтоб не улетало в репу

Использование Netlify для FullStack-приложений

Статические сайты за несколько кликов, бессерверный бэкенд, возможность бесплатного использования — вот лишь некоторые особенности сервиса Netlify.

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

https://tprg.ru/KEn1

​Easy canvas — простая JS-библиотека, которая невероятно упрощает работу с canvas html

Для успешной работы с canvas требуется достаточно много опыта и терпения. Эту проблему решает эта библиотека — она в разы упрощает рисование в canvas и не требует долгого изучения.

Подробнее:

https://tprg.ru/cveH

Распознавание символов, введённых с дисплея вашего смартфона на сайте

Ещё одна интересная библиотека для JavaScript, которая позволяет добавить вам распознавание символов, нарисованных на дисплее смартфона. Это может оказаться удобно для какой-нибудь браузерной мобильной игры или если поставить определённый символ для вызова всплывающего окна.

Подробнее:

https://tprg.ru/xB9r

​Усмиряем прожорливый виджет рисования и помогаем iPad его переварить

Автор статьи — участник команды Canvas Widgets, которая занимается разработкой виджетов на канвасе. Он рассказал, как они оптимизировали виджет для рисования, чтобы он не ел слишком много ресурсов и не сбоил из-за этого.

Подробнее здесь:

https://tprg.ru/uo7X

#canvas

Коллекция «жидких» кнопок

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

Код находится здесь:

https://tprg.ru/WgZw

#codepen

...потому что я и сам не всегда понимаю.

​Что если вёрсткой макетов и дизайном займётся один человек?

И жрец, и жнец, и на дуде игрец? Возможно мысль и неплохая, ведь с одной стороны так снижается количество этап внедрения новых элементов дизайна и разработка его в целом. Но с другой стороны, может всё-таки каждому заниматься своим делом — дизайнеру дизайном, а верстальщику вёрсткой?

В этой статье руководитель UX-направления компании Usetech поделился своим мнением на этот счёт:

https://tprg.ru/ltWG

Вы тоже не стесняйтесь высказать своё мнение по этому вопросу в комментариях к посту!

Кодирование данных для запросов POST

Понятное и наглядное объяснение почему важно правильно обращаться с POST-запросами, а именно почему необходимо кодировать данные. И, разумеется, здесь также показано, как именно это можно сделать:

https://tprg.ru/UT9N

​У нас появился канал, в котором мы прокачиваем soft skills

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

Повышайте продуктивность в Soft Skillz: @soft_skillz

​Temporal: начало работы с новым API даты и времени JavaScript

Текущий API для работы с временем и датой в JavaScript Data является не очень удобным и простым в использовании. Поэтому вскоре на его место должен придти новый API — Temporal.

В этой статье вы можете узнать подробнее о нём и подготовиться к его официальному выходу:

https://tprg.ru/FQsc

#javascript

Если бы перезагрузку страницы делал хакер из голливудского фильма