This media is not supported in your browser
VIEW IN TELEGRAM
Wi-Fi Fail Animation
Анимация ошибки при подключении к Wi-Fi, реализованная на CSS и SVG, c применением JavaScript
#codepen #css #svg #js #ui_элементы
https://codepen.io/jkantner/pen/OJEMxZR
@about_javascript
Анимация ошибки при подключении к Wi-Fi, реализованная на CSS и SVG, c применением JavaScript
#codepen #css #svg #js #ui_элементы
https://codepen.io/jkantner/pen/OJEMxZR
@about_javascript
👍3❤2
Как программисту записать свой трек
Наиболее привычным инструментом для программиста является редактор кода. Поэтому и музыку создавать будем там. Для этого нам потребуется Slang — язык программирования звук на основе, созданный с применением JavaScript.
Подробнее о языке, а также инструкция по использованию здесь:
https://github.com/kylestetz/slang
#slang #javascript
Наиболее привычным инструментом для программиста является редактор кода. Поэтому и музыку создавать будем там. Для этого нам потребуется Slang — язык программирования звук на основе, созданный с применением JavaScript.
Подробнее о языке, а также инструкция по использованию здесь:
https://github.com/kylestetz/slang
#slang #javascript
👍4
This media is not supported in your browser
VIEW IN TELEGRAM
Apple Mice
Анимация разных вариантов мышек, написана с помощью javascript и css.
#анимация #css #js
https://codepen.io/joshbader/pen/njKxzB
Анимация разных вариантов мышек, написана с помощью javascript и css.
#анимация #css #js
https://codepen.io/joshbader/pen/njKxzB
👍4❤3🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Changing Face Rating – шкала для оценки с анимированным смайликом, который меняется в зависимости от величины рейтинга.
@about_javascript
@about_javascript
👍6
This media is not supported in your browser
VIEW IN TELEGRAM
Bongo Cat Codes
Вы наверняка видели этот забавный мем в виде gif’ок или видео. Автор этого проекта решил реализовать его с помощью HTML и CSS, а вернее препроцессоров Pug и SCSS. Рисунок, разумеется, сделан с помощью SVG, а анимация реализована силами CSS.
Посмотреть код можно тут:
https://codepen.io/carolineartz/pen/VwYwZaP
#codepen #pug #scss
@about_javascript
Вы наверняка видели этот забавный мем в виде gif’ок или видео. Автор этого проекта решил реализовать его с помощью HTML и CSS, а вернее препроцессоров Pug и SCSS. Рисунок, разумеется, сделан с помощью SVG, а анимация реализована силами CSS.
Посмотреть код можно тут:
https://codepen.io/carolineartz/pen/VwYwZaP
#codepen #pug #scss
@about_javascript
👍4
This media is not supported in your browser
VIEW IN TELEGRAM
Glass Morphism
Приятная анимация кнопок.
#js #css #html #coden
https://codepen.io/katarzynamarta/pen/rNdbbVq
@about_javascript
Приятная анимация кнопок.
#js #css #html #coden
https://codepen.io/katarzynamarta/pen/rNdbbVq
@about_javascript
👍7🔥3❤1
This media is not supported in your browser
VIEW IN TELEGRAM
Decryption Effect with Pseudo Elements
Эффект расшифровки с псевдоэлементами. Реализован с помощью CSS и JavaScript.
#анимация #css #js
https://codepen.io/georgehastings/pen/YNMEbe
Эффект расшифровки с псевдоэлементами. Реализован с помощью CSS и JavaScript.
#анимация #css #js
https://codepen.io/georgehastings/pen/YNMEbe
👍6❤1🔥1
js2flowchart – Инструмент для визуализации JS-кода в виде flowchart диаграммы.
https://github.com/Bogdan-Lyashenko/js-code-to-svg-flowchart
https://github.com/Bogdan-Lyashenko/js-code-to-svg-flowchart
👍3❤1🔥1
mojs – очень интересный инструмент для создания моушн-графики на JavaScript с очень красивыми демками
Библиотека обладает декларативным API и хорошим списком демок и туториалов
⤷ Ссылка на проект
@about_javascript | #JavaScript #Interesting
Библиотека обладает декларативным API и хорошим списком демок и туториалов
⤷ Ссылка на проект
@about_javascript | #JavaScript #Interesting
👍9
@about_javascript
Please open Telegram to view this post
VIEW IN TELEGRAM
Lucide
Lucide Icons
Beautiful & consistent icon toolkit made by the community.
👍5❤1🔥1
В данном руководстве вы используете JavaScript для добавления интерактивности на веб-сайты, для разработки мобильных приложений, настольных приложений, игр, и в настоящее время JavaScript можно использовать для машинного обучения и AI.
https://github.com/Asabeneh/30-Days-Of-JavaScript
@about_javascript
Please open Telegram to view this post
VIEW IN TELEGRAM
GitHub
GitHub - Asabeneh/30-Days-Of-JavaScript: 30 days of JavaScript programming challenge is a step-by-step guide to learn JavaScript…
30 days of JavaScript programming challenge is a step-by-step guide to learn JavaScript programming language in 30 days. This challenge may take more than 100 days, please just follow your own pac...
👍8🔥3❤1
Запросы на сервер. Fetch, XMLHttpRequest (XHR), Ajax
Умение работать с запросами — один из главных навыков разработчика, потому что запросы отправляются и принимаются постоянно различными частями приложений. В этом виде вы в простой и понятной форме сможете разобраться в том, как работают запросы, какие варианты существуют и как их применять:
https://youtu.be/eKCD9djJQKc
#javascript #виде
@about_javascript
Умение работать с запросами — один из главных навыков разработчика, потому что запросы отправляются и принимаются постоянно различными частями приложений. В этом виде вы в простой и понятной форме сможете разобраться в том, как работают запросы, какие варианты существуют и как их применять:
https://youtu.be/eKCD9djJQKc
#javascript #виде
@about_javascript
👍4🔥1🥰1
This media is not supported in your browser
VIEW IN TELEGRAM
Little Gallery
Небольшой пак фотографий/картинок в виде карточек, которые анимируются вот таким способом. Непонятно на сколько это практично, но как минимум это забавно.
#js #css #html #coden
https://codepen.io/yoann-b/pen/abEjWgq
Небольшой пак фотографий/картинок в виде карточек, которые анимируются вот таким способом. Непонятно на сколько это практично, но как минимум это забавно.
#js #css #html #coden
https://codepen.io/yoann-b/pen/abEjWgq
👍3❤2🔥1
Создаём сайт портфолио с крутой анимацией
Видеоурок по созданию собственного сайта с диагональным плавным скроллом. Автор разбирает популярные техники и тренды веб-разработки, а именно:
— синхронизация вертикальных слайдов,
— CSS анимация скролла с инерцией,
— анимация при наведении.
Сайт выглядит современно и наполнен красивыми эффектами, но очень прост в реализации: https://youtu.be/oT0FN1PtmRU
#html #css #json
@about_javascript
Видеоурок по созданию собственного сайта с диагональным плавным скроллом. Автор разбирает популярные техники и тренды веб-разработки, а именно:
— синхронизация вертикальных слайдов,
— CSS анимация скролла с инерцией,
— анимация при наведении.
Сайт выглядит современно и наполнен красивыми эффектами, но очень прост в реализации: https://youtu.be/oT0FN1PtmRU
#html #css #json
@about_javascript
YouTube
Создание сайта портфолио с крутой анимацией (HTML CSS JavaScript)
💥 Все курсы в одном комплекте: https://webdesign-master.ru/courses/bundle/
В этом уроке мы рассмотрим создание сайта портфолио с диагональным плавным скроллом. Мы рассмотрим нестандартный способ синхронизации вертикальных слайдов на JS и инверсию движения…
В этом уроке мы рассмотрим создание сайта портфолио с диагональным плавным скроллом. Мы рассмотрим нестандартный способ синхронизации вертикальных слайдов на JS и инверсию движения…
👍5❤4🥰1
px3d – Experimental pixel 3d engine
Загружает сцену из блендера с помощью Three.js, и перерабатывает её в пиксельный вид, используя низкополигональные превращения.
🖥 Github
@about_javascript
Загружает сцену из блендера с помощью Three.js, и перерабатывает её в пиксельный вид, используя низкополигональные превращения.
@about_javascript
Please open Telegram to view this post
VIEW IN TELEGRAM
👍5❤1🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Checkbox Animations With Indeterminate State
Анимированный checkbox, выполненный с помощью SVG, CSS и JavaScript.
#css #js
https://codepen.io/jkantner/pen/BaJmyjo
Анимированный checkbox, выполненный с помощью SVG, CSS и JavaScript.
#css #js
https://codepen.io/jkantner/pen/BaJmyjo
👍9❤1🔥1
Vercel — веб-платформа для frontend-разработчиков
С её помощью можно очень легко и удобно развернуть собственный сайт. При этом размещать свои проекты можно с нулевой конфигурацией, а также автоматическим протоколом SSL и глобальной инфраструктурой CDN
Стоимость: #бесплатно (но платный тариф)
#web #frontend
С её помощью можно очень легко и удобно развернуть собственный сайт. При этом размещать свои проекты можно с нулевой конфигурацией, а также автоматическим протоколом SSL и глобальной инфраструктурой CDN
Стоимость: #бесплатно (но платный тариф)
#web #frontend
👍4❤2🔥1
Forwarded from React JS
Более 100 копий и альтернатив популярных сайтов с открытым исходным кодом, таких как Airbnb, Amazon, Instagram, Netflix, TikTok, Spotify, WhatsApp, YouTube и т. д. Настоящий кладез проектов для веб-разработчика. Список содержит исходный код, учебные пособия, демонстрационные ссылки, технический стек. Многие из проектов реализованы на React.
@react_tg
Please open Telegram to view this post
VIEW IN TELEGRAM
👍5
This media is not supported in your browser
VIEW IN TELEGRAM
🌀 VelocityJS demo
Подвижная анимация для загрузки. Реализована с помощью JavaScript и CSS.
#анимация #css #js
https://codepen.io/sol0mka/pen/eYgydO
@about_javascript
Подвижная анимация для загрузки. Реализована с помощью JavaScript и CSS.
#анимация #css #js
https://codepen.io/sol0mka/pen/eYgydO
@about_javascript
🔥3👍2❤1
This media is not supported in your browser
VIEW IN TELEGRAM
tRPC – полезный инструмент, который позволяет легко и безопасно создавать и использовать API без схем или генерации кода
Совместим со всеми фреймворками и рантаймами JavaScript
🖥 Github
@about_javascript
Совместим со всеми фреймворками и рантаймами JavaScript
@about_javascript
Please open Telegram to view this post
VIEW IN TELEGRAM
👍7