Логические операции с CSS-переменными
Статья Аны Тюдор рассказывает, как использовать всю мощь булевой логики в CSS, а главное - зачем это может понадобиться.
Читать: https://css-tricks.com/logical-operations-with-css-variables/
#css #advanced
Статья Аны Тюдор рассказывает, как использовать всю мощь булевой логики в CSS, а главное - зачем это может понадобиться.
Читать: https://css-tricks.com/logical-operations-with-css-variables/
#css #advanced
Forwarded from Веб-страница
This media is not supported in your browser
VIEW IN TELEGRAM
Анимация кривых Безье на чистом JavaScript
У нашего подписчика вышло очередное видео, в котором он показывает, как создать анимацию кривых Безье на чистом JavaScript, как на видео в посте:
https://tprg.ru/4bRJ
Ещё несколько примеров использования такой анимации:
— https://tprg.ru/nurR
— https://tprg.ru/zeRC
— https://tprg.ru/Md9U
— https://tprg.ru/e6JT
А вот другие его уроки на тему анимации:
— анимация частиц с параллакс эффектом;
— эффект электроразряда;
— анимация перемещения частиц по гексагональной сетке.
#фронтенд #javascript
У нашего подписчика вышло очередное видео, в котором он показывает, как создать анимацию кривых Безье на чистом JavaScript, как на видео в посте:
https://tprg.ru/4bRJ
Ещё несколько примеров использования такой анимации:
— https://tprg.ru/nurR
— https://tprg.ru/zeRC
— https://tprg.ru/Md9U
— https://tprg.ru/e6JT
А вот другие его уроки на тему анимации:
— анимация частиц с параллакс эффектом;
— эффект электроразряда;
— анимация перемещения частиц по гексагональной сетке.
#фронтенд #javascript
Forwarded from FrontEndDev
Возможности TypeScript: основные фишки и ключевые отличия от JavaScript.
Плейлист от Евгения Ковальчувка
https://www.youtube.com/playlist?list=PLNkWIWHIRwMEm1FgiLjHqSky27x5rXvQa
Плейлист от Евгения Ковальчувка
https://www.youtube.com/playlist?list=PLNkWIWHIRwMEm1FgiLjHqSky27x5rXvQa
Forwarded from DНЕВНИК web-программиста
Анимация это то, без чего невозможно представить сегодняшний веб. У меня даже одно тестовое было исключительно на понимание производительности анимаций.
Кто-то создаёт анимацию на JS, но CSS тоже не стоит забывать.
Вчера наткнулся на короткую, но хорошую статью - Анализ производительности CSS-анимаций
#css
Кто-то создаёт анимацию на JS, но CSS тоже не стоит забывать.
Вчера наткнулся на короткую, но хорошую статью - Анализ производительности CSS-анимаций
#css
Forwarded from Находки в опенсорсе
Introducing @nuxt/components: module to scan and auto import components for Nuxt.js 2.10+
No need to import your components anymore.
- Scan and auto import components
- Multiple paths with customisable prefixes and patterns
- Lazy loading support
- Hot replacement
- Support for library authors
https://github.com/nuxt/components
#nuxt #vue #ts
No need to import your components anymore.
- Scan and auto import components
- Multiple paths with customisable prefixes and patterns
- Lazy loading support
- Hot replacement
- Support for library authors
https://github.com/nuxt/components
#nuxt #vue #ts
#js #tips
Понравилась статья про промисы. Очень даже неплохо расписано!
https://habr.com/ru/post/501702/?
Понравилась статья про промисы. Очень даже неплохо расписано!
https://habr.com/ru/post/501702/?
Хабр
Визуализация промисов и Async/Await
Доброго времени суток, друзья! Представляю вашему вниманию перевод статьи «JavaScript Visualized: Promises & Async/Await» автора Lydia Hallie. Приходилось ли вам сталкиваться с JavaScript кодом,...
#fullstack #js #node #react #mongo #course #english #нереклама
Бесплатный курс по фулстек-разработке на JS в стеке MERN (MongoDB, Express.js, React.js, Node.js). 10,5 часов. Еще два дня можно бесплатно зарегаться.
Я лично пока не готов в это окунаться, но есть вероятность, в будущем тоже пойду с ними разбираться.
https://www.udemy.com/course/mern-stack-master-course-building-your-own-instagram/?couponCode=ENJOYLOCKDOWN4
Бесплатный курс по фулстек-разработке на JS в стеке MERN (MongoDB, Express.js, React.js, Node.js). 10,5 часов. Еще два дня можно бесплатно зарегаться.
Я лично пока не готов в это окунаться, но есть вероятность, в будущем тоже пойду с ними разбираться.
https://www.udemy.com/course/mern-stack-master-course-building-your-own-instagram/?couponCode=ENJOYLOCKDOWN4
Udemy
MERN Stack Master Course - Building your own Instagram
Build Your own Instagram with React, Express, Node.js & MongoDB
#frontend #mobile #js #react #course #english #нереклама
Еще один временно бесплатный курс по мобильной разработке на ReactNative (js). 14 часов.
Мобильная разработка при тех же трудозатратах часто стоит в разы больше, чем аналогичная веб-разработка. Есть, конечно, еще Vue Native, но он построен поверх React Native, и по нему еще не выложили бесплатный курс :)
Если уже знаешь React/Vue, то подумай: может, стоит перейти на мобилку? А? А? ;)
Я зарегался, а вы - как хотите.
https://www.udemy.com/course/react-native-and-redux-course-using-hooks/?couponCode=ENJOYLOCKDOWN
Еще один временно бесплатный курс по мобильной разработке на ReactNative (js). 14 часов.
Мобильная разработка при тех же трудозатратах часто стоит в разы больше, чем аналогичная веб-разработка. Есть, конечно, еще Vue Native, но он построен поверх React Native, и по нему еще не выложили бесплатный курс :)
Если уже знаешь React/Vue, то подумай: может, стоит перейти на мобилку? А? А? ;)
Я зарегался, а вы - как хотите.
https://www.udemy.com/course/react-native-and-redux-course-using-hooks/?couponCode=ENJOYLOCKDOWN
Udemy
React Native and Redux Course using hooks
Take your react.js skills to next level by building Native Android and IOS Apps using React Native
Вай, господа, забыл промокоды добавить!😅 Теперь добавил)
Декораторы в JavaScript
Декораторы — это объекты, которые используются для динамического добавления дополнительной функциональности к другому объекту без изменения реализации этого объекта.
Подробнее: https://nuancesprog.ru/p/7110/
#javascript #bestpractices
Декораторы — это объекты, которые используются для динамического добавления дополнительной функциональности к другому объекту без изменения реализации этого объекта.
Подробнее: https://nuancesprog.ru/p/7110/
#javascript #bestpractices
Всем привет!
В списке моих каналов - прибавление 😁
https://t.me/svelte_uncolored
Svelte очень активно развивается и очень быстро догоняет большую тройку лидеров. Поэтому мне кажется, сейчас самое время в него погрузиться, чтобы оказаться на вершине этой волны через пару лет, когда он догонит остальных.
В связи с этим я решил начать копить материалы по Svelte на отдельном канале. Присоединяйтесь - будем разбираться с ним вместе ;)
В списке моих каналов - прибавление 😁
https://t.me/svelte_uncolored
Svelte очень активно развивается и очень быстро догоняет большую тройку лидеров. Поэтому мне кажется, сейчас самое время в него погрузиться, чтобы оказаться на вершине этой волны через пару лет, когда он догонит остальных.
В связи с этим я решил начать копить материалы по Svelte на отдельном канале. Присоединяйтесь - будем разбираться с ним вместе ;)
#js #tools #english
D3.js — очень популярный фреймворк для визуализации данных.
Думаю, хорошему фронтендеру очень полезно его освоить.
D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG, and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation.
https://medium.com/javascript-in-plain-english/how-to-make-stunning-data-visualizations-with-d3-js-93a588600b45
D3.js — очень популярный фреймворк для визуализации данных.
Думаю, хорошему фронтендеру очень полезно его освоить.
D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG, and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation.
https://medium.com/javascript-in-plain-english/how-to-make-stunning-data-visualizations-with-d3-js-93a588600b45
Medium
How to Make Stunning Data Visualizations With D3.js
Displaying hierarchical data sets as interactive treemaps
Использование CSS-масок и SVG для создания зубчатых краев.
https://css-tricks.com/using-css-masks-to-create-jagged-edges/
https://css-tricks.com/using-css-masks-to-create-jagged-edges/
CSS-Tricks
Using CSS Masks To Create Jagged Edges | CSS-Tricks
I was working on a project that had this neat jagged edge along the bottom of a banner image.