WebDev+ | Веб-разработка
8.3K subscribers
507 photos
242 videos
10 files
702 links
Присоединяйтесь к нашему каналу и погрузитесь в мир веб-разработки

Связь: @devmangx
Download Telegram
Боитесь говорить по-английски? Потренируйтесь с помощью этого ресурса!
Он позволяет вам вести естественные разговоры с искусственным интеллектом.

Вы можете выбрать мужской или женский голос, который будет следовать контексту вашего разговора на протяжении всего общения.

Это бесплатно → http://app.sesame.com

@WebDev_Plus
6👍1
This media is not supported in your browser
VIEW IN TELEGRAM
React Email 5.0 уже вышел

Лучший способ создавать электронные письма.

✓ Теперь с поддержкой темного режима!
✓ Совместимость с Tailwind 4
✓ 8 новых компонентов

Предварительный просмотр, линтер и многое другое:

npx create-email@latest

@WebDev_Plus
4
Старая HTML-фича, о которой до сих пор многие не знают или просто не используют, хотя она может заметно упростить вёрстку.

Кнопка submit не обязана быть дочерним элементом своего <form>.

@WebDev_Plus
😁31
Они выкатили PHP 8.5. И среди новых фич появился отличный пайп-оператор |>.

А разве не говорили, что его похоронили?

@WebDev_Plus
This media is not supported in your browser
VIEW IN TELEGRAM
Context-aware CSS эффект свечения/блика на карточке

фишка такая: дублируешь и увеличиваешь иконку. двигаешь её через pointermove. вешаешь feGaussianBlur

https://codepen.io/jh3y/pen/WbwZaNa

@WebDev_Plus
16👍3🔥2
«Создаёт интерфейсы визуального программирования на основе узлов»

https://github.com/retejs/rete/

@WebDev_Plus
6👍3
создал JavaScript за 10 дней
написал язык, который стал основой всего веба
соосновал Mozilla и участвовал в создании Firefox
никогда не выпячивал гений и не бегал за вниманием
всегда ставил инженерию выше хайпа
стал CEO, ушел через 11 дней из-за скандала
тихо вернулся с браузером Brave и перевернул тему приватности в интернете
до сих пор пишет код, до сих пор строит, доказывая, что талант не обязан шуметь


Брендан Айк — легенда, которой пользуются каждый день, но почти никогда не благодарят. ❤️

@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
18🆒5
Лучшая библиотека для аутентификации в веб-проектах получила обновление и завезла новые фичи:

✓ работа без базы (stateless auth)
✓ более гибкая настройка OAuth
✓ ротация JWT-ключей

Поддерживаются React, Vue, Next.js, Nuxt, Astro и другие.

npm install better-auth


@WebDev_Plus
Это одна из самых полезных настроек VS Code:

"typescript.referencesCodeLens.enabled": true


Она показывает прямо в коде, где используется функция или переменная.

Удобно, когда проект большой и нужно быстро понять зависимости и связи в коде.

Ставь лайк. если давно пользуешься🩷

@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥7
This media is not supported in your browser
VIEW IN TELEGRAM
Это MicroCAD. Язык программирования для твоих 3D-проектов.

Ты можешь создать собственный LEGO-блок в нескольких строках кода и экспортировать его в STL для 3D-печати.

@WebDev_Plus
👍5
CSS-переменные в Tailwind v4+

@WebDev_Plus
7
This media is not supported in your browser
VIEW IN TELEGRAM
Это одно из лучших расширений VS Code.

Копируйте все, что находится в скобках, с помощью горячей клавиши (Alt + a).

Не знаю, как разработчики могут работать без него.

@WebDev_Plus
👍71
This media is not supported in your browser
VIEW IN TELEGRAM
Генератор паролей в хакерской тематике на HTML, CSS и JavaScript

@WebDev_Plus
🔥5
JavaScript: когда использовать геттеры, а когда методы

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
4
This media is not supported in your browser
VIEW IN TELEGRAM
border-radius развивается в CSS!

Благодаря новому свойству corner-shape.

@WebDev_Plus
👍9
"Ад из React Context" на самом деле не такой уж страшный, и в нём нет ничего плохого.

Если глубокая вложенность раздражает, просто поставь размер табуляции в 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
👍4👏2
This media is not supported in your browser
VIEW IN TELEGRAM
Это вообще спокойно делается на CSS

- используй маску по бордеру, слои + overflow: hidden или другие трюки.

- градиент анимировать не надо, просто крути слой с градиентом 1:1 🤙

@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥8