Cododel.dev | Александр

А еще знаю, что есть новички в веб разработке, напишу Вам в чате.
Что-то хочется мне для вас устроить прямую трансляцию с разбором Canvas анимации на JavaScript.

Разберем и перепишем с использованием ООП очень простой пример, который у меня на гитхабе лежит. Чуть-чуть потрогаем и вспомним школьную геометрию 8-9 классов)

А кто совсем не "бум-бум" - посмотрит просто, одним глазком. 🙂

#web #frontend #javascript #canvas #animation

👩‍💻 Хотел делать как всегда на AlpineJs, который мне полюбился сразу, как я начал делать что-то подобное. Но меня не покидала мысль сделать это на VueJs с компонентами и нормальной разбивкой на части.
Начал делать и понял, что целый Vue тянуть это оч плохая идея. Да и долго это всё, окружение еще настроить, сборку в единый бандл и т.п.

Почитал о SolidJs, понял что долго буду вливаться, и тут промелькнул PetiteVue, которого поддерживает сам Evan You. Почитал кучу хвалебных статей, с помаркой, мол "Для виджетов". И загорелся.
Сразу написал вам пост, и взял в работу.

И вылезли подводные камни...
Мне очень хотелось компоненты, биндинги и вынос логики в JS. А так нельзя 😂
Выходит очень перегруженно, что-то более менее сложное - сломает ногу(
Потерял день и переписал всё обратно на Alpine.

Мораль:
Почитал статью про новый "Супер мега инструмент" и планируешь внедрять - проверь на достоверность 😉

— P.S.
И кстати потом постфактум человек заказчика заявил, что нужен "Подключаемый виджет, в одном .js файле". И инициализцией через JS функцию.
Я подсуетился и за полдня при помощи EsBuild - собрал JavaScript, подключил Sass, Pug и запихнул в бандл все HTML сущности в <template> тегах.
А Alpine c CDN подтягивается, чтобы не плодить кучу разных виджетов с Alpine внутри бандла.
Делается очень просто) Потом расскажу.

#web #frontend #javascript

👩‍💻 Что-то я пропал немного 😁
Выше я писал про PetiteVue, сегодня проясню.

Я в тот момент делал полноэкранный вижет обратной связи. И естественно встраиваемый.
До этого я еще почитал о ShadowDom, но не осмелился взять его в работу.
А вот опыт перескакивания между фреймворками у меня большой)

#web #frontend #javascript

Cododel.dev | Александр pinned «⛓ Ссылки ⛓ - Наш приватный чат - Мой GitHub - Read on your language Соцсети: 📹 Twitch 😉 YouTube»

👩‍💻 Не поверите!
Открыл для себя сегодня PetiteVue

Тоже самое, что AlpineJs, но ближе к Vue и мне больше нравится)

Интересно кому?

#web #frontend #javascript

👩‍💻 На стриме был вопрос с собеседования:
Как сгенерировать массив чисел и найти в нем только четные?

Оставлю тут 🤷‍♂️
Решение на JavaScript
array = []
for (let i=0; i<100000; i++){
const num = Math.round(Math.random() * 10000000)
array.push(num)
}
array.filter(i=>!(i%2))

#javascript #forbeginners

⛓ Ссылки ⛓
- Наш приватный чат
- Мой GitHub
- Read on your language

Соцсети:
📹 Twitch
😉 YouTube

Channel created