mytrashdev
mytrashdev
Trash Dev
19 posts
Дневник грязной разработки
Don't wanna be here? Send us removal request.
mytrashdev · 5 months ago
Text
Свой ютуб 1
И так много чего мы уже делали и интернет-радиостанции, и новостной сайт, даже десктопную программу пилили. А теперь сделаем свой ютуб. И так как сервер у нас уже куплен для радио и там развёрнут веб сервер Апач. Мы там и продолжим делать.
Tumblr media
И так у меня есть уже свой домен. Разверну свой ютуб на под домене video.my-gemorr.ru для этого в DNS серверах моего домен пропишу A запись.
video.my-gemorr.ru. 3600 A (адрес Internet v4) ip_сервера
Теперь надо добавить виртуальный хост апача. Создам для своего видео хостинга директорию
mkdir /var/www/video.my-gemorr.ru
теперь создам конфигурационный файл апача
nano /etc/apache2/sites-available/video.my-gemorr.ru.conf
там напишем
Tumblr media
<VirtualHost *:80> ServerAdmin [email protected] ServerName video.my-gemorr.ru DocumentRoot /var/www/video.my-gemorr.ru ErrorLog ${APACHE_LOG_DIR}/error.log CustomLog ${APACHE_LOG_DIR}/access.log combined <Directory "/var/www/video.my-gemorr.ru/"> DirectoryIndex index.html index.php Options FollowSymLinks AllowOverride All Require all granted </Directory> </VirtualHost>
Активируем наш виртуальный сервер
sudo a2ensite video.my-gemorr.ru.conf
так же нам придется включить
sudo a2enmod rewrite
и установить PHP и mqsql
sudo apt install php php-mysql libapache2-mod-php -y sudo apt-get install mysql-server mysql-client
У меня встала версия php 7.4. Проверить это можно командой
php -v
И так встречайте наш кандидат cms по типу ютуба или движок видиохостинга cumulusclips
Он удовлетворит все наши нужды. Умеет регистрировать пользователей, даёт возможность загрузки видео, разделение видео на категории и теги. Даже мобильная версия есть.
Tumblr media
Правда он заброшен лет 10 назад. Но мы откопаем труп. И так вот его гитхаб
https://github.com/cumulusclips/cumulusclips
В его системных требования написано
The following PHP modules are required:
* GD * POSIX * SimpleXML * ZIP * CURL
Устанавливаем их
sudo apt-get install php7.4-gd sudo apt-get install php7.4-posix sudo apt-get install php7.4-simplexml sudo apt-get install php7.4-zip sudo apt-get install php7.4-curl
Так-же на страницы проекта указаны рекомендованные настройки для php
nano /etc/php/7.4/apache2/php.ini
И правим там настройки как указанно нп гитхабе, то есть находим параметры и меняем значение на рекомендованные.
short_open_tags = on upload_max_filesize = 110M post_max_size = 110M max_execution_time = 1500 safe_mode = off register _globals = off
Кстати, какой-то из двух последних параметров я не нашел и, естественно, не менял. Без него все нормально работало. Что бы проверить что все изменения применились и с php все ок. Создадим тестовую страницу командой
nano /var/www/video.my-gemorr.ru/phpinfo.php
И там напишем
phpinfo(); посмотрите как это надо правильно написать ибо тумблер в целях безопасности не дает мне это сделать
Перезагрузим апач
sudo systemctl restart apache2
Собственно теперь можно посмотреть все настройки php в моем случаи это будет по адресу
http://video.my-gemorr.ru/phpinfo.php
собственно у вас будет свой домен.
Ну и параметры я поставил больше на много больше. Я решил, что для фильма 110 мб мало и можно 11000мб и так далее.
Теперь дело за малым качаем проект только не с гита, а от сюда, ибо на гите не кодеров. я думаю, что это как-то связанно с лицензиями. Так что берем, по-моему, линку с кодерами.
А к установке приступим в следующем посте.
0 notes
mytrashdev · 5 months ago
Text
Проект интернет радиостанции.
Пора описать итоги по развёртыванию интернет радиостанции. Мы смогли сделать полноценную радиостанцию со своим сайтом и плеером, а также возможностью вести прямые трансляции в эфире. Стоимость всего проекта 150 рублей/месяц. По времени всё это  заняло около двух недель, с моей прокрастинацией и болезнями. Думаю, можно сделать за день.
Tumblr media
Но просто реализации как всегда мало. Нужна идея, мысль, желание. Чтобы можно было придумать передачи, гостей; найти музыку для трансляций. Согласно стилю и теме радиостанции подать рекламу, чтобы привлечь людей той же направленности. Будь то единая идея, географический признак или национальность.
Tumblr media
Но это всё за пределами моего желания. Получается так, что со временем становится всё меньше желания говорить о чём-либо. Если бы я хотел вести радио эфир, то он был бы о всемирном заговоре пришельцев, о рептилоидах и о плоской земле. Я бы сидел у микрофона с бутылкой виски и сигарой. И разговаривал со слушателями на тему о том, как правильно сделать шапку из фольги. Но, увы, так как это никому не нужно, то желания делать что-то подобное нет.
Tumblr media
Поэтому итог: проект «Интернет радиостанция» реализован полностью и функционирует. Есть ли у него жизнь? Скорее нет, так как нет идеи и заняться им некому. Он просуществует пока оплачены сервера. В целом я получил то, что хотел, я люблю программирование и компьютеры и получил от этого свою долю эндорфина. Теперь выберем проект с помощью «Решателя» и будем идти дальше.
2 notes · View notes
mytrashdev · 5 months ago
Text
Интернет радиостанция 4
Теперь начнём повелевать эфиром. Станем ведущим радиоэфира. Когда-то, в детстве, я мечтал об этом. Сегодня закрою свой гештальт.
Tumblr media
Для подключения к нашему серверу, в качестве радиоведущего, нам потребуется специальный софт. Я знаю всего две программы, поэтому расскажу о них.
Tumblr media
RadioBoss - довольно неплохая программа, которую, к тому же, можно купить в России. Итак, интерфейс представляет собой плейлист, куда нам нужно добавить свои треки.
Tumblr media
В правом нижнем углу есть кнопка микрофона, которая позволяет ведущему вещать в эфир (громкость музыки автоматически снизится).
Tumblr media
Собственно, это всё, что нужно для начала. Чтобы подключиться к станции жмём на шестерёнку в верху. В настройках выбираем пункт «Вещание». В поле «Сервер» набираем точку монтирования, в моём случае это radio.my-gemorr.ru:8000/mainstream.ogg. Пароль будет тот самый, который мы задавали во время настройки. Не забудем указать те же характеристики битрейта и т.д., что мы указывали в настройках ices. Иначе, при переключении с авто диджея на прямой эфир, может выключаться плеер у слушателей. Прочие вкладки тоже можно заполнить по усмотрению.
Теперь, когда все настройки сохранены, на нашем сайте играет авто диджей (ices). Когда ведущий готов к эфиру он просто нажимает иконку земли рядом с шестерёнкой и ведёт своё шоу. В это время в плеере на сайте прекращается работа авто диджея и все слушатели слушают эфир ведущего.
Tumblr media
Повторим ту же процедуру с программой SAM Broadcaster. Во вкладке «Queue» можно добавить треки в очередь воспроизведения. Вкладки «encoders» может не быть. Чтобы она появилась надо будет поставить галочку напротив Encoders в меню Window.
Tumblr media
Когда вкладка будет на столе нужно нажать там +. В появившемся окне выбрать тот же формат, что и в ices, в нашем случае ogg. Далее можно заполнять данные для подключения к нашему серверу icecast. Server ip: я пишу свой домен:
Tumblr media
radio.my-gemorr.ru
Server Port
8000
Username: у меня он пустой, но при пустом поле программа выдавала ошибку логина или пароля.
Как-то так вышло, что если у вас нет имени пользователя, то следует писать
Source
Password - пароль который мы задавали при настройке icecast
В поле Mount пишу свою точку монтирования:
/mainstream.ogg
Tumblr media
Далее можно заполнить поля по своему желанию и нажать кнопку «ок».
Теперь, если в окне Encoders нажать на вновь созданный энкодер правой кнопкой мыши и выбрать пункт play начнётся трансляция на сайт. При выборе кнопки «Stop» -  остановится.
В Семе есть много окон VoiceFX, которые отвечают за включение микрофона ведущего, в окне SoundFX всякие звуковые эффекты типа аплодисментов.
Вот так, за несколько небольших шагов, удалось создать сайт, интернет радиостанцию и освоить азы ведущего и его софт.
0 notes
mytrashdev · 5 months ago
Text
Интернет радиостанция 3
Ну, теперь пошла самая жара. Наш icecast вместе c ices поют на точки монтирования. Сделаем простой, статичный сайт с одной страницей для плеера.
Tumblr media
Я набрал в гугле – «html сайт для радио» и скачал шаблон в стиле «старой школы» тут.
Установим веб сервер:
apt install apache2
Теперь подключаемся к FileZilla к нашему серверу и закачиваем в каталог /var/www наш скачанный сайт, чтобы получилось как-то так:
Tumblr media
И все, теперь ваша страница сайта, как и моя, доступна по адресу домена.
(В моем случае https://radio.my-gemorr.ru)
Самое главное в радио сайте это плеер. Я зашёл на сайт https://playerjs.com/ и выбрал понравившийся скин. Зарегистрировался и скачал плеер,  кинул в корень(/var/www) сайта.
Tumblr media
Осталось заполнить страницу контентом и выбрать место расположения плеера. Я сделал так:
Tumblr media
В итоге получилось неплохо, за три подхода - сайт радиостанции с самой радиостанцией.
Post Scriptum
Tumblr media
Мне хотелось больше изврата и я решил получить ssl сертификаты. Я пытался его вкорёжить в icecast, но ничего не вышло, я пытался дня два.  Пробовал собирать icecast с нуля вместе с openssl с репозитория xiph. Я даже дождался того дня, когда отражённый свет урана падал на мой процессор под прямыми углами, и я был одет в счастливые носки. Я не смог этого сделать.
Я сдался и выбрал позорный способ проксирования через apach. Если у кого получится запустить icecasat с сертификатом - расскажите как…
0 notes
mytrashdev · 5 months ago
Text
Интернет радиостанция 2
И так наши точки монтирования пока молчат. Настало время включить музыку авто-диджея и оживить свою радиостанцию.
И так подключаемся к нашему серверу по ssh и устанавливаем ices
Tumblr media
apt install ices2
После чего скопируйте пример конфигурационного файла в /etc/icecast2:
cp /usr/share/doc/ices2/examples/ices-playlist.xml /etc/icecast2/ices.xml
Отредактируем наш конфигурационные файлы в nano
nsno /etc/icecast2/ices.xml
Нам надо, что бы наш авто диджей всегда мог работать в фоновом режиме, для этого поставим значение 1
<background>1</background>
в разделе можете написать, что вашей душе угодно.
<metadata>     <name>Example stream name</name>     <genre>Example genre</genre>     <description>A short description of your stream</description> </metadata>
В поле настройки для нашего плейлиста: его местоположение, и способ проигрывания и т.д.
Tumblr media
<input>     <module>playlist</module>     <param name="type">basic</param>     <param name="file">/etc/icecast2/playlist.txt</param>     <param name="random">1</param>     <param name="restart-after-reread">0</param>     <param name="restart-after-reread">0</param> </input>
в следующих полях нам нужно указать пароль, который мы указывали при установке icecast и точку монтирования авто-диджея, которую мы создали при настройке.
<hostname>127.0.0.1</hostname>  <port>8000</port>  <password>пароль_при_настройке_icecast</password>  <mount>/avtoDJ.ogg</mount>  <yp>0</yp>
В поле можно поменять тех данные потока Теперь нам нужно добавить ices как службу
mkdir /var/log/ices touch /var/log/ices/ices.log touch /var/log/ices/ices.pid
Tumblr media
теперь напишем юнит
nano /etc/systemd/system/ices.service
А там
[Unit] Description=Ices Service After=icecast2.service [Service] Type=forking PIDFile=/var/log/ices/ices.pid ExecStart=/usr/bin/ices2 /etc/icecast2/ices.xml ExecReload=/bin/kill -HUP $MAINPID Restart=Always [Install] WantedBy=multi-user.target
сохраняем файл Ctr+x и y в ответ хотите ли сохранить. Теперь надо, что бы наш сервис был добавлен.
systemctl daemon-reload
Я заранее нашёл песни, которые автор разрешил распространять. И разместил их в одной папке stationmp3 на компьютере, но вот беда ices не работает с mp3 (опять все из-за лицензий), рядом я сделал папку stationogg, куда сконвертировал всю музыку из mp3 в ogg (можно использовать онлайн конвертер или скачать программу на ПК)
Потом подключаемся к нашему серверу через FileZilla логин и пароль тот же что и по ssh, создаём там папку music в директории /mnt и копируем туда нашу музыку из папки stationogg, которая в формате ogg. Придётся подождать пока музыка копируется.
Tumblr media
Потом надо создать файл с плейлистом нашей музыки, подключаемся по ssh
find /mnt/music/ -iname "*.ogg" -print > /etc/icecast2/playlist.txt
можно посмотреть результат работы команды. Теперь в файле плейлиста все наши песни.
nano /etc/icecast2/playlist.txt
Значит все в порядке. Можем запустить ices
systemctl start ices
включим его автозагрузку
systemctl enable ices
В моём случае я могу послушать авто диджея по адресу
radio.my-gemorr.ru:8000/avtoDJ.ogg
а у вас должен быть свой домен, естественно.
В следующей части мы сделаем статичный сайт радиостанции и прилепим к нему плеер.
0 notes
mytrashdev · 6 months ago
Text
Интернет радиостанция 1
Для начала нам нужен сервер где мы все развернем. Я покупаю самый дешевый VDS на host-food KVM-Start за 149 рублей в месяц. И выбираю ОС Ubunthu так как чаще всего с ней работаю.
Tumblr media
Далее приходить письмо с паролем и IP адресом сервера. Там кстати сразу припаркуют домен 4 уровня. Но у меня есть свой геморроййный домен. и я припаркую ип адрес сервера к домену. Это будет A запись по типу
radio.my-gemorr.ru. 3600 A 91.227.18.92
Теперь я могу обращаться к серверу по доменному имени.
Подключаемся к серверу по SSH и понеслось
Запрос наличия обновлений
apt update
Обновление
apt upgrade
Установка сервера icecast
apt install icecast2
Там вылезет окно где в поле hostname я напишу свой домен
radio.my-gemorr.ru
Далее спросит пароль для релея, точек монтирования, и админке. Пароль можно сделать везде одинаковым.
Теперь не много по правим конфигурацию руками через текстовый редактор nano
nano /etc/icecast2/icecast.xml
Можно изменить локацию и почту
<location>Earth</location> <admin>icemaster@localhost</admin>
И еще что хотите поменять я допустим сразу добавил две точки монтирования одна для живого эфира вторая для автодиджея
<mount type="normal"> <mount-name>/avtoDJ.ogg</mount-name> <fallback-mount>/live.ogg</fallback-mount> <fallback-override>1</fallback-override> <fallback-when-full>1</fallback-when-full> <charset>utf-8</charset> </mount> <mount> <mount-name>/live.ogg</mount-name> <fallback-mount>/avtoDJ.ogg</fallback-mount> <fallback-override>1</fallback-override> <fallback-when-full>1</fallback-when-full> <charset>utf-8</charset> </mount>
Все будут слушать радио с адреса radio.my-gemorr.ru:8000/live.ogg если там будет тишина icecast автоматом подсунет fallback-mount /avtoDJ.ogg где будет работать авто диджей.
Наверное на этом все с установкой сервера. Можно его перезапустить
systemctl restart icecast2
И проверить что он работает по нашему адресу в моем случаи.
http://radio.my-gemorr.ru:8000/
Если вы видите что то в этом духе то все хорошо сервер установлен!
Tumblr media
1 note · View note
mytrashdev · 6 months ago
Text
Ну что же так как недавно написанная нами программа «Решатель V1» Решила что мы будем делать интернет радиостанцию. То я не могу противиться её решению. Начинаем.
Tumblr media
Изначально поясню что же такое интернет-радиостанция и как она работает.
По сути это определенная точка-монтирования (адрес) в интернете куда может подключиться плеер и от туда будут воспроизводиться то что вы захотите в режиме реального времени (потока)
Tumblr media
В нашем случаи мы сделаем сайт по типу (нашего радио и т.д.) где будет встроен плеер и человек при желании тыкает на кнопку плей и понеслось.
Для управления вещанием в прямом эфире мы сможем использовать любeю программу которая работает с Icecast серверами в нашем примере я попробую SAMBroadcaster и RadioBoss.
Tumblr media
Эти программы представляют из себя классические программы для управления радио эфиром есть несколько Дек(дорожек) с песнями между которыми можно переключаться. И кнопки Mic для переключения на микрофон что бы ведущий эфира мог говорить. Эти обе программы работают с сервером icecast2 который мы будем в будущем использовать.
Обычно человеку не очень хочется что бы его комп был включён 365 дней в году с запущеной программой, и если он выключался то эфир пропадал.
Для того что бы такого не было используют программы автодиджеи. Когда подключение от программы (SAMBroadcaster или RadioBoss) нет то есть прямой эфир не ведётся то они включают за ранее подготовленный плейлист композиции и играют его. Если такого нет то можно что бы они дублировали поток другой радиостанции пока вы снова не захотите вести эфир. Мне как то попадались довольно умные автодиджеи которые смотрели за результатами голосования на сайте и от этого меняли свою ротацию в плейлисте в угоду слушателям.
Tumblr media
Но так как наш проект не коммерческий и просто ради веселья то будет все по лайту будем использовать ices.
Обычно цель таких операций можно запустить региональную интернет радиостанцию с вещанием местных групп в плейлистах, где вы в качестве радиоведущего можете приглашать местных представителей и обсуждать насущные проблемы.
Дисклаймер.
Для вещания песен скорее всего вам нужно будет разрешение от их авторов. (Договориться, наверное, получиться только со своими местными группами)
Наверно если ты заявляешь какое-то своё мнение на группу людей тебе надо зарегистрироваться как СМИ или что то в этом духе.
И наверное ещё что то есть но так как я не юрист это то что пришло в голову.
Tumblr media
Ну все с идей все понятно начинаем запуск нашей интернет-радиостанции!
1 note · View note
mytrashdev · 6 months ago
Text
Решатель V1
Ура товарищи Решатель V1 готов, теперь я смогу не думать над решениями в своей жизни.
И так как писать графические пользовательские интерфейсы (кнопки, менюшки, окошки )  говорить не будем. Ибо каждый в тайне подростком занимался этим. И в этом нет ничего постыдного.
Tumblr media
По говорим о логике. Да и говорить нечего программа из трех методов. Работает по принципу «Шара желаний» Все три метода на картинке ниже.
Tumblr media
Вот видео уже с работай. Не замысловато но для начала «И так сойдёт».  Был бы у меня знакомый художник можно было бы сделать анимацию «Шара желаний» в каких-нибудь зелёных пуках. Нарисовать красивые кнопки. Анимацию тряски и т.д. И можно в google play выставлять. Ну а дано что дано.
И так мои первым испытанием решателя будет список задач из позапрошлого поста.
1 Развернём видеохостинг(типо YouTube) на базе  cumulusclips.
2 Интернет радио станция на Icecast 2
3 Конвертор YandexMusic
4 Шифратор текста разными алгоритмами шифрования
5 Графическая оболочка для кого-нибудь ИИ
Барабанная дробь!
Tumblr media
Ну что же «Решатель» принял решение №2
Начинаем пилить «Интернет радиостанцию».
0 notes
mytrashdev · 6 months ago
Text
И так. Решение я принять не могу так как проекты из прошлого поста мне все нравятся. А комментариев нет. То я принял решение писать программу "Решатель v1"
Tumblr media
Концепция такая. Есть три режима решения.
"Простое" - Это решение на вопрос в формате Да/Нет. Пример: Мне пойти сегодня гулять - Нет
"Сложное решение" - Предложит вам вариант решения в духе "Шара предсказаний". По типу "Сейчас не стоит" "Будущее туманно"
"Случайный выбор из числа" То есть вы вводите максимальное возможное число и программа выберет случайное в этом диапазоне.
Так как я художник от слово "Худо" Накидал примерный вид программы. И количество видов.
Tumblr media
0 notes
mytrashdev · 6 months ago
Text
Дамы и господа, к новому году хотелось бы найти новую задачу. И так есть несколько проектов которые я бы хотел попробовать реализовать
Tumblr media
1 Развернём видеохостинг(типо YouTube) на базе  cumulusclips.
2 Интернет радио станция на Icecast 2
3 Конвертор YandexMusic
4 Шифратор текста разными алгоритмами шифрования
5 Графическая оболочка для кого-нибудь ИИ
И так может есть мысли что из этого выбрать?
Что же выбрать?
0 notes
mytrashdev · 6 months ago
Text
Раз (девятый) итоговый
0 notes
mytrashdev · 6 months ago
Text
Раз (восьмой)
Вот и все дамы и господа. Наш процесс создание можно сказать завершён по крайней мере основной логики. Из списка вычеркнуты все части. Расскажу не много про тэги (инциденты).
Tumblr media
Это почти тоже самое что и категории. Но обычно у материала (поста может быть одна категория), а у поста может быть много тэгов и тэга может быть много постов. По этому это отношение многие ко многим.
И так пришлось создать сущность тэг. И в посте тоже пришлось добавить лист Тэгов что бы они знали друг о друге))
Tumblr media
А также на странице добавление материалов пришлось сделать текстовое поле где через запятую ввести теги. Потом поле ловиться как строка и преобразуется в теги если тег существует то пост просто добавляется в его список
Tumblr media
Теперь так как в базе данных есть теги. Надо их отображать. Дело известное пишем страницу и контроллер. Получаем что то в этом духе.
Tumblr media
Пришлось сделать страницу что бы при клике по тегу (инциденту) можно было увидеть записи в тэге. И тоже сделать что бы при клике на них можно было читать запись (пост)
Tumblr media
Таким образом примерно за 2 недели занимаясь по часу в день удалось. Сделать минимально работающий сайт хоть с какой то логикой. В теории даже в таком виде можно сделать сборку и запустить ее на сервере. Но есть не сколь но, это то что не работает или работает не так но об этом в заключительной статье цикла.
0 notes
mytrashdev · 6 months ago
Text
Раз (седьмой)
Перед последний шаг к завершению концепта сайта.  Что уже сделали.
Регистрация
Авторизация
Добавление новостей
Лента всех новостей
Просмотр конкретного поста
Удаление пользователей (Админские штучки)
Тэги
Tumblr media
Осталось одарить Админа властью удаление пользователей возможностью повелевать.
Для этого у нас в меню уже был пункт «доступ». Хочу сделать так что бы при нажатии на этот пункт выводились все пользователи с БД и при нажатии на имя пользователь удалялся. И так погнали.
Tumblr media
Нам нужна страница отображения списка пользователей назову ее deletUser.jsp Там все не заурядно. Выводим в таблице пользователей как они закончились то заполняем все пустотой. И да сразу из имен пользователей делаем ссылки на удаление.
Tumblr media
Потом как всегда контроллеры он будет состоять всего из двух методов. Это отображение страницы по запросу get. А второй для обработки POST ответа и выпиливание пользователя из БД. И уведомление о том что все прошло норм.
Tumblr media
Вот и все функционал власти готов. Нам еще нужно сделать ТЕГИ для постов. Я предчувствую боль и храбрюсь перед этим мероприятием. Хотя уже можно выпускать сайт как личный блог или еще что то в этом духе функционально он работает. Уродлив правда.  
0 notes
mytrashdev · 7 months ago
Text
Раз (шестой)
Хе безумная затея написать просто сервис блогов уже подходит к концу. Уже осталось для пользователей только до делать форму обратной связи. И какой ни-будь нормальный редактор HTML. Начнем с последнего.
Что значит нормальный WYSIWYG!?
Tumblr media
Короче геморрой заключается в том что в обычную textarea можно либо запихать просто текст или сразу писать в коде HTML что не каждый умеет. Да и выглядит форма уныло.
Tumblr media
В тумблере вот есть не плохой редактор. Можно и фоточки прикрепит и видео и т.д. Собственно этот редактор и зовётся словом WYSIWYG. Этих редакторов в интернетах более чем много. Принцип их такой это редактор который написан на js. Сам код лежит на их серваке ты подключаешь его страницы и счастье. Единственное мне бы хотелось что бы редактор возвращал плоды своей работы в HTML.
Tumblr media
Так как большая часть возвращает все дело в JSON  но парсить JSON в HTML нет не кого желание тем более нашелся WYSIWYG редактор с editor.getHTML(). И это дела можно сразу пихать в БД и из нее показывать. Встречайте TOAST UI Editor и темная тема у него есть.
Tumblr media
Правда при сохранении картинок он пытался вставить не вставляемое. То есть кодировал картинку в base64 и пытался пихать все это в базу данных в поле text. А вы представляете, что значит 20 мегабайт текста. База отвергала это насилие и все ломалось.
Tumblr media
Кстати с мелкими картинками это работало. Наверно таким путем можно вставлять изображение туда куда его вставлять запрещено. Но это уже пиратская тема не будем ее развивать.
Tumblr media
Короче пришлось писать контроллер для картинок, учить его сохранять в папку и отдавать урл обратно. Работы не так много как текста. По итогу все заработало картинки вставляются как и размеры текста и прочие прелести.
Tumblr media
Осталось дописать форму обратной связи. Сделаем его мерзким просто через textarea если что перепилим потом. Ведь главное смочь отправить весть от нашего франкинштейна на почту.
Tumblr media
Так просто не вышло ничего отправлять пришлось добавить зависимостей от spring-boot-starter-mail и прописать в настройках почту порт и пароль. И то опять не чего не заработало так пришлось написать очередной контроллер. И после этого все за работало. Письмо ушло и пришло.
0 notes
mytrashdev · 7 months ago
Text
Раз (пятый)
На стало время пришить к нашему франкинштейну ещё пару кусков. Самых интересных на мой взгляд.
Tumblr media
Кажется для любого сайта главное контент. Вот и нам пара сделать страницу где покажем наш материал. А главное страницу где его напишем.
Показывать будем даже больше сделаем страницу по типу ленты новостей где будем видеть все существующие в базе данных статьи. News.jsp
Tumblr media
И сделаем страницу где можно почитать конкретный материал. Showpost.jsp
Tumblr media
Ну и где добавляем материал addpost.jsp пока тупо через input textarea. Понятно что картинки там не вставить. Но для временной реализации логики нам хватит.
Обратите внимание как все по уродскому получилось. Это из за табличной верстки которую мне сделал ИИ . И тот что мой друг фронтэндер не хочет верстать бесплатно:) но мир не без добрых людей. Закину заявку на фриланс что бы переверстали страницу с grid flex и прочими штучками.
Tumblr media
Как выяснилось без добрых. Мой бюджет на вёрстку страницы был 500 рублей так как моя ЗП 22 000. Но на фрилансе хотят 5000 за страницу. Что равносильно недели моей работы. Так что добавлю скролла и продолжаем в уродской верстке делать ;)
Tumblr media
Сделаем чек лист того что умеет сайт на этом этапе.
1. Регситрация пользователей.
2. Авторизация пользователей.
3. Показ все статей из базы данных.
4. Показ конкретной статьи.
5. Добавление статьи (простая форма)
Думаю надо до делать добавление статей. На всех нормальных сайтах есть редактор текста. Где можно выбрать размер текста и вставить картинку и т.д.
Еще сделать обратную связь, что бы пользователи могли пользователи моги писать администрации, что пора завязывать с наркотиками и делать такие странные сайты:)
0 notes
mytrashdev · 7 months ago
Text
Раз (четвертый)
Пора заставить нашего франкинштейна воплотиться и работать. Что бы кричать всему миру что он жив. Хотя бы частично.
Tumblr media
И так я написал все сущности в виде java классов. Сделал интерфейсы репозиториев и классы сервисов. Это вся фигня занимает не так много места и нужна для того что бы при старте уже создались наши сущности и мы могли их вытаскивать и пользоваться.
Пишу не большую страницу registration.jsp где в мою форму я из модели получаю нового пользователя и его заполняю и методом post отправляю на точку /registration проверяю что все норм заполнена и пользователя в базе данных с таки именем нет, и регаем его в базе данных. Чудо какое то кода мало а пользователи уже сохраняются в базу даже с какой то валидацией.
Tumblr media
Теперь бы надо что бы пользователи входили на сайт для этого пишем страницу входа. Ну и контроллер входа. О чудо ходят легенды что страница login обрабатывается Spring Security контроллером по умолчанию, поэтому для неё отдельный контроллер не требуется. Кода стало еще меньше и вход на сайт уже работает.
Tumblr media
Дело за малым нам нужна основная страница со всеми постами, страница отображения самого поста, и добавления поста. Ну с такими темпами можно будет скоро и закончить. Хотя что то мне подсказывает что геморрой только начнется.
0 notes
mytrashdev · 7 months ago
Text
Раз (третий)
Что же такое сущности и для чего они нужны для разработки сайта, а в частности для базы данных. Все дело в лог��ческой связи и работе каскада. Представьте что вам надо сделать велосипед. Тот тут не плохо было бы иметь чертеж структуру. Или еще проще когда вы идете в туалет то у вас уже существует обязательные требования к этому месту. Наличие туалетной бумаги, отверстия для опорожнения, и воды. Так и тут.
Tumblr media
Когда я пытался собрать набор необходимых сущностей для сайта не чего не получалось. То хвост у вязнет то голова. Видимо у разработчиков баз тоже бывают такие проблемы. Да и объяснять проще на картинках по этому в программе для работы с Mysql уже встроили программу для визуального отображения таблиц и их связей.
Tumblr media
Скажу сразу что не которые таблицы меня заставил сделать фреймворк Spring видимо они ему зачем то нужны. И мой ход мысли примерно такой, у каждого материала есть автор. У автора есть имя. У него еще есть пароль дата регистрации и т.д. Следующая сущность это материал (пост). Думаю что там может быть. Автор, дата, текст, комментарии, теги.
Tumblr media
Потом надо подумать об отношениях кто и в каких количествах может быть. Приведу пример из жизни. У одного отца могут быть дети, более того может быть много детей, но у каждого ребенка лишь один отец. Это отношения один ко многим. К стати тут хорошо показать работу каскада. Суть его в том что одни сущности без других существовать не будут. То есть если автор написал 10 постов мы можем удалить пост и это не как не влияет на автора. Но если удалим автора, посты без автора существовать не могут и каскад удалит все посты автора. Так что если один ребенок отца исчезнет, то каскаду не будет до этого делать. Но если исчезнет отец, каскад убьет всех детей. Такой вот кровавый каскад и сила отношений.
Tumblr media
Так структура у нас почти готова. Осталось все как то заполнить. Раньше мне бы пришлось призвать духов мне на помощь и бить в бубен много дней. Так как пришлось написать классы сущностей, потом классы для работы с сущностями что бы запихивать их в базу данных и их туда доставать. Щас все очень славно написал класс пометил как сущность и собственно все, даже SQL учить не надо.
Tumblr media
Еще спринг заставил меня создать таблицу ROLE ему это нужно для регистрации и "входа" на сайт. Условно может быть роль ADMIN и USER один может только писать, а второй еще и удалять пользователей. Естественно их можно сделать больше, сделать секретные страницы и разделы и т.д.
Теперь с внутренностями и требухой покончено, следующем этапом нарисуем страницу регистрации и входа. Что бы пользователи сохранялись в базе данных, и по думаем сколько и каких страниц нам надо сделать.
2 notes · View notes