#статья дня

Пожалуйста, прекратите писать shell-скрипты.

Это не моя просьба, а автора статьи: https://pythonspeed.com/articles/shell-scripts/

1. Они по-умолчанию не останавливаются в случае ошибок
2. Использование необъявленных переменных не приводит к ошибкам
3. Пайпы не ловят, опять же, ошибки
4. Вы можете запустить встроенный шелл внутри скрипта, но работать это будет странно

Также автор указывает на те ложные причины, которые «заставляют» нас писать шелл-скрипты.

Есть перевод на русский язык: https://habr.com/ru/company/otus/blog/657841/

Всем bash!

#shell #bash #nix

#такое дня

Вы же в курсе, что почти во всех современных телефонах есть гироскоп?

Но зачем?

Ну... можно зайти на https://gyroco.de/ и понять

...или не понять

#gyroscope #api #js

#библиотека дня

Скучаете ли вы по тому времени, когда новые JS UI- и не очень фреймворки появлялись каждый день?

Тогда я вам принёс!

https://corset.dev/

Вы ведь так хотели объявлять UI-взаимодействия в CSS-стиле, правда?

Куда уж декларативней…

Но на самом деле, это весьма интересный концепт связывания (биндинга) DOM и действий.

#css #js #ui #framework

#инструмент дня

Знаете же о существовании утилиты less в Linux? Быстрый просмотр файлов.

Но текстовых файлов может быть недостаточно. С JSON тоже хочется работать удобно, находясь в терминале.

И тут на помощь придёт jless!

🌍 https://jless.io/
🐙 https://github.com/PaulJuliusMartinez/jless

Написан на Rust, имеется во многих пакетных менеджерах и в Homebrew.

Очень удобно 👍

#rust #cli #json

#ссылка дня

Тимлид я ещё довольно молодой, приходится учиться всему на лету и черпать знания отовсюду.

Поэтому, было весьма интересно найти роадмап (карту знаний и умений) по этой теме: https://tlroadmap.io/

Работать с ним можно буквально как с картой, выбирая нужные ветки, или же как с документом: https://tlroadmap.io/guide.html#%D0%B8%D0%BD%D1%81%D1%82%D1%80%D1%83%D0%BA%D1%86%D0%B8%D0%B8-%D0%BF%D0%BE-%D0%B8%D1%81%D0%BF%D0%BE%D0%BB%D1%8C%D0%B7%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D1%8E

Всё написано понятным языком и вообще весьма интересно. И не только тимлидам, конечно же.

#teamlead #learning #roadmap

Я уже писал этот список в другом месте, выложу и здесь.
Тут подборочка, что коснулось именно меня.

1) Google Pay. Приходится теперь брать карточки с собой и вспоминать пинкоды. Оплата, одна большая проблема.
2) Spotify не продлить подписку
3) Strava - не работает
4) Занимался на Cambly - не оплатить. + Подорожало ~ в 3 раза .
5) JetBrains - остановил продажи и теперь не понятно как продлить лицензию
6) Netflix - не продлить подписку.
7) GoDaddy - прекращает обслуживание доменов.
8) Paypal - не работает
9) Upwork - приостанавливает работу, хотят как выводить деньги уже не понятно.
10) Hetzner - проблемы с оплатой.

Самые неприятные, это последние 3 пункта. Не прининять валюту, не расплатиться.
Т.е поделать, что-то за доллары на стороне уже не получится, а с таким курсом было бы кстати.
И за кластер не могу заплатить. Дима выше писал, что возможны swift-переводы, но я пока только переписываюсь с тех поддержкой.
Хорошо, что теперь IaC + сегодня сниму бэкапы 📦

Жду отключение хрома и пикселя 🥸

#codepen дня

Огромных летающих 3D-заголовков заказывали?

А я всё равно принёс!

Игры с перспективой и 3d-преобразования творят чудеса, конечно.

https://codepen.io/amit_sheen/pen/BaJmWWj

#css #3d #parallax

#фишка дня

Некоторые люди до сих пор отлаживают фронтенд через console.log(). Ещё более упоротые — через alert().

А чем верстальщики хуже? Давайте отлаживать через аутлайны!!

Не, ну правда: https://dev.to/gajus/my-favorite-css-hack-32g3

Иногда даже полезно. А главное, сниппет выглядит шикарно.

P. S. не отлаживать, а откладывать.

#css #debug

#инструмент дня

Снова фигнюшечки для SVG подъехали: https://svgdoodles.com/

Конкретно это — коллекция “вручную” нарисованных линий, кругов и стрелок, чёрточек…

Но на ресурсе есть ещё ссылки на генератор SVG-градиентов и весьма забавных фонов в виде волны.

#svg #generator #gradient

Блокировали, блокировали, да невыблокировали­

В Шри-Ланке правительство ввело запрет на использование соцсетей из-за массовых протестов граждан.

Дошло в результате до того, что племянник президента запустил VPN и написал в Твиттере, что блокировки «совершенно бесполезны».

Спустя менее 16 часов запрет сняли.

Глава интернет-регулятора Шри-Ланки подал в отставку сразу после вступления в силу приказа о запрете.

Такие дела.

@applespbevent #в_мире #vpn

#codepen дня

Давайте немного развлечёмся. Кто-то не так давно в чате канала выкатил большой SCSS-цикл для анимации, но саму анимацию зажал (ай-яй-яй).

Давайте исправим положение и сделаем что-то насущное.

Например, сымитируем табло в аэропорту… С его задержками смены линий при смене языка.

Поехали: https://codepen.io/alinaki/pen/ZEaOdKq

Заодно использована интересная фишка CSS Grid: наложить две ячейки друг на друга без абсолюта.

#css #grid #animation #scss

#ссылка дня

О проекте Веб-стандарты вы все наверняка знаете. И о сайте, и о статьях, и о подкасте. Ну и фигура Вадима Макеева в Рунете не последняя.

Так вот, у них во всех статьях и обучающих материалах используется один словарь: https://github.com/web-standards-ru/dictionary

Без единообразия в терминах разработка была бы весьма сложной, согласитесь.

Естественно, это не единственный подобный словарь. Есть ещё как минимум у каждого курса ну или вот например ребята из доков реакта постоянно работают над своим: https://github.com/reactjs/ru.reactjs.org/issues/4

#web #dictionary

#фишка дня

Родительский селектор aka :has уже так близко к нам подобрался, что пора выкатывать новые подходы к стилизации всего и вся.

Пока только Safari 15.4 поддерживает полностью, но Chrome/Blink давно уже давали эту возможность “за флагом“.

Думаю, будет целая серия таких постов с приятными и удобными фишками нового селектора. Почему бы и нет.

#css #future #has

#статья и #codepen дня

Мне кажется, мы стали забывать, на что способны списки и чекбоксы в CSS.

И нет, я не про стилизацию сейчас. Например, охота вам сделать… калькулятор. Можно ли?

Можно: https://codepen.io/serg-by/pen/KKZBxpR?editors=0100

Так что counter-increment + :checked — лютая мощная дичь. Не то чтоб я рекомендовал сходу переписывать ваши калькуляторы пластиковых окон и автомоек на это, но иметь в виду очень даже стоит.

Найду примеры с пользовательскими свойствами — тоже скину.

А пока, собственно, вот: https://codersblock.com/blog/checkbox-trickery-with-css/

#css #checkbox #counter

#видео дня

Когда я стал работать в нормальной компании, а не в веб-студии, я внезапно узнал, что оценка задачи происходит в баллах. «Стори поинтах», story points.

И стори поинты это не часы. Это некая условная оценка сложности. И выражается, как правило, в числах Фибоначчи: 1, 2, 3, 5, 8… Близко к экспоненциальной зависимости.

Если кому интересно, статей на эту тему много. Но дальше происходит самое интересное.

Оценка сложности не нужна :) Не в том смысле, что все задачи одинаковы, нет. А в том смысле, что не имеет особого смысла их делить.

Очень часто возникает ситуация, в которой все задачи на спринт оцениваются в 3. Или даже, что чаще, в 5. Ну просто потому что. Потому что так команде удобнее.

И вот, например, доклад именно на тему оценки сложности: https://m.youtube.com/watch?v=QVBlnCTu9Ms

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

Не болейте.

#agile #teamlead #scrum

#codepen дня

Я же обещал продолжение заглядывания в будущее с псевдоселектором :has, помните?

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

Для самых умных: да, через + тоже конкретно этот эффект прекрасно достигается :) Но полифилл на контейнерные запросы всё равно будет нужен.

https://codepen.io/una/pen/oNpoqGp

#css #future #has

#фишка дня

Есть псевдокласс :disabled, который выберет отключенные поля. Есть псевдокласс :read-only, который выберет недоступные для ввода поля (только для чтения).

Вот только есть нюанс.

Отключенные поля они так-то тоже для ввода недоступны. Как же тогда быть?

Использовать селектор атрибута: [readonly].

Пример: https://codepen.io/elad2412/pen/wvpmjGR

Отличие disabled-полей от readonly: первые не отправятся с формой вообще, а значение вторых просто нельзя изменить.

Скелетон вернётся с новыми подробностями о фронтенде завтра.

#css #html #input

#видео дня

Давно стоило и пересмотреть это видео, и выкатить в канал.

Многим из вас знакома концепция DRY: Don't Repeat Yourself. Вот только многие доводят её до абсурда, плодя абстракцию за абстракцией и пытаясь объять необъятное (сам таким был).

Но есть и другой подход, буквально — WET.

Write Everything Twice.

Да-да, пиши-повторяй. Стоит ли тратить время на объединение разных сущностей до того, как это вообще понадобится, или лучше потратить его на закрытие бизнес-потребности?

И вот об этом доклад Дэна наше всё Абрамова на конференции Deconstruct'2019.

Есть транскрипт, кстати: https://www.deconstructconf.com/2019/dan-abramov-the-wet-codebase

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

#video #conference #dry #wet

#статья дня

Немного восьмибитности не желаете?

Я не так давно выкладывал целый сайт в стиле NES, а тут на глаза попалась статья о том, как сделать скруглённые уголки на блоках немного менее… кхрм, скруглёнными.

В стиле восьмибитных приставок: https://lukeb.co.uk/blog/2022/01/17/pixelated-rounded-corners-with-css-clip-path/

На самом деле в статье очень много информации о том, как использовать clip-path, рекомендую.

Ну и чтобы совсем куце не было, давайте ещё восьмибитных прелоадеров на чистом CSS: https://codepen.io/t_afif/full/PopjYgx

#css #clippath #8bit #preloader

#инструмент дня

Предположим, тебе заказали разработку Flutter или React Native приложения. Да даже Cordova или Ionic. Предположим, ты даже справился. Настало время собирать под iOS. И тут облом. Нужна macOS.

Можно купить старый мак, можно завести виртуальную машину, обмазавшись ютубом и tonymacx86.

А можно воспользоваться Docker и вот этим прекрасным репозиторием: https://github.com/sickcodes/Docker-OSX

Куча рецептов прямо в Read.me, куча полезных скриптов. В общем, надо брать и пробовать.

Отпишитесь потом о результатах, ок?) Тоже при случае попробую. Прост мак-то есть)

#docker #macos