Nutlope/aicommits
A CLI that writes your git commit messages for you with AI
Language: JavaScript
Stars: 790 Issues: 20 Forks: 30
https://github.com/Nutlope/aicommits

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

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

Читать статью

🎧 Новый год — новые скиллы. 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

Что нового в Chrome 111?

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

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

- В devtools появились новые возможности для поддержки спецификации CSS color level 4.

​​Файл package-lock.json: полное руководство

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

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

#изучаем

​​memos

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

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

https://github.com/usememos/memos

iFixit: бесплатные инструкции по ремонту
https://ru.ifixit.com/

#фишка дня

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

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

@keyframes appear {
from {
…whatever
}
}

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

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

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

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

#css #keyframes #animation #бородач

#фишка дня

Я писал как-то о том, что одной из одновременно полезных и раздражающих вещей в 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

🔥JavaScript - деобфускация

Сегодня мы расскажем, о том что такое обфускация кода и его обратный процесс - деобфускация.

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

Всем снова дарова!🫵🫵🏻🫵🏼🫵🏽🫵🏾🫵🏿
Был на днях стримчанский где мы рассказывали о наших потугах в гейм дев, разбирали говнокод и немножко обсуждали планы в целом.

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

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

Кто еще не часть нас и заинтересован - welcome.

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