Shardanov
139 subscribers
105 photos
11 videos
1 file
595 links
Life is just a couple moments in our memory.
#developer

shardanov.com
Download Telegram
🦥 Как избавиться от прокрастинации до того, как она разрушит вашу карьеру

Прокрастинацию принято считать разновидностью лени и ерундой, а эффективным лекарством от нее грозный окрик: «Соберись, тряпка!» На деле прокрастинация — опасная проблема, сродни зависимости, которая вызывает много вины и стыда, и способна со временем разрушить личность. Почему она так опасна, редко лечится попыткой «взять себя в руки» и как ее одолеть?

Читать статью
🎧 Новый год — новые скиллы. 7 лучших подкастов для прокачки навыков в 2023 году

Следуя популярному лозунгу «Новый год — новый я», мы собрали подкасты, которые помогут обрести полезные навыки и прокачаться в разных сферах: от софт скиллс и руководства коллективом до английского и поиска работы за границей.

Читать статью
#инструмент дня

Устал вручную типизировать ответы от API для TypeScript или любого другого типизированного языка?

Есть решение!

https://app.quicktype.io/

Фиганул туда JSON — получил нужную структуру или описание типа, даже с тайпгардами. Уютненько!

Есть расширение для VS Code: https://marketplace.visualstudio.com/items?itemName=quicktype.quicktype

Ещё один мощный инструмент в тему дня: https://transform.tools. Одним типизированием JSON не ограничивается: можно CSS в Tailwind, а можно Flow в TypeScript.

Вот, например, если кто использует Zod — конвертор типов в схему Zod: https://transform.tools/typescript-to-zod

#json #typescript #type
#заметка дня

Четыре способа убрать слушатель события с кнопки!

1. removeEventListener. Сработает, естественно, только с именованной функцией. Неважно, объявили внутри addEventListener, или снаружи. Обсуждали вот тут: https://t.me/htmlshit/1555

2. Свойство once в настройках addEventListener:

document.querySelector('#btn').addEventListener('click', () => {
console.log('clicked');
}, {once: true});


3. AbortController. Отличная концепция, который подходит для многого, не только для слушателей событий (промисы, например).

Сигнал для него тоже настраивается через свойства addEventListener:

const controller = new AbortController();

document.querySelector('#btn').addEventListener('click', () => {
console.log('clicked');
}, { signal: controller.signal });

// аборт корабля!
controller.abort();


4. Ну или просто склонируйте кнопку саму на себя, так тоже можно 🤡

#js #events
Forwarded from Тостер
Что нового в Chrome 111?

- CSS теперь поддерживает дисплеи c высокой чёткостью, определяя цвета из гаммы HD, а также предлагая цветовые пространства со специализациями.

- View Transitions API призван упростить создание плавных переходов, позволяя DOM изменяться без дублирования состояний.

- В devtools появились новые возможности для поддержки спецификации CSS color level 4.
​​Файл package-lock.json: полное руководство

Файл package.json - ключевой элемент баз кода для многих приложений, основанных на экосистеме Node.js. Это своего рода манифест проекта. Предлагаем подробный гайд по использованию этого файла и решению связанных с ним проблем.

Подробнее: 👉 тут

#изучаем
Forwarded from Open Source AI
​​memos

Самостоятельный сервер заметок с открытым исходным кодом

▫️Поддержка самостоятельного хостинга за Docker считанные секунды
▫️Поддержка некоторого полезного синтаксиса Markdown
▫️Сделать заметку частной или общедоступной для других
▫️RESTful API
▫️Встраивайте заметки на другие сайты с помощью iframe
▫️Хэштеги для организации заметок
▫️Интерактивный календарь
▫️Простая миграция данных и резервное копирование

https://github.com/usememos/memos
#фишка дня

Чтобы задать анимацию появления какого-либо элемента на экране при загрузке страницы, добавлении элемента или обновлении DOM совсем не нужно городить сложных конструкций.

Достаточно проделать следующий трюк:

@keyframes appear {
from {
…whatever
}
}

Это анимирует объект в момент его появления из положения, заданного в анимации, в то, что указано в стилях.

Пример на CodePen: https://codepen.io/alinaki/pen/XWXORzM

Попробуйте обновить страницу и поиграться со значениями.

Спасибо Twitter-банде https://twitter.com/keyframers за эту находку.

#css #keyframes #animation #бородач
This media is not supported in your browser
VIEW IN TELEGRAM
#фишка дня

Я писал как-то о том, что одной из одновременно полезных и раздражающих вещей в CSS-препроцессорах является возможность создавать вложенность, nesting.

Склеивать селекторы, классы в БЭМ и не только, вкладывать теги... Удобно? Писать — да, поддерживать — не очень. Вот тут: https://t.me/htmlshit/1643

К чему это я?

К тому, что Chrome 112 начал поддерживать CSS Nesting! Официальный! Который теперь часть спецификации: https://www.w3.org/TR/css-nesting-1/

.nesting {
color: hotpink;

> .is {
color: rebeccapurple;

> .awesome {
color: deeppink;
}
}
}


Ну и на видео показан процесс отладки этого дела в DevTools.

Статья в блоге разработчиков Chrome: https://developer.chrome.com/articles/css-nesting/, хороший способ вспомнить, что к чему.

Моё мнение остаётся прежним: для псевдоклассов, псевдоэлементов или влияния на соседей (+, ~) — очень хорошо. Для формирования БЭМ (склеивания классов) — нет.

Всем nesting, котаны!

#css #nesting
Вопрос всем живым на канале.
Подрубать ли стримы по возможности и закидывать сюда ссылку?
Anonymous Poll
65%
Да 🤝
5%
Нет 🌚
30%
Дай денег 👨‍💻
Привет всем живым снова! 🌚
Когда есть время - пытаюсь создавать прототип ММО: Unreal С++ и 90% помощью chat gpt, copilot. Цель - саморазвитие, возможная смена вектора основной деятельности в будущем.
Основная тема стримов по возможности, интересно?
Anonymous Poll
89%
Да, было бы интересно посмотреть/поучаствовать.
0%
Нет.
11%
Давай лучше делать говнософт и говносайты!
Forwarded from ГАВЕР
Всем снова дарова!🫵🫵🏻🫵🏼🫵🏽🫵🏾🫵🏿
Был на днях стримчанский где мы рассказывали о наших потугах в гейм дев, разбирали говнокод и немножко обсуждали планы в целом.

В общем кому интересно и хочет поучаствовать в этой теме или чем-то помочь, даже если просто последить за процессом создания прототипа - добро пожаловать в клуб buddy. Любой вклад будет полезен и принесет опыт и знания не только нам, а возможно и вам.

Ссылка на Дискорд где будет происходить весь движ:
https://discord.gg/KTb4E6N6Xu
Кто еще не часть нас и заинтересован - welcome.

Если предыдущая ссылка не работает:
https://discord.gg/vBdBHqunHM