2022_02_28_Путеводитель_для_цифровых_кочевников_v6_1_Buzko_Krasnov.pdf
2 MB
#книга дня
Обновился “Налоговый путеводитель для цифровых кочевников” от юридической фирмы Buzko Krasnov. Возможно, многим пригодится.
Путеводитель ориентирован в основном на физических лиц, которые имеют связь с Россией. Вместе с тем базовые принципы налогового права применимы также для резидентов многих других стран.
#book
Обновился “Налоговый путеводитель для цифровых кочевников” от юридической фирмы Buzko Krasnov. Возможно, многим пригодится.
Путеводитель ориентирован в основном на физических лиц, которые имеют связь с Россией. Вместе с тем базовые принципы налогового права применимы также для резидентов многих других стран.
#book
👍5👎1
#такое дня
В рабочий чат прислали таблицу скорости брутфорса разных паролей.
Казалось бы, ничего нового, но многие сервисы до сих пор ограничивают варианты ввода. Скандалы там и тут.
Забавно, что 5 лет — это оранжевый уровень угрозы. Возможно, потому, что через год превратится в 30 минут?
И где та грань, когда пароль становится настолько сложным, что требует записи на бумажке, налепленной на монитор? :)
В рабочий чат прислали таблицу скорости брутфорса разных паролей.
Казалось бы, ничего нового, но многие сервисы до сих пор ограничивают варианты ввода. Скандалы там и тут.
Забавно, что 5 лет — это оранжевый уровень угрозы. Возможно, потому, что через год превратится в 30 минут?
И где та грань, когда пароль становится настолько сложным, что требует записи на бумажке, налепленной на монитор? :)
👍6
#статья дня
Михаил Башуров из канала Typesafe&Sound написал статью о том, как правильно составлять и исправлять резюме: https://telegra.ph/Pochemu-menya-ne-zovut-na-sobesedovaniya-03-03
Канал хороший, надеюсь, тематика Typescript на него вернётся.
Ну и там же вдогонку статья от Никиты Мостового о, в общем, том же. Актуальности не потеряла: https://habr.com/ru/company/hh/blog/510104/
Михаил Башуров из канала Typesafe&Sound написал статью о том, как правильно составлять и исправлять резюме: https://telegra.ph/Pochemu-menya-ne-zovut-na-sobesedovaniya-03-03
Канал хороший, надеюсь, тематика Typescript на него вернётся.
Ну и там же вдогонку статья от Никиты Мостового о, в общем, том же. Актуальности не потеряла: https://habr.com/ru/company/hh/blog/510104/
👍5🔥2😁1
#статья дня
Думаете, браузеры только ругаться друг с другом умеют? Нет, они ещё и взаимодействуют.
Начиная с 2019 года множество компаний-разработчиков браузеров, ведомые инициативой Mozilla и Google, стали собираться на конференцию Interprop.
Этот год не стал исключением: https://web.dev/interop-2022/
Рассматриваются 15 тем взаимодействия и стандартизации (единого понимания документов):
- Каскадные слои
- Цветовые пространства
- Новые единицы измерения для viewport
- Скролл
- Subgrid
- CSS contain
- Элемент dialog
- Типографика
- Совместимость браузеров
- Правило aspect-ratio
- Flexbox
- Grid
- position: sticky
- Трансформации
В общем, будьте как разработчики браузеров :)
#webkit #firefox #blink #chrome #safari
Думаете, браузеры только ругаться друг с другом умеют? Нет, они ещё и взаимодействуют.
Начиная с 2019 года множество компаний-разработчиков браузеров, ведомые инициативой Mozilla и Google, стали собираться на конференцию Interprop.
Этот год не стал исключением: https://web.dev/interop-2022/
Рассматриваются 15 тем взаимодействия и стандартизации (единого понимания документов):
- Каскадные слои
- Цветовые пространства
- Новые единицы измерения для viewport
- Скролл
- Subgrid
- CSS contain
- Элемент dialog
- Типографика
- Совместимость браузеров
- Правило aspect-ratio
- Flexbox
- Grid
- position: sticky
- Трансформации
В общем, будьте как разработчики браузеров :)
#webkit #firefox #blink #chrome #safari
❤19
#фишка дня
Плохо с математикой? 360 градусов вводят в ступор? 2π радиан доводят до истерики? Грады это какой-то сплошной гон?
Используй 1 поворот! Вращение элементов никогда ещё не было таким простым!
turn — и готово!
#css #transform #rotate
Плохо с математикой? 360 градусов вводят в ступор? 2π радиан доводят до истерики? Грады это какой-то сплошной гон?
Используй 1 поворот! Вращение элементов никогда ещё не было таким простым!
turn — и готово!
#css #transform #rotate
❤19
#статья дня
Думаете, SVG это только формат описания векторной графики?
Нет, всё чуть-чуть сложнее. SVG это формат, не менее интересный чем весь стек HTML, а то и более. Внутри SVG может содержаться настоящее приложение, способное включать в себя и HTML (вспоминаем мой опыт с foreignObject).
Но раз весь стек HTML, то и скрипты? И сетевые запросы? Да. К сожалению. Или к счастью.
Сначала давайте посмотрим на эту статью: https://habr.com/ru/company/pvs-studio/blog/652255/
Она для общего развития, про десктопные приложения. Но суть остаётся той же: если ваш SVG-парсер неправильно настроен, вы рискуете многим.
Ну а если занимаетесь настройкой серверов и разработкой полномасштабных проектов, то не забывайте о том, что, загрузив SVG, можно и XSS-атаку провести: https://blog.yeswehack.com/yeswerhackers/file-upload-attacks-part-2/
Вот ещё из 2011 презентация, многое неактуально из-за развития CSP в браузерах, но опять же — помните про правильную настройку: https://owasp.org/www-pdf-archive/Mario_Heiderich_OWASP_Sweden_The_image_that_called_me.pdf
Фильтруйте ваши изображения, в общем.
#svg #security #css
Думаете, SVG это только формат описания векторной графики?
Нет, всё чуть-чуть сложнее. SVG это формат, не менее интересный чем весь стек HTML, а то и более. Внутри SVG может содержаться настоящее приложение, способное включать в себя и HTML (вспоминаем мой опыт с foreignObject).
Но раз весь стек HTML, то и скрипты? И сетевые запросы? Да. К сожалению. Или к счастью.
Сначала давайте посмотрим на эту статью: https://habr.com/ru/company/pvs-studio/blog/652255/
Она для общего развития, про десктопные приложения. Но суть остаётся той же: если ваш SVG-парсер неправильно настроен, вы рискуете многим.
Ну а если занимаетесь настройкой серверов и разработкой полномасштабных проектов, то не забывайте о том, что, загрузив SVG, можно и XSS-атаку провести: https://blog.yeswehack.com/yeswerhackers/file-upload-attacks-part-2/
Вот ещё из 2011 презентация, многое неактуально из-за развития CSP в браузерах, но опять же — помните про правильную настройку: https://owasp.org/www-pdf-archive/Mario_Heiderich_OWASP_Sweden_The_image_that_called_me.pdf
Фильтруйте ваши изображения, в общем.
#svg #security #css
👍17
This media is not supported in your browser
VIEW IN TELEGRAM
#фишка дня
Если вы используете стандартные элементы вроде input type number, date, range (а их часто используют в админках, да и они потихоньку улучшаются), может возникнуть задача стилизовать значения, выходящие за рамки дозволенного.
И тут, оказывается, в CSS есть необходимые селекторы: :in-range и :out-of-range.
Ну уж input type number точно будет доволен :)
#css #range #selector #input
Если вы используете стандартные элементы вроде input type number, date, range (а их часто используют в админках, да и они потихоньку улучшаются), может возникнуть задача стилизовать значения, выходящие за рамки дозволенного.
И тут, оказывается, в CSS есть необходимые селекторы: :in-range и :out-of-range.
Ну уж input type number точно будет доволен :)
#css #range #selector #input
👍38
This media is not supported in your browser
VIEW IN TELEGRAM
#codepen дня
Как проще всего понять CSS 3D-преобразования?
Нарисовать сферу!
И добавить немного лоска 😋
https://codepen.io/Skagoo/pen/RwxpoyX
#css #3d
Как проще всего понять CSS 3D-преобразования?
Нарисовать сферу!
И добавить немного лоска 😋
https://codepen.io/Skagoo/pen/RwxpoyX
#css #3d
👍8
#фишка дня
В мире высокоскоростных сетей иногда может возникнуть ситуация, что доставить изображение до потребителя проще, чем вывести его на экран.
Как писал Джон Кармак: “I can send an IP packet to Europe faster than I can send a pixel to the screen. How f’d up is that?”.
Это я к чему.
Вот выкатили вы здоровую картинку на сайт, уж не знаю, почему. Может, удивить пользователя сверхкачеством хотели. Но её надо же не только доставить, но и декодировать. А если у тебя не последний айфон?
С доставкой нам поможет атрибут loading=“lazy”, но что насчёт декодирования?
Вуаля, такое тоже есть: decoding=“async”.
Можно использовать вместе с ленивой загрузкой, можно — раздельно. В зависимости от задач.
На сладкое держите неплохую лекцию об оптимизации изображений для SEO: https://youtu.be/F6KGcb6trXc с кучей нюансов, включая вышеописанные атрибуты.
#img #decoding #html
В мире высокоскоростных сетей иногда может возникнуть ситуация, что доставить изображение до потребителя проще, чем вывести его на экран.
Как писал Джон Кармак: “I can send an IP packet to Europe faster than I can send a pixel to the screen. How f’d up is that?”.
Это я к чему.
Вот выкатили вы здоровую картинку на сайт, уж не знаю, почему. Может, удивить пользователя сверхкачеством хотели. Но её надо же не только доставить, но и декодировать. А если у тебя не последний айфон?
С доставкой нам поможет атрибут loading=“lazy”, но что насчёт декодирования?
Вуаля, такое тоже есть: decoding=“async”.
Можно использовать вместе с ленивой загрузкой, можно — раздельно. В зависимости от задач.
На сладкое держите неплохую лекцию об оптимизации изображений для SEO: https://youtu.be/F6KGcb6trXc с кучей нюансов, включая вышеописанные атрибуты.
#img #decoding #html
👍14🔥1
#инструмент дня
HTML Academy в представлении не нуждаются. Поэтому, этот пост никак не спонсирован и тем более не является рекламой.
В общем, они сделали свои тренажёры по вёрстке бесплатными. На какое время — официально не объявлено.
Заходите, пользуйтесь. Кому-то поможет освоить что-то новое, кому-то — отвлечься.
https://htmlacademy.ru/
#css #html #school
HTML Academy в представлении не нуждаются. Поэтому, этот пост никак не спонсирован и тем более не является рекламой.
В общем, они сделали свои тренажёры по вёрстке бесплатными. На какое время — официально не объявлено.
Заходите, пользуйтесь. Кому-то поможет освоить что-то новое, кому-то — отвлечься.
https://htmlacademy.ru/
#css #html #school
HTML Academy
HTML Academy: готовим разработчиков напрямую для работодателей
Совместно с работодателями мы разрабатываем программы обучения, цель которых — найм выпускников в конкретную компанию. Минимум скучной теории и максимум практических упражнений.
👍16🔥1
#codepen дня
Придётся возрождать рубрику CodePen дня. И, пожалуй, в классическом виде.
Разве меня одного должен страшно бесить этот прелоадер?
https://codepen.io/jkantner/pen/abEoyeK
Нет, конечно. Пусть вас тоже бесит!
#css #preload #animation
Придётся возрождать рубрику CodePen дня. И, пожалуй, в классическом виде.
Разве меня одного должен страшно бесить этот прелоадер?
https://codepen.io/jkantner/pen/abEoyeK
Нет, конечно. Пусть вас тоже бесит!
#css #preload #animation
#статья дня
Вы не поверите, но, кажется, до Apple таки дошло, что Safari начинает всех бесить.
На самом деле, Safari надо любить, потому что Firefox стремительно загибается, но сложно любить то, что не очень-то и уважает потребности разработчиков.
Так вот!
Вышел Safari 15.4: https://webkit.org/blog/12445/new-webkit-features-in-safari-15-4/
В списке нововведений: lazy loading, dialog, :has(), каскадные слои, svh/lvh/dvh, focus-visible, accent-color, display: contents fix, scroll-behavior, Manifest-иконки, BroadcastChannel.
Выглядит охренительно, даже похоже на будущее.
Обновляемся, пользуемся.
Upd. держите перевод на русский https://habr.com/ru/news/t/655743/
#safari #webkit #macos
Вы не поверите, но, кажется, до Apple таки дошло, что Safari начинает всех бесить.
На самом деле, Safari надо любить, потому что Firefox стремительно загибается, но сложно любить то, что не очень-то и уважает потребности разработчиков.
Так вот!
Вышел Safari 15.4: https://webkit.org/blog/12445/new-webkit-features-in-safari-15-4/
В списке нововведений: lazy loading, dialog, :has(), каскадные слои, svh/lvh/dvh, focus-visible, accent-color, display: contents fix, scroll-behavior, Manifest-иконки, BroadcastChannel.
Выглядит охренительно, даже похоже на будущее.
Обновляемся, пользуемся.
Upd. держите перевод на русский https://habr.com/ru/news/t/655743/
#safari #webkit #macos
👍12🔥3
This media is not supported in your browser
VIEW IN TELEGRAM
#видео дня
Инструкции по Chrome DevTools никогда не перестанут быть актуальными. Вот с пылу с жару подлетело новое видео от их developer advocate — Jecelyn Yeen. (Понятия не имею, как пишутся на русском ни должность ни имя, сорян).
Про отладку CSS Grid: https://www.youtube.com/watch?v=M8SlBgul8ao
А год назад было видео про отладку флексов, тоже нелишне будет напомнить: https://www.youtube.com/watch?v=J5n2aS37rpE
Естественно, не забываем, что у Google прекрасная документация: https://developer.chrome.com/docs/devtools/css/grid/
С датами публикации, правда, что-то не то… ну да ладно.
В качестве иллюстрации к посту вынесу отображение имён grid-area. Весьма удобно!
#css #grid #devtools
Инструкции по Chrome DevTools никогда не перестанут быть актуальными. Вот с пылу с жару подлетело новое видео от их developer advocate — Jecelyn Yeen. (Понятия не имею, как пишутся на русском ни должность ни имя, сорян).
Про отладку CSS Grid: https://www.youtube.com/watch?v=M8SlBgul8ao
А год назад было видео про отладку флексов, тоже нелишне будет напомнить: https://www.youtube.com/watch?v=J5n2aS37rpE
Естественно, не забываем, что у Google прекрасная документация: https://developer.chrome.com/docs/devtools/css/grid/
С датами публикации, правда, что-то не то… ну да ладно.
В качестве иллюстрации к посту вынесу отображение имён grid-area. Весьма удобно!
#css #grid #devtools
👍12🔥3
#фишка дня
Шоковый контент!
Вам, наверное, известно, что WebView — это когда в нативном приложении рендерится веб-приложение. И что такое точно есть в Android.
Я знал, что в Windows тоже применяется, знал, что в iOS вполне. Но не представлял, что даже официальные приложения Apple в macOS этим промышляют.
Если есть WebView-виджет, значит, есть и возможность его отладки?
Таки да! Следите за руками. Идём в терминал:
И вуаля — смотрим исходники того, что вам поставляет Apple и наслаждаемся.
Как по мне, весьма неожиданно. Поражает, насколько Apple поменяла свои правила интерфейсов, что даже встроенные web-части смотрятся настолько хорошо и нативно в контексте десктоп-приложения.
#macos #apple #webkit
Шоковый контент!
Вам, наверное, известно, что WebView — это когда в нативном приложении рендерится веб-приложение. И что такое точно есть в Android.
Я знал, что в Windows тоже применяется, знал, что в iOS вполне. Но не представлял, что даже официальные приложения Apple в macOS этим промышляют.
Если есть WebView-виджет, значит, есть и возможность его отладки?
Таки да! Следите за руками. Идём в терминал:
defaults write NSGlobalDomain WebKitDeveloperExtras -bool true
defaults write -g WebKitDeveloperExtras -bool YES
И вуаля — смотрим исходники того, что вам поставляет Apple и наслаждаемся.
Как по мне, весьма неожиданно. Поражает, насколько Apple поменяла свои правила интерфейсов, что даже встроенные web-части смотрятся настолько хорошо и нативно в контексте десктоп-приложения.
#macos #apple #webkit
🔥4👍3😁1
This media is not supported in your browser
VIEW IN TELEGRAM
#инструмент дня
Наверное, вы и так уже в курсе, но я решил написать.
Всем (хочется верить) известная песочница CodeSandbox расширила свои возможности от простой песочницы чуть сложнее CodePen до полноценного средства разработки и управления проектами от начала и до конца: https://codesandbox.io/post/announcing-codesandbox-projects
Теперь это не просто прототипирование!
Разрабатывайте где угодно, как угодно и на любом устройстве. Для iOS-устройств есть нативное приложение.
Ну и на видео для привлечения внимания показан процесс интеграции с VSCode. И думаю, больше интеграций последует.
Ну и на закуску напоминаю, что это те ребята, кто сделал адресные шорткаты вроде https://react.new/
#sandbox #project #tool #deploy
Наверное, вы и так уже в курсе, но я решил написать.
Всем (хочется верить) известная песочница CodeSandbox расширила свои возможности от простой песочницы чуть сложнее CodePen до полноценного средства разработки и управления проектами от начала и до конца: https://codesandbox.io/post/announcing-codesandbox-projects
Теперь это не просто прототипирование!
Разрабатывайте где угодно, как угодно и на любом устройстве. Для iOS-устройств есть нативное приложение.
Ну и на видео для привлечения внимания показан процесс интеграции с VSCode. И думаю, больше интеграций последует.
Ну и на закуску напоминаю, что это те ребята, кто сделал адресные шорткаты вроде https://react.new/
#sandbox #project #tool #deploy
👍8
This media is not supported in your browser
VIEW IN TELEGRAM
#codepen дня
Что-то захотелось мне вам на ночь глядя дать нашпигованной няшноты.
Итак, собственно, милая (это определение автора, не надо на меня так смотреть!) солнечная система:
Demo: https://codepen.io/manz/pen/rNpeEoz
Repo: https://github.com/ManzDev/twitch-solar-system/
Demo GitHub: https://manzdev.github.io/twitch-solar-system/
Twitch Making-of: https://www.twitch.tv/videos/1430488082
Twitter: https://twitter.com/Manz
Что же в ней крутого?
Ну, это демо — на веб-компонентах. Их там семь штук плюс одно изображение (звёздное небо).
Для обучения и понимания, как работают веб-компоненты — залетает сходу.
#css #webcomponents #js
Что-то захотелось мне вам на ночь глядя дать нашпигованной няшноты.
Итак, собственно, милая (это определение автора, не надо на меня так смотреть!) солнечная система:
Demo: https://codepen.io/manz/pen/rNpeEoz
Repo: https://github.com/ManzDev/twitch-solar-system/
Demo GitHub: https://manzdev.github.io/twitch-solar-system/
Twitch Making-of: https://www.twitch.tv/videos/1430488082
Twitter: https://twitter.com/Manz
Что же в ней крутого?
Ну, это демо — на веб-компонентах. Их там семь штук плюс одно изображение (звёздное небо).
Для обучения и понимания, как работают веб-компоненты — залетает сходу.
#css #webcomponents #js
❤14👍1
This media is not supported in your browser
VIEW IN TELEGRAM
#инструмент дня
Очень жаль, что у меня не было под рукой этого сайта в бытность студентом.
Итак, встречайте: https://algorithm-visualizer.org/
У ребят что-то с сертификатом, но сути дела не меняет: прекрасный проект по визуализации алгоритмов. От брутфорса и сортировки до динамического, будь оно неладно, программирования.
Приглашаю накидать в комментариях подобных проектов.
#algorithms #cs #visualizations
Очень жаль, что у меня не было под рукой этого сайта в бытность студентом.
Итак, встречайте: https://algorithm-visualizer.org/
У ребят что-то с сертификатом, но сути дела не меняет: прекрасный проект по визуализации алгоритмов. От брутфорса и сортировки до динамического, будь оно неладно, программирования.
Приглашаю накидать в комментариях подобных проектов.
#algorithms #cs #visualizations
👍12
#инструмент дня
Что-то пробило меня не тему визуализации всяческих полезностей. Алгоритмы уже можем, давайте что-нибудь ещё.
Как насчёт регулярных выражений? Там тоже есть что показать. Да и многие (я в том числе) гораздо проще воспринимают графическое решение задачи, нежели аналитическое.
Смотрим: https://regex-vis.com/
Ну согласитесь, не правда ли (?<first>^1$)|(?<second>^YES$)|(\s{2}) на КДПВ выглядит гораздо понятнее?
#regex #js #visualization
Что-то пробило меня не тему визуализации всяческих полезностей. Алгоритмы уже можем, давайте что-нибудь ещё.
Как насчёт регулярных выражений? Там тоже есть что показать. Да и многие (я в том числе) гораздо проще воспринимают графическое решение задачи, нежели аналитическое.
Смотрим: https://regex-vis.com/
Ну согласитесь, не правда ли (?<first>^1$)|(?<second>^YES$)|(\s{2}) на КДПВ выглядит гораздо понятнее?
#regex #js #visualization
🔥10👍3
#статья дня
Чтобы разбавить инструменты, коих сотни, давайте возьмём статью. Впрочем, она тоже о визуализации.
А конкретно, о визуализации вашей JavaScript-сборки (бандла), что поставляется в браузер: Lighthouse Treemap.
Знакомое название? Lighthouse — стандарт де-факто для измерения производительности сайтов и веб-приложений и анализа способов её улучшения.
А Treemap, собственно, это его часть. Показывает из чего ваша сборка состоит, что позволит проанализировать наиболее тяжёлые её части и сделать выводы о том, как поступить: разбить на части (чанки) или заменить.
Итак, статья: https://sia.codes/posts/lighthouse-treemap/
TL;DR
Открыли DevTools, запустили анализ проекта. После прохождения анализа появится кнопка View Treemap. Жамкаем и анализируем.
Заодно нелишним будет вспомнить Statoscope и Webpack Bundle Analyzer.
Пользуемся, наслаждаемся. Неделя визуализации продолжается!
#devtools #chrome
Чтобы разбавить инструменты, коих сотни, давайте возьмём статью. Впрочем, она тоже о визуализации.
А конкретно, о визуализации вашей JavaScript-сборки (бандла), что поставляется в браузер: Lighthouse Treemap.
Знакомое название? Lighthouse — стандарт де-факто для измерения производительности сайтов и веб-приложений и анализа способов её улучшения.
А Treemap, собственно, это его часть. Показывает из чего ваша сборка состоит, что позволит проанализировать наиболее тяжёлые её части и сделать выводы о том, как поступить: разбить на части (чанки) или заменить.
Итак, статья: https://sia.codes/posts/lighthouse-treemap/
TL;DR
Открыли DevTools, запустили анализ проекта. После прохождения анализа появится кнопка View Treemap. Жамкаем и анализируем.
Заодно нелишним будет вспомнить Statoscope и Webpack Bundle Analyzer.
Пользуемся, наслаждаемся. Неделя визуализации продолжается!
#devtools #chrome
🔥7👍1