Secret Code
577 subscribers
135 photos
23 videos
103 links
Новости из мира веб-дева и мысли админа
Download Telegram
Secret Code
💻 Обновление Telegram 10.15 только что вышло Внутри in-app браузер, мини-апп стор, виджет погоды для сторис. Буду тестить магазин приложений
This media is not supported in your browser
VIEW IN TELEGRAM
Считаю, что это киллер-фича обновления: кнопка вспышки в кружочках. Очень полезно для съёмки видео в условиях слабого освещения
62
💻 #TypeScript 5.6 Beta теперь подскажет вам, что вы написали оператор стрелочной функции вместо сравнения в условии if

Такого ОЧЕНЬ не хватает на уровне #JavaScript, который сначала начинают изучать джуны. Ко мне много раз обращались с просьбой помочь и там была именно эта проблема — знаки перепутаны местами.

Да я и сам как-то не обращал внимание на старте изучения и объявлял стрелочную функцию с помощью оператора сравнения🐱

Такое в TS мы одобряем? Хотели бы видеть такое в JavaScript?
Please open Telegram to view this post
VIEW IN TELEGRAM
61
Secret Code
Считаю, что это киллер-фича обновления: кнопка вспышки в кружочках. Очень полезно для съёмки видео в условиях слабого освещения
В Телеге дизайнер ушёл на выходные, а разработчик клиента на макоси сделал свой шедевроинтерфейс, который попал в продакшен

Честно, ожидал список мини-приложений в поиске клиента, но там только чаты, как это и было ранее. Список мини-аппов находится в трех точках в окне уже открытого мини-аппа. И без поиска
4
Secret Code
💻 Тут у Фигмы очень масштабная обнова выходит. На Config 2024 показали: — Обновлённый UI. Наконец появится полная поддержка светлой темы — Figma Slides — новый режим для создания презентаций — Поиск похожего в файле компонента/экрана по картинке — Создание…
Самое нелогичное, что изменили в Figma UI3 — это переключатель отображения контента, заходящий за границы фрейма. Они сделали селектор из двух элементов вместо переключателя

Надеюсь, что они это ещё поправят
822
💻 Стали доступны результаты опроса React-разработчиков за 2023 год

Советую изучить результаты категорий фичи, другие инструменты и ресурсы

2023.stateofreact.com
Please open Telegram to view this post
VIEW IN TELEGRAM
72
This media is not supported in your browser
VIEW IN TELEGRAM
Часто ли вы забираете логотипы через просмотр кода элемента? 💬

Я — да, ведь это быстро и удобно. Но разработчики Astro и Prisma пошли дальше. Теперь при клике правой кнопкой на их логотипе вы не увидите стандартное контекстное меню браузера. Вместо этого появится специальное меню с возможностью сразу получить логотип в формате SVG или в виде кода, готового для работы в 💻 Figma. Удобно, правда?
Please open Telegram to view this post
VIEW IN TELEGRAM
822
📣 Публикация сообщений в канал от имени другого канала

В бета-версии 💻 Telegram появилась возможность публиковать посты от имени другого канала.

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

Как раз таки из-за данного функционала, как я предполагаю, вчера не работал постинг публикаций в каналы на iOS и macOS. Потому что на Android во время этого сбоя частично отображался данный функционал.

Видимо кто-то залил в прод то, что не следовало…
Please open Telegram to view this post
VIEW IN TELEGRAM
71
💻 Сегодня Telegram отмечает свой 11-й день рождения!

14 августа 2013 года мир увидел новое приложение, которое изменило наше общение в интернете. С тех пор Telegram становился неотъемлемой частью нашей жизни, объединяя людей со всего мира, предоставляя им возможность общаться, обмениваться идеями, учиться и работать в одном удобном и безопасном пространстве.

Поздравляю Telegram с этой значимой датой 🚀
Please open Telegram to view this post
VIEW IN TELEGRAM
433
This media is not supported in your browser
VIEW IN TELEGRAM
📊✍️ В Notion появились чарты

Диаграммы помогут вам и вашей команде отслеживать проекты, цели, продажи или любую другую информацию, которую вы храните в Notion.

Доступно на всех тарифах.
Please open Telegram to view this post
VIEW IN TELEGRAM
62
Secret Code
📊✍️ В Notion появились чарты Диаграммы помогут вам и вашей команде отслеживать проекты, цели, продажи или любую другую информацию, которую вы храните в Notion. Доступно на всех тарифах.
Также в ✍️ Notion появится возможность создавать формы

Всё, что заполнят пользователи, будет автоматически попадать в базу данных.
Please open Telegram to view this post
VIEW IN TELEGRAM
91
Сегодня планирую пройти опрос State of CSS 2024, и вам советую

Если вы еще не принимали участие в State of CSS, это исследование представляет собой анкету с вопросами о вашем знакомстве с различными возможностями CSS, ваших предпочтениях, а также о том, какие функции, по вашему мнению, следовало бы добавить. Кроме того, оно включает вопросы о фреймворках, которые вам помогают или не помогают в работе.

⚡️ Интересный факт: результаты этих опросов активно используются разработчиками браузеров. Создатели спецификаций CSS также учитывают эти данные. Поэтому ваше участие действительно имеет значение.

survey.devographics.com/survey/state-of-css/2024

Также советую прочитать о том, как интернет становится лучше благодаря Interop: t.me/secretscode/9
Please open Telegram to view this post
VIEW IN TELEGRAM
642
Сейчас активно обсуждают, что ✍️ Notion прекращает работу в России: необходимо искать аналоги, сохранять данные и так далее. Однако, я бы не стал так сильно паниковать — думаю, доступ к Notion будет сохраняться через VPN, так как ограничивать доступ не по айпи они вряд ли собираются.

Точное будущее #Notion для пользователей из российского региона мы узнаем девятого сентября. Но, на всякий случай, рекомендую сделать резервную копию данных: перейдите в Settings & members → Settings → Export all workspace content. В появившемся окне можно оставить все настройки по умолчанию. Просто нажмите на Export и дождитесь завершения экспорта. Когда процесс завершится, уведомление о возможности скачивания данных появится в Notion.

🏃‍♂️ Лично я уже давно перешёл на ✍️ AnyType для ведения заметок. Это отличная и удобная альтернатива, тем более что это опен-сорсный проект без прайсинга для личного использования. До этого я пробовал Obsidian, но там интерфейс немного перегружен и сложен в использовании. Если вам нравится разбираться в таких вещах, то Obsidian тоже может подойти.

Также #AnyType имеет возможность импортировать данные из Notion 👍
Please open Telegram to view this post
VIEW IN TELEGRAM
8
This media is not supported in your browser
VIEW IN TELEGRAM
💻 Apple Event пройдёт 9 сентября в 20:00 по МСК

Ожидаем релиз новых операционных систем, новый iPhone и другое.

👀 Смотреть тут: youtu.be/uarNiSl_uh4
Please open Telegram to view this post
VIEW IN TELEGRAM
642
👩‍💻 Недавно вспомнил о Fleet — редакторе кода от JetBrains, созданном в качестве конкурента для VS Code, так как IDE от JetBrains решают несколько другие задачи по сравнению с VS Code.

Первые новости о Fleet появились около трёх лет назад. За это время редактор вышел в публичный бета-тест, добавил поддержку C#, Svelte и Tailwind, а также обзавёлся встроенным ассистентом на базе искусственного интеллекта.

Однако, за три года Fleet так и не приблизился по функционалу к VS Code или другим IDE от JetBrains. До сих пор отсутствует поддержка плагинов (хотя её обещают уже на протяжении трёх лет), что отпугивает многих пользователей.

Кроме того, на сайте редактора есть информация о стоимости. На сайте написано о бесплатной и платной версии. В бесплатной версии отсутствуют Smart Mode и некоторые "продвинутые" функции, но конкретный список ограничений пока не раскрыт.

Слышали ли вы о таком редакторе кода? Интересовались ли его развитием?
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
5
При изучении новых технологий фронтенда часто возникают ситуации, когда нужны тестовые данные. Например, чтобы на сайте вместо абстрактных пользователей вроде «Example User» появлялись условно реальные персонажи.

🩰 В этом случае вам поможет курируемый список бесплатных и общедоступных API: freepublicapis.com. Здесь вы найдете более двухсот API на любой вкус и цвет.
Please open Telegram to view this post
VIEW IN TELEGRAM
532
🙂 Что такое Biome и как его использовать?

Biome — это набирающий популярность инструмент в экосистеме JavaScript и TypeScript. Если вы хотите ускорить процесс форматирования и линтинга кода, стоит обратить внимание на Biome. Этот инструмент, написанный на языке Rust, объединяет в себе возможности Prettier и ESLint.

Biome — это линтер для JavaScript, TypeScript и JSX, содержащий 268 правил из ESLint и не только.


Сегодня решил попробовать поработать с этим инструментом, заранее установив плагин в VS Code. Он сразу подсветил, что в одном из файлов есть useEffect, который не вызывается при обновлении замемоизированной функции. Это означает, что инструмент из коробки поддерживает React, что очень удобно.

Кроме того, Biome умеет заменять .map().flat() на .flatMap(), сортировать переменные и выполнять многие другие полезные функции. Разработчики активно развивают проект, и его популярность растёт — на прошлой неделе пакет был скачан 738 тысяч раз.

Рекомендую установить этот инструмент в свой пет-проект и попробовать его в деле!
Please open Telegram to view this post
VIEW IN TELEGRAM
711
👍 Нашёл хороший интерактивный учебник по SVGfffuel.co/sssvg. SVG можно создать, условно, в Иллюстраторе, но можно ведь и своими ручками!

В моём воркфлоу изредка возникает потребность как-либо отредактировать скачанную SVG-иконку. Чаще всего я просто редактирую сразу файл в текстовом редакторе. Но для этого как раз требуются хоть какие-то знания того, как работает SVG. Страница с интерактивными референсами поможет вам лучше разобраться в работе SVG.

В самом конце страницы также собраны ссылки на полезные ресурсы про SVG и SVG-генераторы 👇

fffuel.co/sssvg
Please open Telegram to view this post
VIEW IN TELEGRAM
311
🧐 Решил в своём проекте вместо привычной JSON-локализации попробовать систему Fluent

Mozilla разработала систему Fluent, которая позволяет создавать более гибкие и естественные переводы. Один из примеров её возможностей — это динамическое согласование перевода в зависимости от числительных, рода и других факторов. Давайте рассмотрим пример:


shared-photos =
{$userName} added {$photoCount ->
[one] a new photo
*[other] {$photoCount} new photos
}.


Этот код отвечает за формирование фразы, когда пользователь добавляет фотографии. Здесь Fluent использует переменные и правила согласования:
1. {$userName} — имя пользователя.
2. {$photoCount} — количество добавленных фотографий:
- Если значение переменной равно 1: “added a new photo”.
- В остальных случаях: “added N new photos”.

Такие фразы часто встречаются в интерфейсах приложений. В других системах приходится вручную писать несколько строк для каждого варианта, что усложняло локализацию. Fluent решает эту проблему, делая процесс более эффективным.

Процесс становится ещё более эффективным, когда в одной строке сразу упоминается местоимение пользователя, количество, числительные прилагательные. Вместо создания огромного количества строк создаётся всего одна динамическая.
Please open Telegram to view this post
VIEW IN TELEGRAM
21
👍 Коллекция компонентов shadcn/ui получила крупное обновление!

shadcn/ui — это коллекция реиспользуемых компонентов, предлагающая новый взгляд на UI-киты. Вместо использования компонентов из npm-библиотек, разработчики предлагают «копировать и вставлять» код компонентов прямо в ваши проекты. Это даёт полный контроль над компонентами, позволяя изменить всё, что необходимо под конкретные требования.

Вот основные изменения:

1️⃣ Интерфейс командной строки (CLI) теперь поддерживает все популярные React-фреймворки «из коробки», включая Next.js, Remix, Vite и другие.

2️⃣ Компоненты автоматически определяют свои зависимости. Например, аккордеон теперь может сам добавлять необходимые анимации в конфигурацию Tailwind. При добавлении компонента в проект, файл tailwind.config.ts обновляется корректно, без перезаписи ваших настроек, как это было раньше.

3️⃣ Компоненты можно устанавливать по ссылке на JSON. В shadcn/ui появилась новая схема, которую разработчики могут использовать для создания собственного реестра компонентов. Пока нет подробной информации о том, как это работает, но возможность выглядит многообещающе.

4️⃣ Команда init теперь автоматически определяет фреймворк и может даже создать новое приложение на Next.js одной командой.

5️⃣ Добавлена улучшенная поддержка монорепозиториев.

На канале Theo (t3.gg) вышло видео, где он показывает, как одной командой в консоли он добавил целую страницу на сайт, сгенерированную с помощью v0.dev. Думаю, что у этого функционала есть ПоТаНцЕвАл 👍

💬 Пользовались ли вы shadcn/ui?
Please open Telegram to view this post
VIEW IN TELEGRAM
532