Webchic - frontend, backend, ci/cd
996 subscribers
273 photos
22 videos
1.11K links
Канал о Web разработке, для фронтов и full stack.

По рекламе @adtgassetsbot
Admin: @Aleksei

🐍Python - @python_lounge
👨‍💻Другие языки - @cccoding
🥷Хакер/ИТ безопасность - @it_ha
Download Telegram
Taiga UI — библиотека компонентов под Angular, которую вам стоит попробовать

#angular #architecture

К статье
​​☕ Angular must die: фреймворк обходится компаниям в миллиарды долларов

Angular усложняет разработку UI и увеличивает расходы компаний. Пора от него избавиться?

Статья
Как отслеживать производительность веб-приложения с JavaScript и Performance API

#performance #browser

К статье(rus)
​​Включить вибрацию на смартфоне

Метод vibrate() объекта window.navigator может включить режим вибрации на устройстве (при условии что устройство поддерживает режим вибрации).

window.navigator.vibrate(500);

Методу можно передать параметр – время вибрации в миллисекундах. А можно указать даже паттерн – чередование интервалов вибрации и пауз. Для этого передайте методу массив чисел.
This media is not supported in your browser
VIEW IN TELEGRAM
CSS совет от Jhey Tompkins

НЕ используйте <div> для прогресс бара!
Используйте элемент <progress>
Вы можете стилизовать его с помощью переменных CSS и некоторых псевдоселекторов.

#css #html

Codepen

Twitter
Jack Franklin, разработчик Chrome Dev Tools и Puppeteer, делится советами по организации большого приложения на React.js

— Сборщики
— Организация структуры директорий
— Организация кода React.js компонентов
— Организация Redux actions, reducers с помощью подхода Ducks
— Тесты

#react #redux

К статье(eng)
Улыбнешься - проиграешь

Браузерная игра, для реализации которой использовалась библиотека face-api.js(надстройка над tensorflow.js) для распознавания лиц.

#tensor_flow #face_api #ml

К игре
К статье(eng)
Создание нейронной сети Хопфилда на JavaScript.🔥

Столкнувшись в университете с нейронными сетями, одной из любимых для меня стала именно сеть Хопфилда. Я был удивлен, что она оказалась последней в списке лабораторных, ведь ее работу можно наглядно продемонстрировать при помощи изображений и она не так сложна в реализации.

[ Статья ]
​​Эффекты перехода между картинками с помощью WebGL

Ссылка
Кодинговое интервью Google с обычным инженером программистом

#interview

Youtube(eng)
This media is not supported in your browser
VIEW IN TELEGRAM
Animista - сервис с большим набором готовых анимаций, которые можно поднастроить и скопировать код

#css

Animista
Как создать сервер GraphQL в Next.js

В туториале рассматривается пример подключения GraphQL в Next.js приложение с помощью apollo-server-micro

#graphql #nextjs

К статье(eng)
Советы по typescript: какие возможности языка стоит использовать в своих проектах

https://habr.com/ru/company/tinkoff/blog/521262/
This media is not supported in your browser
VIEW IN TELEGRAM
Josh W. Comeau: “Это круто! Меняйте числа, чтобы создать формы, затем скопируйте css созданной формы”

“Т.к. это clip-path, это можно применить к вашим картинкам, HTML элементам, к чему угодно!

Больше не надо border-хаков для создания базовых форм”

#css

Codepen

Twitter
This media is not supported in your browser
VIEW IN TELEGRAM
Josh W. Comeau: “Оберните текст вокруг прозрачных файлов .png с помощью shape-outside 😮”

.me {
float: left;
shape-outside: url(/image/path.png);
/ Add some spacing: /
transform: translateX(-16px);
}

#css

Twitter

Codepen
До свидания, Google Fonts. Последний аргумент

В статье рассказывается, почему не стоит больше подключать шрифты с CDN Google Fonts, а более производительней отдавать их со своего хостинга.

#performance

К статье(rus)
Node.js in 2021: новости платформы и вызовы на следующее десятилетие

#nodejs

Youtube
Разница между HTMLCollection и NodeList

#browser_api

К статье(rus)
<wbr> - html элемент, указывающий браузеру где “обрывать” слово для переноса на новую строку при необходимости

#html

К статье(eng)
This media is not supported in your browser
VIEW IN TELEGRAM
Использование css переменных в Angular темплейтах

#angular

К статье(eng)