Отрисовка в браузере большой анимации, или как уйти с mp4 к собственному формату видео

Представьте, что вам необходимо создать веб-страницу размером 5000х5000 пикселей, которая содержит сотни зацикленных движущихся объектов и при это должна быстро загружаться и поддерживать все современные браузеры. Представили?
А вот автор этой статьи не только представил, но и реализовал. Результатом своей работы он поделился здесь:

https://habr.com/ru/company/floor796/blog/673318/

Music App в рисованном стиле

Ловите интересную реализацию дизайна музыкального приложения, выполненную в рисованном стиле. Можете попробовать повторить его самостоятельно или, взяв его за основу, создать собственный вариант приложения:

https://codepen.io/havardob/pen/JjJXqZm

#codepen

​«Я всё время неправильно создавал формы в React.js»

Если вам часто приходится создавать формы с помощью React, то вы наверняка сталкивались с необходимостью использования множества useState для различных элементов формы.

В этой статье автор поделился собственным способом создания компонента формы, которые избавляет от этой проблемы и делает код более лаконичным:

https://dev.to/kuvambhardwaj/i-was-creating-forms-the-wrong-way-all-along-in-reactjs-hl3

#фронтенд #react

​Web Speech API в JavaScript: от текста к речи

Для того, чтобы преобразовать текст в речь в JavaScript существует готовое API под названием Web Speech API. Если хотите добавить на ваш сайт или в ваше приложение такую удобную функцию, то в этой статье автор вместе с читателями разбирается в её возможностях и функционале:

https://nuancesprog.ru/p/16036/

#javascript

​Wasp — язык для разработки полнофункциональных веб-приложений на Javascript без использования шаблонов

Встречайте Wasp — новый язык программирования для разработки полнофункциональных веб-приложений с меньшим количеством кода. Он упрощает разработку веб-приложений, но при этом позволяет использовать новейшие технологии, такие как React, Node.js и Prisma.

В этой статьей вы узнаете, чем полезен Wasp, в каких ситуациях может пригодится и какие перспективы имеет:

https://blog.devgenius.io/wasp-language-for-developing-full-stack-javascript-web-apps-with-no-boilerplate-84137afd4f4b

Wasp
- https://wasp-lang.dev/docs
- https://wasp-lang.dev/docs/tutorials/todo-app

Top 25 DevOps Interview Questions and Answers for Experienced Developers

https://twitter.com/javinpaul/status/1564565946915852288

How DNS works #devops #cheatsheet #DNS #Infosec

https://twitter.com/ptracesecurity/status/1562649932825526272

Awesome Github Actions
- https://github.com/sdras/awesome-actions#workflow-examples

GitHub Bots for every open-source project
1. https://pragativerma18.hashnode.dev/github-bots
2. https://www.twilio.com/blog/6-bots-better-open-source-project

Learn AWS
https://twitter.com/FlolightC/status/1564903279242498049?

Data structures and algorithms
https://twitter.com/javinpaul/status/1564859642101915648

Git courses

https://twitter.com/javinpaul/status/1565206943542792192

Scaling Git’s garbage collection | The GitHub Blog
https://github.blog/2022-09-13-scaling-gits-garbage-collection/

Learn Labs | HashiConf Global
https://hashiconf.com/global/learn-labs/

How to Set Up a Django Project – Real Python
https://realpython.com/courses/set-up-django-project/

Работа с анимацией на JavaScript с использованием requestAnimationFrame

Существует несколько известных способов работы с анимацией в JavaScript. Можно создать функцию с таймером, можно создать цикл. Но и там, и там сложно реализовать достаточную плавность.

Чтобы справиться с этой задачей лучше воспользоваться встроенным в HTML5 requestAnimationFrame API. Подробнее о нём и о том, как его использовать читайте здесь:

https://betterprogramming.pub/working-with-javascript-animations-using-requestanimationframe-f07e0658908e

#javascript