14544
Блог Lead JS-разработчика из Хельсинки Автор: @bekharsky По рекламе: https://telega.in/channels/htmlshit/card?r=GLOiHluU или https://t.me/it_adv Чат: https://t.me/htmlshitchat
#шок дня
Думал ли я, что буду скидывать сюда статьи и видео из 2015 года, а тем более — статьи по производительности из 2015 года, а тем более — статьи по производительности анимаций из 2015 года?
Нет, не думал. Есть разница между вечнозелёным и сиюминутным контентом. Статьи про золотую сетку и правила потока это одно, статьи про анимации — совсем другое. И тем не менее, мы здесь.
Итак, вам, пожалуй, все уши прожужжали о том, что нужно пытаться избегать JS-анимаций, если вам не нужен полный контроль над анимацией. Что все CSS-анимации давно выполняются на GPU с шикарной производительностью. Что браузеры становятся лучше и лучше... А не совсем.
Итак, всем известна библиотека анимаций от GreenSock — GSAP. Её авторы очень постарались, чтобы собрать в ней буквально всё, что нужно. Подражателей и альтернатив море, включая Animate API, но с трона пока не скинули.
И вот в 2015 году они записали интересный вебинар: "CSS animations performance: the untold story", вот и ссылка: https://greensock.com/css-performance/
Ну и сразу на видео: https://youtu.be/1ZWugkJV5Ks
TL;DR: если вы совмещаете transform-анимации с анимированием позиции, вас ждёт неприятный сюрприз.
Погоди, скажете вы, всем известно, что анимировать left-top это мерзко и вообще, ведь богоподобные трансформы исполняются на GPU.
И так-то да, но мы живём в 2023 году, нашими компьютерами можно ядерные взрывы считать десятками за раз, уже нельзя элемент подвинуть? Так что же не так?
А не так, господа, синхронизация потоков выполнения GPU и CPU-анимаций и перерисовок. Даже сейчас, запуская их демо на моём M2, я вижу подёргивания на CSS-версии: http://codepen.io/GreenSock/full/2a53bbbcd47df627f25ed1b74beb407d/
Да, авторы оставили дисклеймер, что многое зависит от вашей раскладки в принципе (стоит избегать вложенности, например), но... кто вообще последний раз об этом задумывался?
В общем, рекомендую и видео к просмотру, и CodePen с демо к протыку и приложенные к статье ссылки прочесть.
А почему я вообще начал с упоминания 2015 года? Ну, я думал, за столько лет стало получше. Оказалось, чуть хуже, чем ожидалось.
#css #js #gsap #animation #transform
#шпаргалка дня
Уникальное предложение!
Берёте короче эту пирамиду код-ревью и ваши пулл-реквесты станут не только вкусными, но и полезными: https://www.morling.dev/images/code_review_pyramid.svg
Такая себе пирамида Маслоу, но для обсуждения качества кода. От базовых вещей (но не опускаясь до того, что можно сделать автоматически) до того, что сделает ваш код действительно красивым.
#pr #process #work #бородач
Управляйте проектами команд разработки
Yandex Tracker — сервис для совместной работы. Он поможет легко управлять процессами команды разработки: тимлид сможет планировать проекты и анализировать работу, а команда — общаться с коллегами и следить за приоритетами по задачам.
Tracker поможет эффективно выстроить процессы:
— управляйте задачами: настраивайте типы, статусы, параметры, используйте шаблоны, декомпозируйте;
— работайте по гибким методологиям (Agile) с помощью досок задач;
— контролируйте сроки и формируйте календарный план с помощью Проектов и диаграммы Ганта;
— приоритезируйте задачи в бэклоге и планируйте их выполнение с помощью спринтов;
— автоматизируйте рутинные действия с помощью триггеров, автодействий, макросов;
— подключайте репозитории исходного кода и привязывайте коммиты к задачам;
— интегрируйте системы для сборки, тестирования, развёртывания приложений.
Вы можете легко перенести процессы в Tracker с помощью API или инструмента миграции.
Попробуйте Yandex Tracker прямо сейчас➡️
#заметка дня
Для меня было небольшой загадкой, почему Vim, а по большей части, Neovim, так завирусился в последнее время.
Я использовал Vim активно лет 12 назад, имел огромный конфиг, но в итоге сполз с него на Sublime, Atom, а потом и VS Code. Причиной стала лучшая поддержка нужных мне инструментов. Vim остался горячо любимым редактором на удалённых серверах. И от конфига я отказался в пользу сырых режимов, это положительно сказалось на работе в разных средах.
К слову, Vim может искать по многогигабайтным логам легко и просто, а эти ваши VS Code и даже Sublime — нет.
Но суть не в этом. Суть в том, что Vim и другие независимые редакторы спасла… Microsoft. Как?
Раньше каждая IDE реализовывала свой механизм работы с конкретным языком. И как правило, это было некое проприетарное (в смысле непереносимое) решение. Но всё изменил приход LSP: Language Server Protocol.
Такого раньше не было: открытый стандарт взаимодействия редактора и языка. Автодополнение, ссылки, определения, документация… А главное, протокол-то открытый.
Поддерживается уже огромное количество языков и редакторов. И тут мы подходим к главному.
О преимуществах Vim есть огромный свежий тред Кирилла Мокевнина, CEO Hexlet: https://twitter.com/mokevnin/status/1567594899859546115
Оригинальный Vim не поддерживает LSP, зато его поддерживает Neovim. И тут все любители модальных редакторов получили второе дыхание.
Но вот я правда был очень удивлён, как Microsoft снова перевернула мир свободного ПО. Это, конечно, поразительно.
#бородач
#фишка дня
Как предотвратить взаимодействие пользователя с элементом?pointer-events: none — скажете вы.
Да. Но нет. А что насчёт клавиатурного фокуса? А скринридеры? Так не пойдёт.
Благо, есть решение!
Начиная с Firefox 112 и Safari 15.5 у нас наконец-то есть поддержка атрибута inert. Что это такое?
Ну, исходя из названия inert (инертный) он ни с чем не должен взаимодействовать. Как инертные газы (как вам отсылочка, пахнуло школьной химией, да?).
То есть, если вы зададите элементу атрибут inert, то:
1. Будет предотвращена обработка события click.
2. Элемент перестанет получать фокус и...
3. ...станет недоступен для скринридеров (исключён из a11y tree).
Поддержка уже давно есть в Chrome, начиная со 102 версии, и теперь, с вводом в строй Firefox 112 — есть во всех современных движках.
Ну и, естественно, присущие атрибуту свойства можно повторить ручками, вот пример: https://codepen.io/alinaki/pen/ZEqJepB
#inert #attribute #html #a11y
Самый недооценённый канал для фронтендеров
Контент создаётся вместе с тимлидами с опытом работы в Вконтакте, Яндексе, Telegram Open Network и Frogly! Собрали подборку полезных статей и видео оттуда, читайте и подписывайтесь:
▫️ChatGPT во фронтенде — для всех, кто хочет понять, как применять нейросети в веб-разработке
▫️Как повысить качество кода — и облегчить работу для всех, кто работает над проектом
▫️Как прокачаться от джуна до миддла — секреты быстрого роста от middle frontend-разработчика из VK
▫️Как писать чистый код — о том, как делать код понятным и читаемым
▫️Что случилось с CSS в 2022 — об основных изменениях за последний год
Ещё у сообщества есть чат, в котором можно задать любой вопрос по фронтенд-разработке. А помимо полезного контента там и мемы про разработку бывают:)
Канал: @karpovdev
#видео дня
Что приходит в голову при упоминании сложных анимаций?
Ну, Lottie, очевидно. Кто-то что-то нарисовал в After Effects Bodymovin, потом это экспортировали в специально сформированный JSON и, собственно, плеером-плагином запустили в огромном количестве сред, от веба до мобил и десктопов. Да, ваши любимые стикеры и реакции в Telegram тоже Lottie.
Есть ли альтернативы? Конечно! Например, активно набирает обороты Rive. Это векторный редактор, заточенный специально под анимации.
Формат гораздо легче, чем у Lottie, а список поддерживаемых платформ (рантаймов) даже больше. Да, на стороне Lottie сообщество After Effects, но и это решаемо экспортом. Имеется и сайт сообщества со свободно скачиваемыми анимациями.
Ладно, к чему это я. Вот видеоурок по интеграции Rive-анимации в React-приложение: https://youtu.be/5hvhOb9zLeg
Анимация простая, но попробуйте скачать что-нибудь с сайта сообщества и попробовать сами :)
Удачи в анимировании, котаны!
#rive #инструмент #tool #lottie #animation
#статья дня
Точнее, целый лонгрид дня. А точнее, целых три. Ну, так получилось.
Итак, задумывались ли вы когда-нибудь о том, как происходит процесс создания дизайна интерфейсов или даже целой дизайн-системы? Что за этим стоит?
Я наткнулся на kovchiy/%D0%BE%D0%B1%D1%80%D0%B0%D0%B7%D1%8B-%D0%B8-%D0%BC%D0%BE%D0%B4%D0%B5%D0%BB%D0%B8-9e42977b3c62">этот лонгрид Данилы Ковчия несколько лет назад, но периодически перечитываю. kovchiy/%D0%BE%D0%B1%D1%80%D0%B0%D0%B7%D1%8B-%D0%B8-%D0%BC%D0%BE%D0%B4%D0%B5%D0%BB%D0%B8-9e42977b3c62">Материал просто огромный и, честно говоря, пытается покрыть всё разом. Этого бы хватило на несколько статей, уже не говоря о том, что его можно разобрать на посты и цитаты.
Очень грубо говоря — описан весь цикл создания дизайна продукта.
На vc.ru выходил переработанный материал в двух главах, возможно, так будет удобнее: раз и два.
Вторая часть, кстати, вполне себе независима и говорит о том, как создавать словарь своего набора компонентов или, бери выше, дизайн системы. Всё есть список, дамы, господа и им сочувствующие.
В общем, рекомендую заварить чаю и погрузиться в чтение. Затягивает.
#design #ui #widgets
#статья дня
Начиная с iOS и iPadOS 16.4, ваши PWA-приложения могут не только принимать пуши, но и отображать число уведомлений на своей иконке.
Это про Progressive Web App, почему-то в русском языке всё время хочется прибавить слово "приложения", как в CD-диск — "диск".
API максимально простой, всё, что требуется — одобрение от пользователя, а дальше можно установить Service Worker для проверки push-уведомлений и поехали.
PWA становятся реальной альтернетивой растространению приложений через сторы, даже на iOS. Это очень хорошо. Я помню, как мы адски пропихивали промо-приложение в аппстор, и это при том, что жить ему надо было недели три и толку от него потом ноль.
Ну и, собственно, статья от разработчиков WebKit обо всём об этом: https://webkit.org/blog/14112/badging-for-home-screen-web-apps/
#ios #push
Познакомьтесь с востребованным направлением программирования — Java-разработкой. Освойте базовые инструменты на практике и выйдите на рынок IT. Сделайте первый шаг — участвуйте в онлайн-интенсиве Skillbox с 27 по 29 апреля в 15:00 по московскому времени: 👉 https://epic.st/nDnFV
После регистрации сразу отправим вам на почту гайд по профессии Java-разработчика: из него вы узнаете, сложно ли изучить Java, сколько зарабатывают специалисты и как начать карьеру в этой сфере.
Интенсив ведёт Даниил Пилипенко — основатель и директор центра подбора IT-специалистов SymbioWay.
С 2004 года разрабатывает и руководит разработкой на Java, PHP и во фронтенде.
Он расскажет, как устроен язык Java, и научит писать простейший код, даже если вы никогда не программировали. Объяснит, как работать с файлами и переменными, а также где найти первых клиентов.
🎁 Всем, кто дойдёт до конца интенсива, подарим электронную книгу издательства МИФ и сертификат на скидку 10 000 рублей на любой курс Skillbox.
#реклама
#фишка дня
Я очень люблю, когда люди открывают для себя геометрию пятого класса. Особенно дизайнеры.
Посмотрите на картинку: наружный радиус двух вложенных блоков это радиус скругления внутреннего блока плюс поля.
Казалось бы, всё так очевидно. Но, похоже, не всем…
#design #border #бородач
#расширение дня
Как тестировать свои (и чужие, ну мало ли какие у вас увлечения) проекты на валидацию всякой дряни?
Очевидный ответ — вводить в поля всякую дрянь.
А где её брать? Не в каждой голове столько всего удержится...
Есть решение: расширения для Chrome под названием Bug Magnet.
Удобный доступ к куче известных эксплоитов и просто значений, способных вызвать неопределенное поведение системы. Есть возможность задать свои собственные конфигурации.
Тестируйте проекты тщательно, котаны.
#test #extension #chrome
#баг дня
input size=“1” в Firefox слишком широкий. Логика подсказывает нам, что он должен так-то быть в один символ шириной.
Песочница: https://jsbin.com/zavefac/edit?output
Багтрекер: https://bugzilla.mozilla.org/show_bug.cgi?id=1782385
С комментария в приложенном куске кода я в целом в голос прорал: «To better match IE»…
Вот и он, кстати: https://searchfox.org/mozilla-central/rev/92e8568bbe7c8bf64f7a8ee958291877d960d7d8/layout/forms/nsTextControlFrame.cpp#209-232
Вроде как для моноширинных шрифтов все отрабатывает как надо. Но что-то пошло не так.
#firefox #bug #бородач
#расширение дня
Ну что, пришло время поговорить о серьезных вещах!
А что может быть серьезнее ошибок TypeScript? Правильно, ничего. Уж слишком они формальные. И мы на самом деле уже с вами обсуждали расширение, переводящее их в человеческий вид: /channel/htmlshit/1601
И вот есть ещё одно, стремительно набирающее популярность: https://github.com/yoavbls/pretty-ts-errors
Ссылка на VS Code store: https://marketplace.visualstudio.com/items?itemName=yoavbls.pretty-ts-errors
Работает с Node и Deno, React и Vue, Solid и Qwik. Далее везде, в общем.
Пробуем, рассказываем о результатах.
Прокачивайте скиллы, котаны.
#typescript #ts #vscode
#нытьё дня
Итак, тема нытья сегодня: "Почему разработчики ОС с таким упорством вставляют палки в колёса переключателям языков ввода?".
Поясню, что я имею в виду. Начнём с Windows 11.
Мой личный ноутбук — ThinkPad с финской клавиатурой. При установке Windows я указал Eng (US) и Ru (Ru) раскладки клавиатуры, а ОС...
...подсунула мне финскую раскладку для британского английского! Неудаляемую!
Почему неудаляемую? Потому что британский английский языковой я не устанавливал вообще. Чтобы удалить, пришлось поставить языковой пакет, добавить в него финскую раскладку, тут же её удалить и удалить языковой пакет.
Кто просил это делать изначально? Вопрос риторический.
Теперь Linux. Конкретно — версии с GNOME.
Баг, повествующий о потере фокуса с поля ввода при переключении языка висит в трекере уже много лет. А точнее — 10. Да, он помечен как просроченный, но проблема-то никуда не делась. И важность "Low" или "Medium". Ну то есть разработчикам похер. А ты, тем временем, чтобы переименовать папку или ввести поле тянулся каждый раз не только переключить язык, но и поставить фокус на место.
Плюс, если у тебя Alt-Shift, во многих приложениях начинали срабатывать индикаторы горячих клавиш (VS Code, например), что тоже сбивало фокус если ты использовал для переключения раскладки не штатную шину GNOME, а что-то стороннее или просто настроил в Tweak Tools.
Теперь перейдём к macOS, которая тоже умудрилась насолить.
На ноутбуках и клавиатурах года так с 2021 есть клавиша с символом глобуса. Как нетрудно догадаться, она переключает раскладку. Но:
1. Кнопка на внешней клавиатуре раньше не работала с ноутбуками, у которых такой кнопки нет (2019 год, например).
2. ОС показывает всплывающее окно, что вызывает задержку переключения до двух секунд
3. Но этого окошку было мало и пару версий macOS назад если курсор мыши находился в месте, где появляется окошко — автоматически выбиралась раскладка, попадающая под курсор. Гениально.
Ну с этим бороться было просто, хоть и смешно:
1. Включаем переключение языка через CapsLock
2. Переназначаем Fn-клавишу на CapsLock
3. CapsLock лично я переназначаю на всех своих машинах на Cmd (mac) или Ctrl (Win, Lin). Потому что я не пианист.
В общем, казалось бы — идее переключения раскладки уже лет пятьдесят. Но находятся индивидуумы, которые хотя всё придумать заново.
P. S. многие проблемы решает однозначное переключение языка кастомным хоткеем сразу на нужный.
#macos #windows #linux
Фронтендеры, ловите лайфхак:
Все макеты для верстки уже нашли и бесплатно выкладывают на канале Макеты Figma.
Макеты для верстки: @figma_templates
#статья дня
Я, честно говоря, плохо понимаю, как я пропустил появление тригонометрических и математических функций в CSS.
Добро пожаловать в ад девятиклассников.
Итак, хотите вы того или нет, но sin(), cos(), tan(), asin(), acos(), atan(), atan2(), pow(), exp() и так далее уже с нами.
Для начала можно попробовать въехать в abs, round, mod вместе со статьёй легендарной Аны Тюдор: https://css-tricks.com/using-absolute-value-sign-rounding-and-modulo-in-css-today/
А потом изучить обзорную статью о, собственно, тригонометрических функциях: https://web.dev/css-trig-functions/
А я, тем временем, буду пробовать перевести свою прыгающую коробочку на них...
Посмотрим, что из этого выйдет.
#css #sin #cos #math
#ссылка дня
Чем отличается alt от title? А border от outline? А *.d.ts от *.ts? А for..in от for..of? А display: none от visibility: hidden? А slice от spice?
Как же я задолбался форматирование применять.
Да весь фронтенд это нагромождение похожих по написанию или даже по сути вещей. Как разобраться?
И тут нам поможет проект https://thisthat.dev/. Он буквально проходится по таким скользким определениям или сущностям и разбирает каждый из них.
Проект открытый, предлагайте ваши == и ===.
#javascript #html #css #this
Подборка новых статей из Журнала Код. Канал про программирование. Понятно для новичка, интересно для эксперта. Без снобизма и душности объясняем сложные программистские штуки — подписывайтесь 🔥
1. Как пользоваться ChatGPT в России /channel/thecodemedia/6886
2. ООП для новичков: классы и объекты /channel/thecodemedia/6782
3. Запускаем Python-скрипт на сервере, чтобы он работал всё время /channel/thecodemedia/6766
4. Метод Монте-Карло — один из самых полезных алгоритмов в ИТ /channel/thecodemedia/6999
5. Делаем парсер, чтобы массово тянуть с сайтов что угодно /channel/thecodemedia/6971
Вступайте в канал начинающих айтишников: @thecodemedia
#codepen дня
Меня этим видео достали. Мне прислали его все: жена, несколько друзей, мемовник, оно попало в два рабочих чата и личку, в чат канала (раза три), оно лезло из всех твиттер-лент.
В какой-то момент я устал быть душнилой и отвечать всем: "Но... ведь... SVG..."
Не будь я таким ленивым, я бы попробовал найти исходник и что-то наваять, но душнить гораздо проще, чем что-то делать, не правда ли?
А вот уже достаточно хорошо известный вам бывший деврел Google Джей не поленился и таки сделал этот чёртов переключатель!
Смотрите: https://codepen.io/jh3y/pen/LYgjpYZ
Явно покруче чем наш с Киренковым трёхпозиционный... пора поднимать ставки, котаны :)
Кто пасхалку найдёт?
В общем, меня забавляют эти дуэли. Надо бы поучаствовать в какой-нибудь :)
#tiktok #switch #design #challenge
#ссылка дня
Олды тут?
Когда я начал официальную рабочую карьеру как верстальщик, в 2006 году, не было в интернете ресурса круче по CSS чем http://cssplay.co.uk/
И что-то мне подсказывает, что и нет.
Автору уже тогда было под 60, сейчас 74, но он фигачил и фигачит потрясающе сложные и при этом простые для понимания примеры вёрстки.
В 2009 году, например, в моде были выпадающие мега-меню, у него десятки их примеров. Естественно, без хаков для IE6 тогда не обходилось вообще ничего. Before, after? Забудьте. Flex? Забудьте. Float во все поля.
Коллекция меню поражает воображение. И до сих пор обновляется!
Раскладки на любой вкус и браузер. Всё категоризировано. Тоже обновляется!
Ну и он один из первопроходцев игр на CSS: http://www.cssplay.co.uk/menu/cssplay-whack-a-rat.html
В общем, без тени сомнения, Стюарт когда-то буквально стартанул мою карьеру и поддерживает веру в выбранное направление.
Не старейте, котаны.
#бородач
Проведи майские с пользой! Участвуй в марафоне по фронтенд-разработке с наставничеством куратора и добавь в свое портфолио "Сайт зоосада PRETTY PAW".
Марафон пройдет с 1 по 14 мая. За 14 дней ты освоишь:
▪️ Верстку сайта по макету Figma
▪️ Работу с Webpack
▪️ Напишешь стили для проекта, используя SCSS
▪️ Адаптив под все устройства
▪️ Весь интерактив будем писать, использую JavaScript - ES6 и выше (современный стандарт)
▪️ И многое другое
Стоимость марафона всего 1490 рублей (вместо 2990 рублей)
Регистрируйся по ссылке: https://in.methed.ru/md/044324281eed7cc1e9410f74aab90e13?utm_source=telegram&utm_medium=cpc&utm_campaign=zoo&utm_content=htmlshit
#реклама
🔥Ежемесячный платеж по ипотеке равен 4413₽ Кажется, на продукты в месяц больше сумма уходит 😱
Такие возможности открывает траншевая ипотека
Новая программа взамен ушедшим низким % ставкам разрывает рынок недвижимости:
✔️ выгодно, когда необходимо взять ипотеку и одновременно жить в съемной квартире
✔️ можно купить квартиру для ребенка-студента
✔️ можно купить квартиру копилку на будущее детям
✔️ можно купить квартиру в качестве инвестиций
Вариантов много, а программа одна, читайте подробности в канале Арины Николаевой, профессионального риелтора, основателя и руководителя собственного Агентства по недвижимости.
Арина и ее команда работают с регионами в том числе.
Если ищите или только задумываетесь об ипотеке, обращайтесь к Арине на бесплатную консультацию, в том числе и о возможностях траншевой ипотеки для себя👌🏻
#реклама
#статья дня
До сих пор не умеешь пользоваться терминалом? Или не знаешь, зачем это вообще фронтендеру?
Джош Камю с большой статьей о том, зачем фронтенд-разработчику уметь пользоваться консолью: https://www.joshwcomeau.com/javascript/terminal-for-js-devs/
Отличное руководство для начинающего, надо сказать. Даже . и .. объяснены :)
#cmd #terminal #бородач
#codepen дня
Давайте немного развлечёмся. Кто-то не так давно в чате канала выкатил большой SCSS-цикл для анимации, но саму анимацию зажал (ай-яй-яй).
Давайте исправим положение и сделаем что-то насущное.
Например, сымитируем табло в аэропорту… С его задержками смены линий при смене языка.
Поехали: https://codepen.io/alinaki/pen/ZEaOdKq
Заодно использована интересная фишка CSS Grid: наложить две ячейки друг на друга без абсолюта.
#css #grid #animation #scss #бородач
До сих пор нет продающего портфолио? Заверстай его вместе с нами👆🏻
Недавно ребята из Pixel Perfect сделали 2 сайта за 3 дня для Edutoria x Сбер, и все это благодаря Webflow. В своем канале они показывают как это было, а еще подсвечивают студийные процессы, поэтому
Если ты фрилансер и сидишь без заказов, то Webflow станет для тебя находкой. Ребята дают пошаговый план выхода на международный рынок с помощью Webflow и Upwork, о котором в России пока мало, кто знает🙊
Ну а если ты засиделся в студии, Webflow поможет тебе повысить свою ценность в команде и вырасти в зп. На верстку только на Webflow перешли уже такие крупные студии как: Redis, Луч, Embacy. Замечаешь тренд?
Регистрируйся на воршкопы, которые пройдут с 25 по 27 апреля в 20:00 мск
🧷 /channel/pixeleperfect
На них ты:
• научишься основам Webflow и сверстаешь свой первый сайт-портфолио
• поймешь, как сделать первые касания с клиентом
• узнаешь, как в 2023 продавать свои услуги на зарубежном рынке
Вся инфа будет в боте и не забывай подписаться на канал
Кухня IT
Завариваем супчик из айтишных новостей, полезных материальчиков и просто легкого общения.
Ждем только тебя: @it_kitchen
Программист, мы пишем для тебя!
Планируешь кодить всю жизнь и зарабатывать геморрой сидя у монитора 24/7?
В блоге про инвестиции ты поймешь как выйти на пассивный доход за 10-15 лет и сможешь забыть свою работу, как страшный сон 😂
Все советы в блоге подкрепляются кейсами и личным опытом автора, который, к слову, тоже в прошлом айтишник, но как-то умудрился выйти на дивидендную пенсию в 37 лет.
Переходи в канал и начни менять реальность, в которой ты будешь жить через 10-15 лет.
Перейти в канал
#фишка дня
Я надеюсь, вас не смутит, что я сюда теперь буду иногда скидывать заметки для Windows PowerShell. Просто у меня очередной приступ усталости от Linux на десктопе, так что на личный ноутбук вернул Windows 11. Не знаю, надолго ли.
Вернул — потому что OEM. Не суть.
Так вот. Если вы ставите различные утилиты для разработки, от Git, Node.js через Volta до Android и Flutter SDK, вам нужно постоянно обновлять пути в переменной среды — Env — и перезаходить в консоль, чтобы утилиты стали доступны к исполнению.
Ну если вы не лох какой и пользуетесь консолью, конечно.
Так вот, первое, что меня убило — недостаточно просто запустить новую вкладку в Windows Terminal, как я бы сделал в любом эмуляторе терминала в macOS и Linux. Надо перезапускать всё приложение. Мерзость.
Чтобы этого избежать, нужно выполнить следующую команду: $Env:Path = [System.Environment]::GetEnvironmentVariable("Path","Machine") .
И всё встаёт на свои места.
#windows #powershell
#инструмент дня
Нужна карусель изображений на сайт? jQuery-плагины не катят? Swiper.js чёртов огромный монстр и уже набил оскомину? Slick.js глючный? Owl не поддерживается? Нужна интеграция с React, Vue, Svelte?
Встречайте: https://splidejs.com/
Splide написан на TypeScript. Лёгкий, быстрый, куча интеграций. Десятки примеров использования сразу на главной странице. Не портит SEO страниц. Lighthouse тоже очень даже зелёный.
Нет зависимостей и поддержка от IE10.
Просто праздник какой-то.
#slider #carousel #gallery #swiper #бородач
