Webdev сохраненки
13 subscribers
137 photos
17 videos
7 files
353 links
Tips and tricks и прочие полезности из области веб-разработки, а также репосты понравившихся материалов
加入频道
Forwarded from Библиотека программиста | программирование, кодинг, разработка
📚В постоянно обновляемой официальной онлайн-книге от команды OpenAI вы увидите множество примеров кода для выполнения общих задач с помощью OpenAI API, а также малоизвестных способов эффективного использования ИИ.

https://github.com/openai/openai-cookbook
Please open Telegram to view this post
VIEW IN TELEGRAM
Forwarded from BEARlogin Dev
Архитектура frontend

В отличие от бека, инфы про архитектуру фронта очень мало.
Но все-таки есть хорошие материалы.

Мне очень нравиться цикл статей https://khalilstemmler.com/articles/client-side-architecture/introduction//
Он поможет разобраться в принципах, философии и реализации архитектуры на фронте.

Так же могу посоветовать https://feature-sliced.design/ но там есть свои нюансы, о которых постараюсь написать позже.

#frontend #architecture #ddd
Forwarded from BEARlogin Dev
Киллер фича Vue Devtools и IDE

Хочу поделится крутым возможностями которую я недавно обнаружил в Vue Devtools

По умолчанию есть возможность из dev tools перейти прямо к Dom компонента в инспекторе Chrome, что уже очень удобно при отладке разметки и стилей. <> Inspect DOM

Но есть еще более восхитительная возможность переходить в код компонента из браузера прямо в IDE. Можно настроить любой редактор (у меня получилось с VSCode и PHPStorm, другие не пробовал)

Обычно работает из коробки в vue-cli, nuxt, но если нет читайте этот док https://devtools.vuejs.org/guide/open-in-editor.html

Так же эта кнопка появляется только если вы выбираете ваш компонент, а не компонент из Vuetify например.

#vue #devtools #советы
Forwarded from На фронте - javascript, html, css
Представляем вам Vue 3.3

В этом посте представлен обзор основных возможностей версии 3.3. Для получения полного списка изменений, пожалуйста, ознакомьтесь с полным журналом изменений на GitHub.

https://habr.com/ru/articles/735086/

#js #vue #ru

💬 Чат фронтендеров
Channel name was changed to «Webdev сохраненки»
Forwarded from На фронте - javascript, html, css
Как yarn v3 и философия Zero Installs помогли нам сократить длительность ci/cd пайплайна в 3 раза

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

https://habr.com/ru/companies/kts/articles/735104/

#js #ru

💬 Чат фронтендеров
Forwarded from xCode Journal
Что такое доступность
Часть 6

#html #формы

💛 Frontend || Vollex
Подробное введение в веб-доступность в контексте инклюзивных веб-сайтов, которое сделает ваш дизайн не только доступным для пользователей с любыми способностями, но и лаконичным и минималистичным.

Читать
This media is not supported in your browser
VIEW IN TELEGRAM
View Transition API позволяет анимировать flex и grid позиционирование 🧑‍🎓

С его помощью ты сможешь делать плавные переходы align-content и justify-content, всего в пару строчек JS

function setRandomAlignments() {
document.body.style.alignContent = positions[getRandomInt(3)]
document.body.style.justifyContent = positions[getRandomInt(3)]
}

document.body.addEventListener('click', e => {
if (!document.startViewTransition)
setRandomAlignments()
else
document.startViewTransition(() => {
setRandomAlignments()
})
})

CodePen (работает в хроме начиная со 111 версии, 63.55% по caniuse)
Please open Telegram to view this post
VIEW IN TELEGRAM
Forwarded from FrontEndDev
Возможности JS и TS, о которых многие не знают

Теггированые шаблонные литералы, Promise.allSettled, globalThis, WeakRef, явное определение неиспользуемых переменных и многое другое.

https://my-js.org/blog/js-ts-features