This media is not supported in your browser
VIEW IN TELEGRAM
Это MicroCAD. Язык программирования для твоих 3D-проектов.
Ты можешь создать собственный LEGO-блок в нескольких строках кода и экспортировать его в STL для 3D-печати.
@WebDev_Plus
Ты можешь создать собственный LEGO-блок в нескольких строках кода и экспортировать его в STL для 3D-печати.
@WebDev_Plus
👍5
This media is not supported in your browser
VIEW IN TELEGRAM
Это одно из лучших расширений VS Code.
Копируйте все, что находится в скобках, с помощью горячей клавиши (Alt + a).
Не знаю, как разработчики могут работать без него.
@WebDev_Plus
Копируйте все, что находится в скобках, с помощью горячей клавиши (Alt + a).
Не знаю, как разработчики могут работать без него.
@WebDev_Plus
👍7❤1
JavaScript: когда использовать геттеры, а когда методы
@WebDev_Plus
class UserProfile {
constructor(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
this.loginCount = 0;
}
// GETTER: используй для простых вычисляемых свойств без аргументов.
// Читается как существительное: "Какое полное имя?"
get fullName() {
return ${this.firstName} ${this.lastName};
}
// METHOD: используй для тяжелых вычислений, действий
// или когда нужны аргументы.
// Читается как глагол: "Дай форматированное имя."
getFormattedName(includeTitle = false) {
const name = ${this.firstName} ${this.lastName};
return includeTitle ? Mx. ${name} : name;
}
}
// Пример использования
const user = new UserProfile("Alex", "Rivera");
// Getter: лаконичный синтаксис (без скобок) — удобно для доступа к данным
// Не принимает аргументы
console.log(user.fullName); // "Alex Rivera"
// Метод: синтаксис явный (со скобками) — позволяет передавать аргументы
console.log(user.getFormattedName(true)); // "Mx. Alex Rivera"@WebDev_Plus
❤6
Простой тип/модуль Redacted для предотвращения логирования/вывода чувствительных значений в логах и телеметрии в TypeScript.
Вдохновлен Effect.
@WebDev_Plus
Вдохновлен Effect.
@WebDev_Plus
❤4
"Ад из React Context" на самом деле не такой уж страшный, и в нём нет ничего плохого.
Если глубокая вложенность раздражает, просто поставь размер табуляции в 0, если можешь.
@WebDev_Plus
Если глубокая вложенность раздражает, просто поставь размер табуляции в 0, если можешь.
@WebDev_Plus
❤3👍2
This media is not supported in your browser
VIEW IN TELEGRAM
Новая версия Ant Design! Один из самых крутых UI-компонентных наборов:
✓ Архитектура на CSS Variables
✓ Минус поддержка Internet Explorer
✓ Оптимизация под React Compiler
✓ Новый компонент Masonry
→ github.com/ant-design/ant-design
@WebDev_Plus
✓ Архитектура на CSS Variables
✓ Минус поддержка Internet Explorer
✓ Оптимизация под React Compiler
✓ Новый компонент Masonry
→ github.com/ant-design/ant-design
@WebDev_Plus
👍4👏2
This media is not supported in your browser
VIEW IN TELEGRAM
Это вообще спокойно делается на CSS
- используй маску по бордеру, слои + overflow: hidden или другие трюки.
- градиент анимировать не надо, просто крути слой с градиентом 1:1🤙
@WebDev_Plus
- используй маску по бордеру, слои + overflow: hidden или другие трюки.
- градиент анимировать не надо, просто крути слой с градиентом 1:1
@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥8
This media is not supported in your browser
VIEW IN TELEGRAM
Css трюк для «блестящей» рамки
- берем псевдоэлемент
- позиционируем его и задаем inset box-shadow
- маскируем под углом через linear-gradient
бонус: используем corner-shape: squircle и крутим рамку при движении курсора
https://codepen.io/jh3y/pen/WbwyGBb
@WebDev_Plus
- берем псевдоэлемент
- позиционируем его и задаем inset box-shadow
- маскируем под углом через linear-gradient
бонус: используем corner-shape: squircle и крутим рамку при движении курсора
https://codepen.io/jh3y/pen/WbwyGBb
@WebDev_Plus
❤6
Intl.ListFormat это удобный способ собрать список в строку с учетом локали, без самописных костылей.
По сути, он сам правильно ставит запятые, союзы и форматирует список в зависимости от языка. Удобнее, чем писать if users.length === 2 ... else ... и поддерживать всё вручную.
@WebDev_Plus
onst getMessage = (users) => {
const formatter = new Intl.ListFormat("en-US", {
style: "long",
// long (по умолчанию), short, narrow
type: "conjunction"
// conjunction (and), disjunction (or), unit
});
return `Hello ${formatter.format(users)}!`;
};
// Автоматически подстраивает грамматику
console.log(getMessage(["Alice"]));
// → "Hello Alice!"
console.log(getMessage(["Alice", "Bob"]));
// → "Hello Alice and Bob!"
console.log(getMessage(["Alice", "Bob", "Charlie"]));
// → "Hello Alice, Bob, and Charlie!"По сути, он сам правильно ставит запятые, союзы и форматирует список в зависимости от языка. Удобнее, чем писать if users.length === 2 ... else ... и поддерживать всё вручную.
@WebDev_Plus
👍6
This media is not supported in your browser
VIEW IN TELEGRAM
Мигель сделал расширение для Visual Studio Code
Оно называется Better SVG и делает работу с SVG удобнее.
Постоянный предпросмотр и оптимизация кода в один клик, не выходя из редактора.
@WebDev_Plus
Оно называется Better SVG и делает работу с SVG удобнее.
Постоянный предпросмотр и оптимизация кода в один клик, не выходя из редактора.
@WebDev_Plus
🔥1
В следующей версии ArkType любой Standard Schema будет валидным определением.
Миграция с Zod станет куда проще
@WebDev_Plus
Миграция с Zod станет куда проще
@WebDev_Plus
🔥3
Свежая партия апдейтов по TypeScript 7. Новый нативный порт уже подъехал, и выглядит очень бодро.
Что умеет:
• проверяет типы в любом проекте
• поддерживает флаги --build и --incremental
• уже завезли полноценные фичи для редакторов
• и при этом работает примерно в 10 раз быстрее
Короче, можно пробовать прямо сейчас — версия уже в состоянии «юзабельно и приятно».
@WebDev_Plus
Что умеет:
• проверяет типы в любом проекте
• поддерживает флаги --build и --incremental
• уже завезли полноценные фичи для редакторов
• и при этом работает примерно в 10 раз быстрее
Короче, можно пробовать прямо сейчас — версия уже в состоянии «юзабельно и приятно».
@WebDev_Plus
Microsoft News
Progress on TypeScript 7 – December 2025
Earlier this year, the TypeScript team announced that we’ve been porting the compiler and language service to native code to take advantage of better raw performance, memory usage, and parallelism. This effort (codenamed “Project Corsa”, and soon “TypeScript…
👍4❤1
This media is not supported in your browser
VIEW IN TELEGRAM
Нравится этот шрифт?
Это Glass TTY VT220. Ссылка на шрифт - https://github.com/svofski/glasstty
А финальный ретро-вайб дает Cool Retro Term с эффектом послесвечения.
@WebDev_Plus
Это Glass TTY VT220. Ссылка на шрифт - https://github.com/svofski/glasstty
А финальный ретро-вайб дает Cool Retro Term с эффектом послесвечения.
@WebDev_Plus
❤11
This media is not supported in your browser
VIEW IN TELEGRAM
Эксперимент на WebGL, который показывает, как VAT может масштабироваться прямо в браузере.
Сотни цветов, у каждого тысячи анимированных вершин, и все это рендерится на GPU в реальном времени. Когда прокручиваешь сцену, срабатывает их цикл жизни: они распускаются, растут, задерживаются и постепенно увядают у тебя на пути.
Интересно наблюдать, как такой подход можно будет использовать в будущих WebGL-проектах.
@WebDev_Plus
Сотни цветов, у каждого тысячи анимированных вершин, и все это рендерится на GPU в реальном времени. Когда прокручиваешь сцену, срабатывает их цикл жизни: они распускаются, растут, задерживаются и постепенно увядают у тебя на пути.
Интересно наблюдать, как такой подход можно будет использовать в будущих WebGL-проектах.
@WebDev_Plus
В React Server Components обнаружена критическая уязвимость, описанная как CVE-2025-55182, которая затрагивает React 19 и использующие его фреймворки.
Исправление опубликовано в версиях React 19.0.1, 19.1.2 и 19.2.1. Рекомендуем немедленно обновить версию.
@WebDev_Plus
Исправление опубликовано в версиях React 19.0.1, 19.1.2 и 19.2.1. Рекомендуем немедленно обновить версию.
@WebDev_Plus
react.dev
Critical Security Vulnerability in React Server Components – React
The library for web and native user interfaces
❤1
This media is not supported in your browser
VIEW IN TELEGRAM
Сделай свой веб-интерфейс по-настоящему динозавровым 🦖
Меняй сложный JS на пару строк CSS, чтобы собрать карусели и оживить анимации.
Уже доступно в Chrome, скоро подтянутся и другие браузеры → https://goo.gle/44L646B
@WebDev_Plus
Меняй сложный JS на пару строк CSS, чтобы собрать карусели и оживить анимации.
Уже доступно в Chrome, скоро подтянутся и другие браузеры → https://goo.gle/44L646B
@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
❤2