👩‍💻 Фишка в Django, о которой мало информации
У нас есть возможность собрать все приложения в одну директорию, что более удобно при их большом количестве и наличии дополнительных модулей функционала.

Инструкция прилагается, вопросы приветствуются)

📝 Сделал канал на дзене
Сейчас там составлен план публикаций из телеграм канала на 10 дней вперед, в разное время, чтобы прощупать работу алгоритмов, а так же автопубликация постов из канала в дзен.

Теперь все длинные посты, что я буду писать, а так же уроки с курса обучения по школе программирования будут выходить там в виде статей 😉

Я вернулся и готов пилить контент 😝

🔗 Налетаем

🖼️ Мои проблемы с WebRTC

WebRTC - это технология, которая позволяет устанавливать прямое соединение между браузерами для передачи аудио, видео и данных.
Но я обнаружил, что она не всегда работает корректно, если использовать VPN.

В чем проблема?
Соединение без особых признаков сбрасывается, что приводит к не работоспособности приложения.
При подключении к VPN, WebRTC не может открыть нужный порт для прямого соединения (p2p) между браузерами.
Это означает, что он не может установить прямой обмен данными между браузерами, и в этом случае, WebRTC переключается на режим работы через TURN сервер, который является посредником между браузерами и пропускает через себя весь трафик.
Я подозреваю, что мой VPN сервис не пропускает некоторые входящие UDP пакеты по каналу ко мне, из-за чего и происходит сброс соединения.

Как это выглядит в разных браузерах?
Кроме того, я заметил, что в разных браузерах WebRTC по-разному реагирует на отсутствие TURN сервера. В Firefox он выдает ошибку через 15 секунд, в которой указывает, что TURN сервер недоступен. А по консоли Chrome - такую роскошь не показывают.
Поэтому - когда я разрабатывал конференции на проекте, у меня было много проблем с WebRTC. Он то работал, то нет.
Я всегда сидел с включенным VPN, т.к. в текущих реалиях - это главное условие работы многих зарубежных сервисов, в том числе и Github Copilot. И соотвественно не мог понять, в чем дело.
Я пробовал выключать и включать VPN, но это не давало ярко выраженного результата, учитывая что в Chrome я не видел ошибок, а в Firefox видел, что еще сильнее сбивало с толку.

Мой совет
Если вы работаете с WebRTC, лучше отключите VPN.
А еще лучше - изучите технологию, с которой работаете)

Что дальше?
Сейчас готовлю информацию о том, как по WebRTC принимать поток записи экрана браузера прямо на сервер. До сегодняшнего дня - в моем понимании это было довольно сложно реализуемо, из-за убеждения в том, что нельзя открыть соединения без взаимного обмена одним и тем же набором потоков (Audio + Video)

🖼️ ChatGPT и контент

Я отказался от идеи заставлять нейросеть писать контент, т.к. на выходе получается хоть и структурированный текст, но с фундаментальными ошибками:
- Она может потерять контекст идеи поста
- Не понимать сложную тему и выдавать не достоверную информацию
- Текст все же при чтении ощущается "Роботным", "Бездушным"
- Не позволит сохранить авторский стиль написания даже в коротких записках

Но она на отлично замечает грамматические ошибки и мелкие недочеты. 😊
К примеру для поста про дзен - предложила добавить изображение и напомнила прикрепить ссылку на канал. Я считаю что это не сложная, но эффективная задача.
А в предыдущем посте - она нашла несколько грамматических и пунктационных ошибок, опечаток и предложила совершенно другую структуру поста. 👍

Если не забуду - прикреплю самый первый черновик поста, который я переписал, скормил нейросети и воспользовался ее советам.

Для неопытных писателей - мастхэв считаю точно 😉

Неросеть кстать от Bing, доступна в их браузере, но в РФ не доступна.
Использовать можно только с VPN.

А VPN я использую свой собственный, на серверах в Нидералндах, такой же, кстати, могу сделать и вам 😀

🤔 Как учить программирование без знаний английского?

Совместим пост про нейросети и новый инструмент разработки.

🙁 Что делать если нет актуальной информации на русском?
До недавних пор для изучения некоторых инструментов разработки или вопросов, по которым не удается найти информацию в рунете - доступен был только текстовый вариант информации с переводчиком, или же субтитры на ютубе.

🙌 Теперь можно переводить и видео
В последних обновлениях Яндекс Браузера появилась нейросеть, предоставляющая довольно неплохой закадровый перевод для любых видео.

☠️ Какие ограничения и как их обойти?
Из ограничений: видео должно длиться не более 4 часов.
Но и тут решение можно найти.
К примеру, я нашел отличную админ панель для Laravel, и вместо погружения в чтение документации - решил посмотреть видео с полным обзором ее функционала.
Оно длится чуть больше 4-х часов.
В данном случае все просто - на самом видео тут в одно видео собран целый плейлист из 20 разных видео.
Просто заходим на канал, открываем плейлист и начинаем использовать блага цивилизации)
Но если нужно прям кровь из носу перевести длинное видео, а запустить по частям его - нет возможности, то придется запариться...
- Качаем видео к себе (поможет savefrom.net)
- Открываем его в любом видео редакторе
- Нарезаем на куски длительностью до 4-х часов (Советую на всякий случай не более 3-х часов).
- И загружаем на любую из платформ, которые поддерживает переводчик яндекса: Яндекс Видео, на YouTube, Vimeo, VK или на платформу Coursera.
(Советую загружать в приватный доступ, чтобы не получить страйк или бан)
Далее точно так же заходим и смотрим только что загруженные видео.

🖼️ И про панель управления:
Пока это лучшее решение, из 5 самописных админ панелей для Laravel, 4 из которых написал я индивидуально под конкретные цели и задачи проектов. 👍

🖼️ Как ChatGPT помог мне с проектированием базы данных

Решил переписать один проект на FilamentPHP. (Это новый и мощный инструмент для создания админ панелей в Laravel, о котором я уже упоминал в своем предыдущем посте.)

В чем была проблема?
И почти час размышлял под фильмец: "А как бы аккуратненько спроектировать новое решение для хранения выходных дней, которые исполнитель указывает у себя в профиле"...

Сейчас это JSON поле, хранящее массив с номерами дней недели.
Поддерживается как в PostgreSQL, так и в MySQL, а Laravel довольно удобно позволяет с ними работать, в том числе и учитывать в запросе.
Но кто понял, тот понял - это очень плохая идея 😃

Как я искал решение?
Я долго думал над разными вариантами, но ни один из них не казался мне достаточно хорошим и оптимальным.

Осенило!
И тут вспомнил, что недавно читал в одном из маркетинговых телеграм каналов.
Там упоминался ChatGPT в качестве помощника в поиске вдохновения, в лучшем случае - идеи.
В таком случае качество того, что она пишет - роли большой не играет.

Я написал запрос в свободной форме, добавив все детали и требования, которые были важны для меня. Вместо того, чтобы пытаться угадать заголовок страницы, на которой может быть решение задачи 😃
Одна из представленных идей - мне особенно понравилась, и я решил ей реализовать.

А т.к. ответ оказался на столько банально простым - заодно и поделиться)
Представляю вашему вниманию, как по мне, неплохой кейс 🤫
(Скрин, и PDF файл выше)

А вы когда-нибудь использовали ChatGPT для своих задач? Если да, то расскажите как это было, попадались ли интересные кейсы?

🖼️ Автогенерация месседжей для коммитов 💣

🕐 В 13:08 Ждем длинный пост

🪲 Эффективный анализ багов

Ситуация:
При разработке админ-панели для проекта я решил использовать новый для меня инструмент - FilamentPHP (библиотека для создания админ-панелей). В форме редактирования пользователя есть поле для заполнения номера телефона.
В документации я нашел фишку, позволяющую настроить маску для него одной строкой кода, например, +7 (999) 999-99-99.
В процессе перепроверки функционала выяснилось, что она работает крайне странно:
• Чтобы она сработала, нужно снять фокус с поля, кликнуть на него и снова снять фокус.
• Иногда и это не помогает, нужно сделать так несколько раз.
• И пару раз она работала как надо, подставив плюс, семерку и другие символы прямо в процессе заполнения.
Я думал, что где-то ошибся, так как на сайте JavaScript библиотеки, которая используется, в демо-примере все отлично работает.
DEMO

Как я обычно делаю:
Чтобы разобраться с багом, я иду от самой проблемы вглубь кода, при этом часто добираюсь до исходников фреймворка или даже самой библиотеки, которая используется во фреймворке.
Со временем я начал использовать для этого дебаггеры, что немного упростило процесс. Но несмотря на все это, он всегда отнимает много времени.

Как я сделал в этот раз:
Я немного отвлекся, держа в уме проблему, и додумался заглянуть в репозиторий библиотеки FilamentPHP. Там я среди открытых issues (вопросов, проблем, багов) вбил в поиск слово mask, и "О, чудо-чудное!" - разобрался с масками.
Оказывается, проблема есть только в Firefox и, вероятно, связана с интеграцией в Livewire, на котором основан FilamentPHP, и способом подключения масок или AlpineJS внутри самого Filament.
Источник (Там даже есть предложения решения проблемы)

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

😉 Забыл предупредить:
У меня новый YouTube канал, и на нем снова идут стримы!

На старом не будет ничего интересного, а Twitch я официально забрасываю ради эксперимента над алгоритмами ютуба, и чтобы не париться за ограничения.
Позже сделаем с вами свой ReStream сервис, через который я уже буду запускаться на нескольких площадках.

Подписываемся, чтобы ничего не пропустить!
😉 @WebSmithCode

Помимо стримов будут обучающие ролики в порядке возрастания сложности 😊

🔥 FilamentPHP - композитное поле адреса

Композитное поле - это поле, которое состоит из нескольких других полей, при этом хранится в базе данных в одной, единственной, колонке.

Иногда приходится делать композитные поля, чтобы добавить валидацию на отдельные части строки, стандартизировать хранимое значение или просто разбить для удобства пользования.
Один из таких примеров: поле адреса.

В моем случае - это обычная строка, по типу "Брянская область, г. Брянск, ул. Романа Брянского, д. 15/1, кв. 276".
Она хранится в базе данных именно в таком виде, при том на самом сайте для нее 7 полей: Область, Улица, Город, Дом, Подъезд, Этаж, Квартира.
Задача такова: Упростить работу менеджеров, сняв с них ответственность за стандартизацию адреса

И в FilamentPHP сейчас нет такой возможности...
Я убил примерно два с половиной часа, чтобы придумать рабочее решение, и справился! 🥳

Представляю вам компонет композитного поля адреса для FilamentPHP 😃

😤 Небольшое разочарование в плагинах FilamentPHP

Плагинов много, но они мне перестают нравиться некоторые
Сегодня уже три попробовал плагина со сложным функционалом и они все не допиленные

- Плагин для генерации API из ресурсов - не задает route names
- Первый плагин TinyMCE - поддерживает только шаблоны захардкоженные в config, из которого не доступа к базе данных (но в теории можно извернуться и ссылку на эндпоинт поставить, теперь как я понял уже, когда разобрался), но у него нет нормальной темной темы и версия редактора v5
- Второй плагин редактора - с инвертированной логикой подключения шаблонов, что "обескураживает", так сказать 😆
Но и продумать логику настройки самого редактора можно полгубже, есть функции, которые не затронуты (+ это последняя версия с доступным плагином шаблонов в бесплатной версии)

Пока разбирался с API - понял, что проще сделать обыкновенный Laravel Resource, который предназначен для видоизменения структуры модели, и ответа от сервера, при том можно просто из роута возвращать сразу ресурс, плюс более продуманый механизм, т.к. штатный от лары

А пока разбирался с редакторами - понял, что у меня вообще до сих пор плагинов не стоит ни одного (кроме медиа плагина, который я даже не использовал еще ни разу)

🎁 И бонусом:
Меня очень привлекает вот такой плагин (Для подписи от руки)
Но в нем подпись не сохраняется в базу данных, на сколько я понимаю, и это только ожидается в будущих обновлениях.
Хотя сделать довольно просто.
Получается этот плагин в ту же копилку недопиленных плагинов, который просто дает скачать картинку, которую потом можно загрузить вручную в отдельное поле.
Но я его тоже форкну и допилю, т.к. подпись можно экспортировать в SVG формате, а значит можно привязать всю механику к текстовому полю, и сохранять прям в базу данных, дополнительным полем к одогвору, или вообще в теле договора - а не отдельным файлом


💭 ...Если в кратце, то я попробовал уже 3 плагина и изучил еще один

Итог: 4 из 4 - сырые и не допиленные, надо исправлять для полноценного выпуска в продакшн

🙃 Но в целом это все вообще не обязательно
Встроенного функционала хватает я считаю для любой панели средней сложности.

А для высокой сложности - это все еще не Wordpress, не достаточно еще плагины развились, но почти уверен что на ее базе выпустят полноценную CMS, если все пойдет хорошо (уже есть в качестве плагина)