<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Электронный научно-практический журнал «Современные научные исследования и инновации» &#187; HTML</title>
	<atom:link href="http://web.snauka.ru/issues/tag/html/feed" rel="self" type="application/rss+xml" />
	<link>https://web.snauka.ru</link>
	<description></description>
	<lastBuildDate>Fri, 17 Apr 2026 07:29:22 +0000</lastBuildDate>
	<language>ru</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>Использования информационных технологий для создания учебных пособий</title>
		<link>https://web.snauka.ru/issues/2014/06/35944</link>
		<comments>https://web.snauka.ru/issues/2014/06/35944#comments</comments>
		<pubDate>Mon, 23 Jun 2014 10:35:04 +0000</pubDate>
		<dc:creator>vikaaa111</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[electronic atlas syndrome dyabetycheskoy stopы]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[RPZ sugar dyabet]]></category>
		<category><![CDATA[сахарный диабет]]></category>
		<category><![CDATA[синдром диабетической стопи]]></category>
		<category><![CDATA[электронный атлас]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/?p=35944</guid>
		<description><![CDATA[Быстрые темпы роста количества больных на сахарный диабет с синдромом диабетической стопы, требующая от нас значительных усилий для устранения этой проблемы. Недостаточное количество квалифицированных кадров способствует увеличении количества ампутаций среди населения. «Электронный атлас синдрома диабетичиской стопи» выполнен в рамках разработке программного обеспечения для обучения  на кафедре Хирургии № 2, Медицинского факультета № 1, НМУ имени [...]]]></description>
			<content:encoded><![CDATA[<p>Быстрые темпы роста количества больных на сахарный диабет с синдромом диабетической стопы, требующая от нас значительных усилий для устранения этой проблемы. Недостаточное количество квалифицированных кадров способствует увеличении количества ампутаций среди населения. «Электронный атлас синдрома диабетичиской стопи» выполнен в рамках разработке программного обеспечения для обучения  на кафедре Хирургии № 2, Медицинского факультета № 1, НМУ имени А.А. Богомольца.</p>
<p><em>Целью исследования</em> является обоснование важности создания «Электронного атласа диабетической стопы». Описание его как программное обеспечение, которое обеспечит качественную подготовку специалистов в этой отрасли. Объектом исследования является здоровье человека, предмет &#8211; современные электронные пособия и атласы.</p>
<p><em>Практическое значение полученных результатов</em>. Результатом работы является готова информационная система, которая позволяет улучшить уровень прогрессивного научно-методологического обеспечения будущих специалистов.</p>
<p><em>Новизна внедряемого программного обеспечения</em>. Разработанное программное обеспечение является единственным в данной области. Провести анализ материала данной темы, можно сделать вывод, что отсутствие аналогов обеспечит использование этого программного продукта в учебном процессе.</p>
<p>По данным углубленных эпидемиологических обследований до 2.4% населения Украины болеют сахарным диабетом. 90-95% всех больных сахарным диабетом составляют пациенты 2 типа заболевания. В 90% из них возникают язвенно-некротические проявления синдрома диабетической стопы. У 80% больных с синдромом диабетической стопы обнаруживают невропатической форму. Хирургическое лечение больных с синдромом диабетической стопы невропатической и ишемической форм требуют различной тактики и объема хирургического лечения. Однако летальных случаев можно избежать имея достаточно квалифицированную команду специалистов[1].</p>
<p>«Электронный атлас синдрома диабетической стопы», представляет собой интерактивную электронную книгу. Поэтому для ее создания был избран язык вебпрограмирования &#8211; HTML. Программирование проводилось с помощью NVU-редактора, компиляция осуществлялась в eBook Maestro Free.</p>
<p>В начале работы была создана папка с названием «электронный атлас синдрома диабетической стопы», что и будет служить директорией книги, и включать в себя все файлы работы. Папка содержит 25 файлов, среди которых 24 файлы страниц атласа, один файл «style.css», и подпапку images в которой находятся все изображения и видео, используемые в ходе работы.</p>
<p>Подпапка images содержит изображения к работе и 10 папок, в которых находятся фотографии лечения больных синдромом диабетической стопы.</p>
<p>В файле «style.css» использовано язык CSS, для описания шрифта, шифта цвета, выравнивание текста.</p>
<p>Атлас содержит навигацию (рис 1), поиск по тексту (рис. 2), выход из программы, открытие левой панели (рис. 2). Также предусмотрена функция печати. Режим копирования и работа с программами использующих Prt Sc, заблокированы компилятором. Но имеет возможность печати книги.</p>
<p style="text-align: center;"><img class="size-full wp-image-35956 aligncenter" src="https://web.snauka.ru/wp-content/uploads/2014/06/12.png" alt="" width="436" height="43" /></p>
<p align="center">Рисунок 1-Навигация</p>
<p style="text-align: center;" align="center"><img class="aligncenter size-full wp-image-35957" src="https://web.snauka.ru/wp-content/uploads/2014/06/21.png" alt="" width="436" height="263" /></p>
<p align="center">Рисунок 2- Открытие левой панели поиск по тексту</p>
<p>Защита информации от нелицензионного просмотра не предусмотрен, ведь программа явлю собой учебный материал. Однако повреждения данных программы невозможно, по желанию заказчика ето можно изменить, данные можно будет удалять и добавлять в книгу.</p>
<p>Программа открывается после нажатия мышкой по ярлыку, открытие первой страницы (рис. 3).</p>
<p style="text-align: center;"><img class="aligncenter size-full wp-image-35958" src="https://web.snauka.ru/wp-content/uploads/2014/06/3.png" alt="" width="271" height="259" /></p>
<p align="center">Рисунок 3- Главная страница</p>
<p>Атлас имеет 4 раздела:</p>
<ol>
<li>Сахарный диабет(описания роботы поджелудочной железы, этиология и патогенез сахарного диабета);</li>
<li>Статистические показатели сахарного диабета (показатели заболеваемости в мире и в Украине);</li>
<li>Синдром диабетической стопы(описание СДС, классификация диагностика, методы лечения);</li>
<li>Галерея изображений (примеры реальных случаев лечения ).</li>
</ol>
<p>Раздел атласа, галерея изображений, открывает просмотр фотографий ран больных (рис. 4). Содержит 9 подпунктов, где каждый случай рассмотрен отдельно. Именно этот раздел содержит первостепенную важность для обучения студентов-медиков, ведь лектор может не только рассказать о примерах лечения больных СДС, но и наглядно их показать.</p>
<p style="text-align: center;" align="center"><img class="aligncenter size-full wp-image-35960" src="https://web.snauka.ru/wp-content/uploads/2014/06/52.png" alt="" width="326" height="263" /></p>
<p align="center">Рисунок 4 –Оформление галереи изображений</p>
<p style="text-align: left;" align="center">Вывод: безусловно можно сказать что на сегодняшний день, создания электронных пособий и атласов является актуальным вопросом развития информационных технологий. Их  использования обусловлена потребностью преподавателей в учебниках нового века, которые можно использовать удаленно студентами  для обучения онлайн, или для повышения квалификации специалистов.</p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2014/06/35944/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Анализ средств разработки web-страниц</title>
		<link>https://web.snauka.ru/issues/2017/08/84242</link>
		<comments>https://web.snauka.ru/issues/2017/08/84242#comments</comments>
		<pubDate>Fri, 25 Aug 2017 11:52:22 +0000</pubDate>
		<dc:creator>Кувайцев Александр Вячеславович</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[web-сайт]]></category>
		<category><![CDATA[база данных]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/?p=84242</guid>
		<description><![CDATA[Извините, данная статья доступна только на языке: English.]]></description>
			<content:encoded><![CDATA[<p>Извините, данная статья доступна только на языке: <a href="https://web.snauka.ru/en/issues/tag/html/feed">English</a>.</p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2017/08/84242/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Разработка браузерной игры «Поиск предметов» для проверки знаний по английскому языку с помощью JavaScript</title>
		<link>https://web.snauka.ru/issues/2023/08/100665</link>
		<comments>https://web.snauka.ru/issues/2023/08/100665#comments</comments>
		<pubDate>Mon, 21 Aug 2023 10:27:58 +0000</pubDate>
		<dc:creator>alexan0308</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[веб-приложение]]></category>
		<category><![CDATA[дополнительное образование детей]]></category>
		<category><![CDATA[поиск предметов]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/issues/2023/08/100665</guid>
		<description><![CDATA[Изучение иностранного языка – достаточно трудоемкое занятие, тем более для ребенка. Заинтересовать его можно, облачив обучение в игровую форму. Интерактивные игры несут в себе образовательный потенциал, создают условия для проявления учащимися учебной инициативы [1]. Предлагаемая статья описывает процесс создания увлекательной игры на поиск предметов с помощью HTML, JavaScript и css. Суть игры следующая: создается игровая [...]]]></description>
			<content:encoded><![CDATA[<p style="text-align: justify;"><span>Изучение иностранного языка – достаточно трудоемкое занятие, тем более для ребенка. Заинтересовать его можно, облачив обучение в игровую форму. Интерактивные игры несут в себе образовательный потенциал, создают условия для проявления учащимися учебной инициативы [1]. Предлагаемая статья описывает процесс создания увлекательной игры на поиск предметов с помощью <span style="color: black;">HTML, JavaScript и css</span>. Суть игры следующая:<br />
</span></p>
<ul>
<li>
<div style="text-align: justify;"><span>создается игровая сцена, где находятся различные предметы, и игрок должен найти предметы, названия которых соответствуют определенным словам из изучаемого иностранного языка;<br />
</span></div>
</li>
<li>
<div style="text-align: justify;"><span>учащийся видит название какого-то объекта (насекомого) на английском языке, например, «locust»;<br />
</span></div>
</li>
<li>
<div style="text-align: justify;"><span>игрок должен найти этот объект (саранча) и кликнуть по нему;<br />
</span></div>
</li>
<li>
<div style="text-align: justify;"><span>если игрок нажал на нужный предмет, объект считается найденным и исчезает с экрана;</span></div>
</li>
<li>
<div style="text-align: justify;">на экране появляется название следующего объекта, и т.д.</div>
</li>
</ul>
<p style="text-align: justify;">Такая игра, несомненно, поможет учащемуся проверить и закрепить свои знания английских слов, и будет интереснее, чем простое заучивание иностранных слов.</p>
<p style="text-align: justify;">Игра «Поиск предметов» может быть полезной в обучении и образовательных целях по нескольким причинам:</p>
<ul>
<li>
<div style="text-align: justify;"><span>мотивация и интерес: игровой формат проверки знаний по иностранному языку может стимулировать мотивацию учащихся и вызывать больший интерес к изучению языка. Участие в игре и достижение целей внутри игрового контекста может быть более привлекательным и захватывающим, чем традиционные методы обучения;<br />
</span></div>
</li>
<li>
<div style="text-align: justify;"><span>повторение и закрепление: игра предоставляет возможность повторить и закрепить изученный языковой материал. Поиск предметов, связанных с определенными темами или грамматическими конструкциями, позволяет учащимся активно применять свои знания и запоминать их более эффективно;<br />
</span></div>
</li>
<li>
<div style="text-align: justify;"><span>самостоятельное обучение: игровое приложение может быть использовано в качестве инструмента самостоятельного обучения. Учащиеся могут использовать его для повторения и тренировки в любое удобное для них время, что способствует развитию самоорганизации и самостоятельности;<br />
</span></div>
</li>
<li>
<div style="text-align: justify;"><span>вариативность и адаптивность: игровое приложение может быть настроено на различные уровни сложности и тематики, позволяя адаптировать его под индивидуальные потребности и уровень владения языком каждого учащегося. Это обеспечивает гибкость и возможность персонализации образовательного процесса;<br />
</span></div>
</li>
<li>
<div style="text-align: justify;"><span>расширение словарного запаса: в игре могут использоваться различные предметы, объекты или символы, которые игрок должен найти. Это помогает расширять словарный запас и знакомить с новыми терминами и понятиями;</span></div>
</li>
<li>
<div style="text-align: justify;">обучение конкретным темам: игра «Поиск предметов» может быть адаптирована для обучения конкретным темам или предметам. Например, она может быть использована для изучения географии (поиск географических объектов), биологии (поиск животных или растений) или истории (поиск исторических артефактов).</div>
</li>
</ul>
<p style="text-align: justify;">Игра «Поиск предметов» может быть эффективным дополнением к учебному процессу, способствуя развитию различных навыков и знаний у учащихся.</p>
<p style="text-align: justify;">Предметы на экране будем создавать в дизайнере в виде изображений спрайта, с помощью использования холста (рисунок 1).</p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2023/08/082123_1025_1.png" alt="" /></p>
<p style="text-align: center;"><em>Рисунок 1. Рабочее поле игры<br />
</em></p>
<p style="text-align: justify;">Подготовим изображения (рисунок 2). Рисунки лучше подготовить в формате .png, в котором поддерживается прозрачный фон.</p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2023/08/082123_1025_2.png" alt="" /></p>
<p style="text-align: center;"><em>Рисунок 2. Спрайты для игры<br />
</em></p>
<p style="text-align: justify;">Объявим массив предметов:</p>
<p style="text-align: justify; margin-left: 28pt;">const MASSIV = [</p>
<p style="text-align: justify; margin-left: 28pt;">    "dragonfly",</p>
<p style="text-align: justify; margin-left: 28pt;">    "grasshopper",</p>
<p style="text-align: justify; margin-left: 28pt;">    "locust",</p>
<p style="text-align: justify; margin-left: 28pt;">    "bee",</p>
<p style="text-align: justify; margin-left: 28pt;">    "ladybug",</p>
<p style="text-align: justify; margin-left: 28pt;">    "mosquito",</p>
<p style="text-align: justify; margin-left: 28pt;">    "snail",</p>
<p style="text-align: justify; margin-left: 28pt;">    "muse",</p>
<p style="text-align: justify; margin-left: 28pt;">    "ant",</p>
<p style="text-align: justify; margin-left: 28pt;">    "spider",</p>
<p style="text-align: justify; margin-left: 28pt;">    "bug",</p>
<p style="text-align: justify; margin-left: 28pt;">    "butterfly",</p>
<p style="text-align: justify; margin-left: 28pt;">    "small_butterfly",</p>
<p style="text-align: justify; margin-left: 28pt;">    "cockroach",</p>
<p style="text-align: justify; margin-left: 28pt;">    "caterpillar"</p>
<p style="text-align: justify; margin-left: 28pt;">];</p>
<p style="text-align: justify;">Этот массив мы позже программно перемешаем, чтобы при каждом новом старте игры предметы появлялись в случайном порядке.</p>
<p style="text-align: justify;">С помощь позиционирования разместим картинки на игровом поле (рисунок 1). Для этого укажем координаты спрайтов, например, для яблока:</p>
<p style="text-align: justify; margin-left: 35pt;">#grasshopper {</p>
<p style="text-align: justify; margin-left: 35pt;">position: absolute;</p>
<p style="text-align: justify; margin-left: 35pt;">top: 0; left: 0;</p>
<p style="text-align: justify; margin-left: 35pt;">margin: 530px 0 0 200px;</p>
<p style="text-align: justify; margin-left: 35pt;">}</p>
<p style="text-align: justify;">Координаты игрового поля, наоборот, укажем относительное позиционирование:</p>
<p style="text-align: justify; margin-left: 35pt;">.sunsistem {</p>
<p style="text-align: justify; margin-left: 35pt;">position: relative;</p>
<p style="text-align: justify; margin-left: 35pt;">top: 0; left: 0;</p>
<p style="text-align: justify; margin-left: 35pt;">}</p>
<p style="text-align: justify;">Алгоритм игрового скрипта будет следующим [2]:</p>
<ol>
<li>
<div style="text-align: justify;"><span>Создаем список предметов, которые игрок должен найти (в данном примере это список насекомых на английском языке).<br />
</span></div>
</li>
<li>
<div style="text-align: justify;"><span>Перемешиваем список случайным образом.<br />
</span></div>
</li>
<li>
<div style="text-align: justify;"><span>Инициализируем переменную «индекс», которая отвечает за номер предмета в списке. Вначале он равен 0.<br />
</span></div>
</li>
<li>
<div style="text-align: justify;"><span><span>С помощью конструкции </span><span>addEventListener</span><span> на нужную картинку, которая ищется первой, «вешаем» событие клика [3]. При клике на картинку она плавно исчезает (видимость равно ЛОЖЬ).<br />
</span></span></div>
</li>
<li>
<div style="text-align: justify;"><span>Увеличиваем значение переменной-счетчика «индекс» на единицу и выводим на экран название следующего объекта.<br />
</span></div>
</li>
<li>
<div style="text-align: justify;"><span>Назначаем то же самое событие на следующий объект, и т.д.</span></div>
</li>
<li>
<div style="text-align: justify;">Когда значение счетчика «индекс» достигает размера списка, это означает, что все заданные предметы были успешно найдены, и мы можем вывести на экран сообщение о завершении игры.</div>
</li>
</ol>
<p style="text-align: justify;">После завершения игры выводится на экран соответствующее уведомление (рисунок 3):</p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2023/08/082123_1025_3.png" alt="" /></p>
<p style="text-align: center;"><em>Рисунок 3. Окончание игры<br />
</em></p>
<p style="text-align: justify;">Вы можете поиграть или ознакомиться с исходным кодом игры на платформе GitHub. GitHub &#8211; это веб-платформа, предназначенная для хранения кода и других программных проектов, совместной работы над ними и их обмена между разработчиками. Это отличное место для публикации интернет-проектов. Посмотреть код и проверить свои знания английского языка по теме «Насекомые» можно по адресу <a href="https://dmitrij-pavlov.github.io/project3/">https://dmitrij-pavlov.github.io/project3/</a>. Для использования приложения достаточно любого современного браузера.</p>
<p style="text-align: justify;">Итак, игра «Поиск предметов» может быть полезной в обучении и в образовательных целях, поскольку она мотивирует, активизирует участие, повторяет и закрепляет материал, поддерживает самостоятельное обучение и обладает вариативностью и адаптивностью в контексте изучения иностранного языка.</p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2023/08/100665/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Разработка городской базы данных собственников жилья на ЯП Ruby</title>
		<link>https://web.snauka.ru/issues/2023/11/101016</link>
		<comments>https://web.snauka.ru/issues/2023/11/101016#comments</comments>
		<pubDate>Mon, 20 Nov 2023 07:22:37 +0000</pubDate>
		<dc:creator>Давлетшин Алмаз Раисович</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[Ruby]]></category>
		<category><![CDATA[Ruby on Rails]]></category>
		<category><![CDATA[веб-приложение]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/issues/2023/11/101016</guid>
		<description><![CDATA[Научный руководитель: Вильданов Алмаз Нафкатович к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал Для разработки городской базы данных собственников жилья на языке Ruby с использованием MySQL необходимо выполнить следующие этапы: Определение структуры базы данных: необходимо определить таблицы для хранения информации о собственниках жилья, адресах недвижимости и других соответствующих данных, а также разработать связи между ними для обеспечения [...]]]></description>
			<content:encoded><![CDATA[<p style="background: white; text-align: center;">Научный руководитель: <em>Вильданов Алмаз Нафкатович<br />
</em><em>к.ф.-м.н., </em><em>Уфимский университет науки и технологий, Нефтекамский филиал</em></p>
<p style="background: white; text-align: left;">Для разработки городской базы данных собственников жилья на языке Ruby с использованием MySQL необходимо выполнить следующие этапы:</p>
<ul>
<li><span>Определение структуры базы данных: необходимо определить таблицы для хранения информации о собственниках жилья, адресах недвижимости и других соответствующих данных, а также разработать связи между ними для обеспечения целостности данных.<br />
</span></li>
<li><span>Установка и настройка MySQL: необходимо установить MySQL на сервер или локальную машину, создать базу данных и учетные записи пользователей с соответствующими правами доступа.<br />
</span></li>
<li><span>Установка Ruby и необходимых библиотек: следует установить Ruby и гем MySQL2 для взаимодействия с базой данных MySQL из приложения Ruby.<br />
</span></li>
<li><span>Создание моделей: используя фреймворк Ruby on Rails или другие инструменты, необходимо создать модели данных для собственников жилья, адресов и других соответствующих сущностей, а также определить ассоциации между ними.<br />
</span></li>
<li><span>Создание миграций: написать миграции для создания таблиц и определения структуры базы данных в соответствии с определенными моделями, а затем применить их для внесения изменений в базу данных.<br />
</span></li>
<li><span>Разработка бизнес-логики: написать код для обработки операций CRUD (создание, чтение, обновление, удаление) с данными о собственниках жилья, а также реализовать логику для валидации данных и выполнения сложных запросов к базе данных.<br />
</span></li>
<li><span>Создание веб-интерфейса: с использованием Ruby on Rails или других фреймворков, создать веб-интерфейс для взаимодействия с базой данных, включая страницы для просмотра, добавления и редактирования информации о собственниках жилья.<br />
</span></li>
<li><span>Тестирование и оптимизация: написать тесты для приложения, оптимизировать запросы к базе данных и структуру таблиц для обеспечения высокой производительности.<br />
</span></li>
<li><span>Развертывание и поддержка: развернуть приложение на сервере и обеспечить его надежную работу, а также поддерживать базу данных и приложение, обновляя их при необходимости.<br />
</span></li>
</ul>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2023/11/111923_0517_1.png" alt="" /></p>
<p style="text-align: center;"><span><em>Рисунок 1. Создание таблицы homeowners<br />
</em></span></p>
<p style="text-align: justify;"><span>Создание запроса Select для вывода всех записей из главной таблицы:<br />
</span></p>
<p style="text-align: justify;"><img src="https://web.snauka.ru/wp-content/uploads/2023/11/111923_0517_2.png" alt="" /></p>
<p style="text-align: justify;">Алгоритм работы городской базы данных собственников жилья на языке Ruby с использованием MySQL может быть описан следующим образом:</p>
<ul>
<li>
<div><span>Запросы и вставка данных:<br />
</span></div>
<p><span>Пользователь или приложение формирует запросы к базе данных для получения информации о собственниках жилья, адресах недвижимости и других соответствующих данных.<br />
</span></p>
<p><span>При необходимости происходит вставка новых данных о собственниках или обновление существующих записей.<br />
</span></li>
<li><span>Обработка запросов:</span></li>
<li>Сервер базы данных (например, MySQL) принимает запросы от приложения, выполняет их и возвращает результаты в виде набора данных.</li>
</ul>
<ul>
<li>
<div><span>Использование бизнес-логики:<br />
</span></div>
<p><span>Полученные данные обрабатываются с помощью бизнес-логики приложения на языке Ruby.<br />
</span></p>
<p><span>Могут выполняться различные операции, такие как фильтрация, сортировка, агрегация и другие манипуляции с данными.<br />
</span></li>
<li>
<div><span>Отображение результатов:<br />
</span></div>
<p><span>Результаты обработки данных отображаются пользователю через веб-интерфейс или другой механизм взаимодействия с приложением.<br />
</span></li>
<li>
<div><span>Система безопасности:<br />
</span></div>
<p><span>База данных обеспечивает безопасность данных с помощью механизмов аутентификации, авторизации и шифрования, чтобы гарантировать конфиденциальность и целостность информации.<br />
</span></li>
<li>
<div><span>Резервное копирование и обслуживание:<br />
</span></div>
<p><span>Регулярно выполняется резервное копирование базы данных для предотвращения потери данных.<br />
</span></p>
<p><span>Проводится обслуживание базы данных для оптимизации производительности и обеспечения ее надежной работы.</span></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2023/11/101016/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Разработка базы данных «Учебная база данных» для организации, оказывающей образовательные услуги</title>
		<link>https://web.snauka.ru/issues/2023/11/100997</link>
		<comments>https://web.snauka.ru/issues/2023/11/100997#comments</comments>
		<pubDate>Mon, 20 Nov 2023 13:32:00 +0000</pubDate>
		<dc:creator>Антипина Виктория Александровна</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[база данных MySQL]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/issues/2023/11/100997</guid>
		<description><![CDATA[Научный руководитель: Вильданов Алмаз Нафкатович к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал Разработка базы данных «Учебная база данных» для организации, оказывающей образовательные услуги, имеет большую актуальность по нескольким причинам: 1. Улучшение управления информацией: База данных позволяет организации эффективно хранить, управлять и обрабатывать огромное количество данных, таких как информация об учениках, учителях, расписаниях и оценках. Это облегчает [...]]]></description>
			<content:encoded><![CDATA[<p style="text-align: center;" align="right"><em>Научный руководитель: Вильданов Алмаз Нафкатович<br />
</em><em>к.ф.-м.н., </em><em>Уфимский университет науки и технологий, Нефтекамский филиал</em></p>
<p>Разработка базы данных «Учебная база данных» для организации, оказывающей образовательные услуги, имеет большую актуальность по нескольким причинам:</p>
<p>1. Улучшение управления информацией: База данных позволяет организации эффективно хранить, управлять и обрабатывать огромное количество данных, таких как информация об учениках, учителях, расписаниях и оценках. Это облегчает процессы администрирования и делает информацию доступной и легко управляемой.</p>
<p>2. Улучшение доступности информации: База данных позволяет быстро и легко находить нужную информацию о учениках, их успеваемости, академической истории и других аспектах образовательного процесса. Это помогает в принятии информированных решений и повышает эффективность и качество образования.</p>
<p>3. Автоматизация процессов: Разработка учебной базы данных позволяет автоматизировать рутинные процессы, такие как регистрация учеников, формирование расписания и генерация отчетов. Это сокращает количество ошибок, экономит время и ресурсы организации.</p>
<p>4. Улучшение аналитики и прогнозирования: С помощью базы данных можно анализировать различные аспекты образовательного процесса, проводить статистический анализ, выявлять тенденции и прогнозировать результаты. Это помогает в принятии информированных решений, планировании и повышении эффективности обучения.</p>
<p>Все эти факторы делают разработку базы данных «Учебная база данных» актуальной и полезной для организаций, оказывающих образовательные услуги.</p>
<p>Предлагаемая статья описывает процесс создания базы данных с использованием HTML, .php и базы данных MySQL. База данных (БД) представляет собой структурированный набор данных. Обычно данные в БД записываются в виде таблицы, состоящей из строк и столбцов. Каждая строка представляет собой новый элемент с определенными свойствами &#8211; столбцами. Данные в БД могут быть отсортированы по различным параметрам, например, по предмету или дню. Также возможно создание формы для поиска данных по предмету, добавление и изменение данных, создание отчетов.</p>
<p>Разработка базы данных может быть эффективным дополнением к учебному процессу и способствовать развитию различных навыков и знаний учащихся. Например:</p>
<p>- Участие в решении практических задач технического, эксплуатационного или проектного характера.</p>
<p>- Знакомство со специализированным оборудованием и программным обеспечением, изучение их технологических процессов.</p>
<p>- Анализ документооборота с использованием систем управления базами данных.</p>
<p>- Поддержание работоспособности существующих баз данных (добавление новых данных, редактирование существующих данных, удаление устаревшей информации, резервное копирование баз данных и т. д.).</p>
<p>- Создание новых таблиц данных в учебной базе данных.</p>
<p>- Создание новых форм ввода данных в базе данных.</p>
<p>- Создание новых форм поиска информации в базе данных (по необходимости).</p>
<p>- Разработка новых отчетов в базе данных.</p>
<p>Создадим базу данных и перейдем на портал hostland.ru. Для удобства нам понадобится отдельный файл подключения к серверу, который будем использовать в других .php-файлах. Это поможет избежать дублирования кода. Давайте создадим файл под названием &#8220;data.php&#8221; в директории подключения и напишем необходимый код (рисунок 1).</p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2023/11/111623_1832_1.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рисунок 1. Объект data.php</span></p>
<p>Для создания новых полей в нашей будущей базе данных, нам нужно определить структуру основной таблицы, где будут храниться предоставляемые предметы. Структура достаточно проста. Мы можем определить новые поля следующим образом: or_id, or_name, or_klass, or_pred, pred_name, pred_id, pred_cabinet и teacher. Именно эти поля будут удобны при создании базы данных для объектов, связанных с предметами (Рисунок 2).</p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2023/11/111623_1832_2.png" alt="" /><span style="color: black;"><br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2023/11/111623_1832_3.png" alt="" /><span style="color: black;"><br />
</span></p>
<p style="text-align: center;"><span style="color: black;">Рисунок 2. Структура таблицы<br />
</span></p>
<p>Создадим новые таблицы в базе данных. Для работы с базой данных необходимо разработать удобный интерфейс. Стиль пропишем в создаваемом файле, в этом файле напишем php код :</p>
<p>&lt;!DOCTYPE html PUBLIC &#8220;-//W3C//DTD XHTML 1.0 Strict//EN&#8221;</p>
<p>&#8220;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&#8221;&gt;</p>
<p>&lt;html xmlns=&#8221;http://www.w3.org/1999/xhtml&#8221;&gt;</p>
<p>&lt;style&gt;</p>
<p>.header-h1 {</p>
<p>text-align: center;</p>
<p>margin-bottom: .5rem;</p>
<p>}</p>
<p>.header-h1 h1 {</p>
<p>display: inline-block;</p>
<p>background:#8FBC8F;</p>
<p>color: #000000;</p>
<p>margin-bottom: 0;</p>
<p>padding: .5rem 1rem .500rem 1rem;</p>
<p>font-size: 1.5rem;</p>
<p>text-transform: uppercase;</p>
<p>border-radius: 30px;</p>
<p>position: relative;</p>
<p>top: 0px;</p>
<p>left: -10px;</p>
<p>}</p>
<p>th, td {</p>
<p>padding: 10px;</p>
<p>position: relative;</p>
<p>top: 0px;</p>
<p>left: -38px;</p>
<p>}</p>
<p>th {</p>
<p>background: #006400;</p>
<p>color: #FFFFFF;</p>
<p>}</p>
<p>td {</p>
<p>background: #98FB98;</p>
<p>}</p>
<p>&lt;/style&gt;</p>
<p>&lt;head&gt;</p>
<p>&lt;meta http-equiv=&#8221;Content-Type&#8221; content=&#8221;text/html; charset=utf-8&#8243; /&gt;</p>
<p>&lt;link rel=&#8221;stylesheet&#8221; type=&#8221;text/css&#8221; href=&#8221;style_table.css&#8221;&gt;</p>
<p>&lt;link rel=&#8221;stylesheet&#8221; type=&#8221;text/css&#8221; href=&#8221;style.css&#8221;&gt;</p>
<p>&lt;/head&gt;</p>
<p>&lt;body&gt;</p>
<p>&lt;div&gt;</p>
<p>&lt;h1&gt;Учебная база данных &lt;/h1&gt;</p>
<p>&lt;/div&gt;</p>
<p>&lt;/div&gt;</p>
<p>1. В блоке стилей (&lt;style&gt;&#8230;&lt;/style&gt;) определены следующие стили:</p>
<p>- .header-h1 &#8211; задает выравнивание по центру, отступ снизу и фон заголовка.</p>
<p>- .header-h1 h1 &#8211; задает отображение заголовка в виде блока, фон, цвет текста, отступы и другие параметры.</p>
<p>- th, td &#8211; задают отступы и позиционирование для ячеек заголовка и данных таблицы.</p>
<p>- th &#8211; задает фон и цвет текста для ячеек заголовка.</p>
<p>- td &#8211; задает фон для ячеек данных таблицы.</p>
<p>2. В тегах &lt;head&gt;&#8230;&lt;/head&gt; заданы метаданные страницы и ссылки на внешние таблицы стилей (style_table.css и style.css).</p>
<p>3. В блоке &lt;body&gt;&#8230;&lt;/body&gt; определена верхняя часть страницы (header-h1) со шрифтом и выравниванием по центру.Общий смысл данного кода &#8211; создание стилей для заголовка и таблицы на веб-странице &#8220;Учебная база данных&#8221;.</p>
<p>Вывод данных удобно оформить в виде таблицы (Рисунок.3).</p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2023/11/111623_1832_4.png" alt="" /><span style="color: black;"><br />
</span></p>
<p style="text-align: center;"><span style="color: black;">Рисунок 3. Вывод данных<br />
</span></p>
<p>Создадим файл, в этом файле напишем php код, в котором будет задан запрос на вывод предмета под id=2:</p>
<p>&lt;?php include_once(&#8220;view/menu.php&#8221;);?&gt;</p>
<p>&lt;div class=&#8221;content&#8221;&gt;</p>
<p>&lt;?php include_once(&#8220;connection/data.php&#8221;);?&gt;</p>
<p>&lt;?</p>
<p>$con = new data();</p>
<p>$sql = $con-&gt;prepare(&#8220;SELECT DISTINCT organiz.or_name, organiz.or_client, organiz.or_pred, organiz.teacher, klienti.kl_name, predmet.pred_name, predmet.pred_cabinet FROM organiz, klienti, predmet WHERE organiz.or_client=klienti.kl_id AND organiz.or_pred = predmet.pred_id&#8221;);</p>
<p>$sql-&gt;execute(array());</p>
<p>echo &#8220;\n&lt;table&gt;\n&#8221;;</p>
<p>echo &#8220;&lt;tr&gt;\n&#8221;;</p>
<p>echo &#8220;\t&lt;th&gt;&#8221; . &#8220;День недели&#8221; . &#8220;&lt;/th&gt;&#8221;;</p>
<p>echo &#8220;&lt;th&gt;&#8221; . &#8220;Класс&#8221; . &#8220;&lt;/th&gt;&#8221;;</p>
<p>echo &#8220;&lt;th&gt;&#8221; . &#8220;Предмет&#8221; . &#8220;&lt;/th&gt;&#8221;;</p>
<p>echo &#8220;&lt;th&gt;&#8221; . &#8220;Кабинет&#8221; . &#8220;&lt;/th&gt;&#8221;;</p>
<p>echo &#8220;&lt;th&gt;&#8221; . &#8220;Учитель&#8221; . &#8220;&lt;/th&gt;&#8221;;</p>
<p>while($rs = $sql-&gt;fetch()){</p>
<p>echo &#8220;&lt;tr&gt;\n&#8221;;</p>
<p>echo &#8220;\t&lt;td&gt;&#8221; .  $rs['or_name'] . &#8220;&lt;/td&gt;&#8221;;</p>
<p>echo &#8220;&lt;td&gt;&#8221; .  $rs['kl_name'] . &#8220;&lt;/td&gt;&#8221;;</p>
<p>echo &#8220;&lt;td&gt;&#8221; .  $rs['pred_name'] . &#8220;&lt;/td&gt;&#8221;;</p>
<p>echo &#8220;&lt;td&gt;&#8221; .  $rs['pred_cabinet'] . &#8220;&lt;/td&gt;&#8221;;</p>
<p>echo &#8220;&lt;td&gt;&#8221; .  $rs['teacher'] . &#8220;&lt;/td&gt;&#8221;;</p>
<p>}</p>
<p>echo &#8220;\n&lt;/table&gt;\n&#8221;;</p>
<p>?&gt;</p>
<p>&lt;/div&gt;</p>
<p>&lt;/div&gt;</p>
<p>Данный код является PHP-кодом для генерации содержимого веб-страницы. Он выполняет следующие действия:</p>
<p>1. Импортирует содержимое файла &#8220;menu.php&#8221; с помощью функции include_once(&#8220;view/menu.php&#8221;). Это позволяет добавить содержимое этого файла в текущую страницу.</p>
<p>2. Создает блок &lt;div&gt;, который будет содержать основное содержимое страницы.</p>
<p>3. Импортирует содержимое файла &#8220;data.php&#8221; с помощью функции include_once(&#8220;connection/data.php&#8221;). Вероятно, этот файл содержит код, отвечающий за соединение с базой данных и выполнение запросов.</p>
<p>4. Создает экземпляр класса &#8220;data&#8221; (предположительно, это класс для работы с базой данных) с помощью выражения $con = new data();.</p>
<p>5. Подготавливает SQL-запрос SELECT DISTINCT&#8230; с помощью метода prepare объекта $con с передачей параметров, вызывает его выполнение с помощью execute(array()).</p>
<p>6. Генерирует разметку таблицы с помощью конструкций echo и цикла while, выводя полученные значения из результата запроса. Каждая строка результатов запроса отображается в виде строки &lt;tr&gt;, а значения в столбцах колонок отображаются в элементах &lt;td&gt;. Заголовки столбцов отображаются в элементах &lt;th&gt;.</p>
<p>7. Закрывает разметку таблицы с помощью конструкций echo.</p>
<p>8. Закрывает блок &lt;div&gt;.</p>
<p>Метод prepare() играет важную роль в работе с базами данных в PHP. Он используется для подготовки SQL-запроса перед его выполнением, и предоставляет следующие преимущества:</p>
<p>1. Защита от SQL-инъекций: Метод prepare() позволяет использовать подстановочные символы в SQL-запросе, что защищает от атак SQL-инъекций. Он эскейпирует значения, передаваемые в запрос, и позволяет их безопасно вставлять в SQL-запрос.</p>
<p>2. Повторное использование запросов: Метод prepare() позволяет подготовить SQL-запрос с плейсхолдерами (знаками вопроса или именованными метками) для значений, которые будут переданы позже. Это позволяет повторно использовать один и тот же запрос с различными значениями, что повышает эффективность выполнения запросов.</p>
<p>3. Улучшение производительности: Так как метод prepare() выполняет только подготовку запроса, а не его выполнение, он может улучшить производительность при выполнении большого количества операций с базой данных. Подготовленный запрос кэшируется и может использоваться повторно без необходимости повторной компиляции.</p>
<p>4. Удобство чтения и отладки: Использование плейсхолдеров в SQL-запросе, вместо вставки значений напрямую, делает код более читаемым и позволяет легко отслеживать и изменять значения, передаваемые в запрос.</p>
<p>Представленный код содержит PHP-скрипт для генерации содержимого веб-страницы. Он включает импорт файлов, подготовку и выполнение SQL-запроса к базе данных, а также генерацию таблицы с полученными данными. Код использует стандартные возможности PHP для работы с базами данных и веб-страницами. Он не представляет ничего нового или революционного, но демонстрирует хорошую практику использования метода prepare() для безопасной работы с базой данных и разделение кода на отдельные файлы для улучшения читаемости и повторного использования.</p>
<p>Далее алгоритм создания базы данных будет следующим:</p>
<p>1. Следующий шаг &#8211; создание формы для добавления новых данных.</p>
<p>2. Создадим файл PHP, в котором будет скрипт для внесения изменений в базу данных.</p>
<p>3. Сформируем отчет в формате CSV для возможности его скачивания в виде .csv файла.</p>
<p>Вы можете ознакомиться с исходным кодом базы данных на платформе GitHub. GitHub &#8211; это веб-платформа, позволяющая хранить код и другие программные проекты, а также совместно работать над ними и делиться ими между разработчиками. Это отличное место для публикации ваших веб-проектов. Код доступен по ссылке http://host1837693.hostland.pro/. Для работы с базой данных вам не потребуется устанавливать что-либо на свой компьютер, нужен только стандартный браузер и доступ в Интернет. Компьютер может быть подключен к Интернету в любом месте.</p>
<p>Создание баз данных является полезным для обучения и достижения образовательных целей, поскольку позволяет решать задачи с использованием информационных систем, углублять знания и поддерживать самостоятельное изучение языков программирования. Это помогает ученикам развивать навыки в области анализа данных, проектирования систем, работы с информацией и повышения эффективности работы. Базы данных являются фундаментальным инструментом в современном ИТ-мире и их использование открывает двери к различным карьерным возможностям.</p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2023/11/100997/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Сохранение значений с использованием Cookies в HTML</title>
		<link>https://web.snauka.ru/issues/2024/01/101415</link>
		<comments>https://web.snauka.ru/issues/2024/01/101415#comments</comments>
		<pubDate>Wed, 31 Jan 2024 04:39:36 +0000</pubDate>
		<dc:creator>Салихова Регина Салаватовна</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[cookies]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JS]]></category>
		<category><![CDATA[безопасность данных]]></category>
		<category><![CDATA[веб-разработка]]></category>
		<category><![CDATA[идентификация пользователя]]></category>
		<category><![CDATA[клиент-серверное взаимодействие]]></category>
		<category><![CDATA[приватность пользователей]]></category>
		<category><![CDATA[сессии]]></category>
		<category><![CDATA[хранение данных]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/issues/2024/01/101415</guid>
		<description><![CDATA[Научный руководитель: Вильданов Алмаз Нафкатович к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал, г. Нефтекамск HTML (Hypertext Markup Language) – это язык разметки, используемый для создания веб-страниц. Он определяет структуру и содержимое веб-сайта, но не хранит информацию о пользователях. Для сохранения данных пользователей используются cookies. Cookies в HTML – это небольшие текстовые файлы, которые хранятся на компьютере пользователя. [...]]]></description>
			<content:encoded><![CDATA[<p style="background: white; text-align: center;"><span style="color: black;"><em>Научный руководитель: Вильданов Алмаз Нафкатович<br />
</em></span><em>к.ф.-м.н., </em><em>Уфимский университет науки и технологий, Нефтекамский филиал, </em><em>г. Нефтекамск</em></p>
<p style="text-align: justify; background: white;"><span><span style="color: black;"><br />
</span></span></p>
<p style="text-align: justify;"><span style="text-align: justify;">HTML (Hypertext Markup Language) – это язык разметки, используемый для создания веб-страниц. Он определяет структуру и содержимое веб-сайта, но не хранит информацию о пользователях. Для сохранения данных пользователей используются cookies.</span></p>
<p style="text-align: justify;"><span>Cookies в HTML – это небольшие текстовые файлы, которые хранятся на компьютере пользователя. Они содержат информацию о предпочтениях пользователя, такую как настройки сайта, последние просмотренные товары и т.д. Cookies позволяют сайту запоминать данные о пользователе при каждом посещении.<br />
</span></p>
<p style="text-align: justify;"><span>Сохранение значений с использованием Cookies – это процесс сохранения данных на компьютере пользователя, чтобы они могли быть восстановлены при последующем посещении веб-сайта. Это особенно полезно в случаях, когда требуется сохранить и использовать информацию, которую пользователь вводит на странице.<br />
</span></p>
<p style="text-align: justify;"><span>Преимущества использования Cookies для сохранения значений очевидны. Например, если пользователь заполнил форму на веб-сайте, но случайно закрыл окно или потерял соединение с Интернетом, без Cookies данные будут потеряны. Однако, если значения сохранены в Cookies, они могут быть восстановлены при следующем посещении.<br />
</span></p>
<p style="text-align: justify;"><span>Процесс сохранения значений с использованием Cookies довольно прост. В HTML, JavaScript используется для работы с Cookies. При заполнении формы, значение каждого поля может быть сохранено в Cookies с помощью JavaScript.<br />
</span></p>
<p style="text-align: justify;"><span>Для сохранения значений с использованием Cookies необходимо выполнить следующие шаги:<br />
</span></p>
<p><span style="text-align: justify;">1. Создание и установка Cookies:</span></p>
<p style="text-align: justify;"><span>Вначале необходимо создать новый объект Cookies с помощью конструктора Document.cookie. Но это не просто свойство данных, а акcессор (геттер/сеттер). Присваивание к нему обрабатывается особым образом. Запись в document.cookie обновит только упомянутые в ней куки, но при этом не затронет все остальные. Например, этот вызов установит куки с именем user и значением John(Рисунок 1):</span></p>
<p><img class="aligncenter" src="https://web.snauka.ru/wp-content/uploads/2024/02/020124_0340_1.png" alt="" /></p>
<p style="text-align: center;"><span><em>Рисунок 1.<br />
</em></span></p>
<p><span style="text-align: justify;">2. Получение значений Cookies:</span></p>
<p style="text-align: justify;"><span>Для получения значения Cookies, необходимо прочитать свойство document.cookie.<br />
</span></p>
<p style="text-align: justify;"><span>Значение Cookies будет представлено в виде строки, разделенной точкой с запятой &#8220;;&#8221;.<br />
</span></p>
<p style="text-align: justify;"><span>Чтобы получить конкретное значение Cookies, необходимо выполнить дополнительные действия, такие как использование регулярных выражений или разбиение строки на отдельные части.<br />
</span></p>
<p><span style="text-align: justify;">3. Обновление значений Cookies:</span></p>
<p style="text-align: justify;"><span>Для обновления значения Cookies необходимо выполнить те же шаги, что и при создании нового значения.<br />
</span></p>
<p style="text-align: justify;"><span>Однако, при этом необходимо указать те же самые параметры, которые были установлены при создании Cookies, такие как путь, истекающее время и домен.<br />
</span></p>
<p><span style="text-align: justify;">4. Удаление значений Cookies:</span></p>
<p style="text-align: justify;"><span>Чтобы удалить значение Cookies, необходимо установить срок его действия на прошедшую дату или вызвать метод<br />
</span></p>
<p style="text-align: justify;"><span>document.cookie = &#8220;username=;<br />
</span></p>
<p style="text-align: justify;"><span>expires=Thu, 01 Jan 1970 00:00:00 UTC;<br />
</span></p>
<p style="text-align: justify;"><span> path=/&#8221;.<br />
</span></p>
<p style="text-align: justify;"><span>Это удалит Cookies с именем &#8220;username&#8221;.<br />
</span></p>
<p style="text-align: justify;"><span>Рассмотрим пример использования cookies в программе, вычисляющей сумму двух чисел (Рисунок 2):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020124_0340_2.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 2<br />
</em></span></p>
<p style="text-align: justify;"><span>Для сохранения Cookies вызываются функции set_cookie, которые записывают значения переменных U и R в куки браузера (Рисунок 3):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020124_0340_3.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 3<br />
</em></span></p>
<p style="text-align: justify;"><span>Чтобы переменные получили значения cookies, используют функцию get_cookie (Рисунок 4):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020124_0340_4.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 4<br />
</em></span></p>
<p style="text-align: justify;"><span>Добавим кнопку «Удалить куки» с помощью onclick=&#8221;DelCook()&#8221;(Рисунок 5):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020124_0340_5.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 5<br />
</em></span></p>
<p style="text-align: justify;"><span>Важно отметить, что сохранение значений с использованием Cookies имеет некоторые ограничения, такие как ограниченное место для хранения, необходимость включенных Cookies в браузере пользователя и возможные проблемы с безопасностью. Более надежными альтернативами могут быть использование баз данных или локальное хранилище веб-браузера.<br />
</span></p>
<p style="text-align: justify;"><span>В заключение, сохранение значений с использованием Cookies в HTML – это удобный и популярный способ сохранения данных на компьютере пользователя. Они позволяют веб-сайтам восстанавливать информацию при повторном посещении и облегчают работу пользователя. Однако необходимо учитывать ограничения и безопасность при использовании Cookies.</span></p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2024/01/101415/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Разработка веб-форм</title>
		<link>https://web.snauka.ru/issues/2024/01/101430</link>
		<comments>https://web.snauka.ru/issues/2024/01/101430#comments</comments>
		<pubDate>Wed, 31 Jan 2024 06:42:45 +0000</pubDate>
		<dc:creator>Салихов Салават Зульфатович</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[POST]]></category>
		<category><![CDATA[запросы]]></category>
		<category><![CDATA[создание опросов]]></category>
		<category><![CDATA[форма]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/issues/2024/01/101430</guid>
		<description><![CDATA[Научный руководитель: Вильданов Алмаз Нафкатович к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал 1. Использование кода для создания формы: Я продемонстрирую использование разных типов ввода и вывода данных используемых в опросах. 2. Пример кода на html, css: Я предоставлю пример кода на html, css, php который можно использовать для создания сайта с формой. №1 Создание формы. Тег &#60;form&#62; используется для создания [...]]]></description>
			<content:encoded><![CDATA[<p style="text-align: center;"><em>Научный руководитель: Вильданов Алмаз Нафкатович<br />
</em><em>к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал</em></p>
<p style="text-align: center;">
<div style="display: inline !important;"><span><span style="times new roman; background-color: white;"><strong>1. Использование </strong></span><span style="background-color: white;"><strong>кода для создания формы:</strong> Я продемонстрирую использование разных типов ввода и вывода данных используемых в опросах.</span><br />
2<span style="times new roman; background-color: white;">. <strong>Пример кода на </strong></span><span style="background-color: white;"><strong>html, css:</strong> Я предоставлю пример кода на html, css, php который можно использовать для создания сайта с формой.</span></span></div>
<p style="text-align: justify;"><strong>№1 Создание формы.<br />
</strong></p>
<p style="text-align: justify;">Тег &lt;form&gt; используется для создания HTML-формы. В нём находится всё содержимое формы: поля для ввода, подписи к этим полям и кнопка отправки.</p>
<p><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020224_0642_1.png" alt="" /></p>
<p>Здесь action определяет URL, куда будут отправлены данные формы, а method указывает метод отправки данных: GET или POST. Если использовать метод GET, параметры формы будут отображаться в адресной строке браузера. Это небезопасно, так как данные формы можно легко изменить.</p>
<p><strong>№2 Выбор пунктов.<br />
</strong></p>
<p>Атрибут type тега &lt;input&gt; со значением radio обычно используется для создания группы радиокнопок (переключателей), описывающих набор взаимосвязанных параметров.</p>
<p>Одновременно пользователь может выбрать лишь одну радиокнопку из предложенных. Радиокнопки обычно отображаются как небольшие кружки, которые заполняются или подсвечиваются, когда выбраны.</p>
<p style="text-align: justify;"><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020224_0642_2.png" alt="" /></p>
<p>Элементы &lt;input&gt; типа checkbox по умолчанию отображаются как флажки, которые отмечаются (отмечены) при активации. Флажок позволяет выбрать отдельные значения для отправки в форму.</p>
<p><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020224_0642_3.png" alt="" /></p>
<p>Обязательно связывайте &lt;label&gt; с чекбоксами и радиокнопками. Это небольшие элементы интерфейса, в которые довольно сложно попасть курсором мыши или пальцем на мобильных устройствах. Если у них есть связанный &lt;label&gt;, то пользователь может кликать по тексту подписи, а не целиться в сам чекбокс.</p>
<p><strong>№3 Выпадающий список.<br />
</strong></p>
<p>Тег &lt;option&gt; в HTML используется для выбора опции из раскрывающегося меню, создаваемого с помощью контейнера &lt;select&gt;. Ширина списка определяется самым широким текстом, указанным в теге &lt;option&gt;, а также может изменяться с помощью стилей.<br />
Группу опций можно создать с помощью тега &lt;optgroup&gt;. Он создает группу связанных пунктов меню.</p>
<p><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020224_0642_4.png" alt="" /></p>
<p><strong>№4 Текстовые поля.<br />
</strong></p>
<p>HTML-элемент &lt;textarea&gt; представляет собой многострочный элемент управления для редактирования обычного текста, который полезен, если вы хотите, чтобы пользователи могли вводить значительный объем текста в произвольной форме.</p>
<p>Параметр rows регулирует высоту, а параметр cols &#8211; длину</p>
<p><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020224_0642_5.png" alt="" /></p>
<p style="text-align: justify;"><strong>№6 Кнопка отправки.<br />
</strong></p>
<p>submit — кнопка для отправки формы. Обычно ставится в конце формы. Хотя на практике часто используют &lt;button type=&#8221;submit&#8221;&gt;, так как кнопку проще стилизовать. &lt;input type=&#8221;submit&#8221; value=&#8221;Отправить&#8221;&gt;.</p>
<p style="text-align: justify;"><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020224_0642_6.png" alt="" /><strong><br />
</strong></p>
<p style="text-align: justify;"><strong>№6 Переход в среду php.<br />
</strong></p>
<p>Даже если PHP код помещён в файл с расширением .php, то для того, чтобы он обрабатывался интерпретатором именно как PHP код, он должен быть размещён после тэга: &lt;?php</p>
<p>Закрывающий тег пишется так: ?&gt;</p>
<p><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020224_0642_7.png" alt="" /></p>
<p>Закрывающий тег не является обязательным. Тем не менее, закрывающий тег может использоваться когда заканчивается PHP код и начинается, например, HTML код.</p>
<p>Пары &lt;?php и ?&gt; могут использоваться в одном файле несколько раз, отделяя PHP код от HTML кода.</p>
<p>Важная вещь, которую нужно знать про закрывающий тег ?&gt;: он выбросит вас из PHP в HTML даже если он закомментирован с помощью //. Однако комментарий /* */ справляется — тег ?&gt; теряет своё специальное значение. Помните об этой интересной особенности, поскольку при комментировании блоков кода, вы можете столкнуться с необычной ситуацией, когда ?&gt; продолжит работу не смотря на то, что вы этого не ожидаете.</p>
<p><strong>№7 Вывод переменных в среде php.<br />
</strong></p>
<p>Команда echo отвечает за вывод информации на экран. После оператора указывается значение, которое нужно вывести. Чтобы вывести текст, его нужно указать в одинарных или двойных кавычках.</p>
<p>Команды в PHP разделяются точкой с запятой. Для удобства чтения каждую команду принято писать с новой строки.</p>
<p><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020224_0642_8.png" alt="" /></p>
<p>Для обработки запросов типа POST в PHP используется встроенная глобальная переменная $_POST. Она представляет ассоциативный массив данных, переданных с помощью метода POST. Используя ключи, мы можем получить отправленные значения. Ключами в этом массиве являются значения атрибутов name у полей ввода формы.</p>
<p>При выводе не только одной переменной, используется знак « . ». Также это касается постоянных в одной строке с  $_POST.</p>
<p>Для вывода переменной при помощи POST, она должна быть записана в квадратных скобках.</p>
<p><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020224_0642_9.png" alt="" /></p>
<p><strong>Итог работы<br />
</strong></p>
<p>&nbsp;</p>
<p><span style="background-color: white;">Комбинируя все вышеуказанные способы ввода и вывода, получается следующее:</span></p>
<p align="left">&lt;meta http-equiv=&#8221;Content-Type&#8221; content=&#8221;text/html; charset=utf-8&#8243;&gt;</p>
<p align="left">&lt;body bgcolor=&#8221;#C4C4C4&#8243;&gt;</p>
<p align="left">&lt;h1 style=&#8221;text-align: center;&#8221;&gt;Форма Салихова Салавата&lt;/h1&gt;</p>
<p align="left">&lt;hr&gt;&lt;form action=&#8221;index.php&#8221; method=&#8221;POST&#8221;&gt;</p>
<p align="left">&lt;p&gt;Вы любите животных?&lt;/p&gt;</p>
<p align="left">&lt;label&gt;&lt;input name=&#8221;kapch&#8221; value=&#8221;Вы любите животных?: Да&#8221; id=&#8221;kapch1&#8243; type=&#8221;radio&#8221;&gt;Да&lt;/label&gt;</p>
<p align="left">&lt;Br&gt;&lt;label&gt;&lt;input name=&#8221;kapch&#8221; value=&#8221;Вы любите животных?: Нет&#8221; id=&#8221;kapch&#8221; type=&#8221;radio&#8221;&gt; Нет&lt;/label&gt;</p>
<p align="left">&lt;p&gt;С кем Вы предпочитаете проводить свободное время?&lt;/p&gt;</p>
<p align="left">&lt;label&gt;&lt;input type=&#8221;checkbox&#8221; name=&#8221;kapcha1&#8243; value=&#8221;С семьей &#8220;&gt; С семьей&lt;/label&gt;</p>
<p align="left">&lt;Br&gt;&lt;label&gt;&lt;input type=&#8221;checkbox&#8221; name=&#8221;kapcha2&#8243; value=&#8221;С друзьями &#8220;&gt; С друзьями&lt;/label&gt;</p>
<p align="left">&lt;Br&gt;&lt;label&gt;&lt;input type=&#8221;checkbox&#8221; name=&#8221;kapcha3&#8243; value=&#8221;Предпочитаю быть один &#8220;&gt; Предпочитаю быть один &lt;/label&gt;</p>
<p align="left">&lt;p&gt;Где Вы предпочитаете проводить свободное время?&lt;/p&gt;</p>
<p align="left">&lt;select name=&#8221;kiti&#8221;&gt;</p>
<p align="left">&lt;option selected disabled value=&#8221;"&gt;выберите место&lt;/option&gt;</p>
<p align="left">&lt;option value=&#8221;Где Вы предпочитаете проводить свободное время?: Дома&#8221;&gt; Дома&lt;/option&gt;</p>
<p align="left">&lt;option value=&#8221;Где Вы предпочитаете проводить свободное время?: В гостях&#8221;&gt;В гостях&lt;/option&gt;</p>
<p align="left">&lt;option value=&#8221;Где Вы предпочитаете проводить свободное время?: Гуляю на улице&#8221;&gt;Гуляю на улице&lt;/option&gt;</p>
<p align="left">&lt;/select&gt;</p>
<p align="left">&lt;p&gt;Сколько иностранных языков вы знаете&lt;/p&gt;</p>
<p align="left">&lt;textarea rows=&#8221;2&#8243; cols=&#8221;23&#8243; name =&#8221;animals&#8221;&gt;&lt;/textarea&gt;</p>
<p align="left">&lt;p&gt;Есть ли у Вас свободное время, если Да, то сколько? (часов в день)&lt;/p&gt;</p>
<p align="left">&lt;textarea rows=&#8221;2&#8243; cols=&#8221;23&#8243; name=&#8221;skrud&#8221;&gt;&lt;/textarea&gt;&lt;Br&gt;</p>
<p align="left">&lt;p&gt; Расскажите о себе &lt;/p&gt;</p>
<p align="left">&lt;textarea rows=&#8221;20&#8243; cols=&#8221;140&#8243; name =&#8221;pole&#8221;&gt;&lt;/textarea&gt;</p>
<p align="left">&lt;Br&gt;&lt;input value=&#8221;Отправить&#8221; type=&#8221;submit&#8221;&gt;&lt;/Br&gt;</p>
<p align="left">&lt;/form&gt;&lt;/body&gt;</p>
<p align="left">&lt;?php echo &#8220;&lt;p&gt;Ваши ответы: &lt;/p&gt;&#8221;;</p>
<p align="left">echo &#8220;&lt;p&gt;&#8221; . $_POST["kapch"];</p>
<p align="left">if ( $_POST["kapcha1"] == &#8216;С семьей &#8216; and $_POST["kapcha2"] !== &#8216;С друзьями &#8216; and $_POST["kapcha3"] !== &#8216;Предпочитаю быть один &#8216;) {</p>
<p align="left">echo &#8220;&lt;p&gt;С кем Вы предпочитаете проводить свободное время?:&#8221; .$_POST["kapcha1"];}</p>
<p align="left">if ( $_POST["kapcha1"] !== &#8216;С семьей &#8216; and $_POST["kapcha2"] == &#8216;С друзьями &#8216; and $_POST["kapcha3"] !== &#8216;Предпочитаю быть один &#8216;) {</p>
<p align="left">echo &#8220;&lt;p&gt;С кем Вы предпочитаете проводить свободное время?:&#8221; .$_POST["kapcha2"];}</p>
<p align="left">if ( $_POST["kapcha1"] !== &#8216;С семьей &#8216; and $_POST["kapcha2"] !== &#8216;С друзьями &#8216; and $_POST["kapcha3"] == &#8216;Предпочитаю быть один &#8216;) {</p>
<p align="left">echo &#8220;&lt;p&gt;С кем Вы предпочитаете проводить свободное время?:&#8221; .$_POST["kapcha3"];}</p>
<p align="left">if ( $_POST["kapcha1"] == &#8216;С семьей &#8216; and $_POST["kapcha2"] == &#8216;С друзьями &#8216; and $_POST["kapcha3"] !== &#8216;Предпочитаю быть один &#8216;) {</p>
<p align="left">echo &#8220;&lt;p&gt;С кем Вы предпочитаете проводить свободное время?:&#8221; .$_POST["kapcha1"]. &#8221; , &#8220;.$_POST["kapcha2"];}</p>
<p align="left">if ( $_POST["kapcha1"] == &#8216;С семьей &#8216; and $_POST["kapcha2"] !== &#8216;С друзьями &#8216; and $_POST["kapcha3"] == &#8216;Предпочитаю быть один &#8216;) {</p>
<p align="left">echo &#8220;&lt;p&gt;С кем Вы предпочитаете проводить свободное время?:&#8221; .$_POST["kapcha1"]. &#8221; , &#8221; .$_POST["kapcha3"];}</p>
<p align="left">if ( $_POST["kapcha1"] !== &#8216;С семьей &#8216; and $_POST["kapcha2"] == &#8216;С друзьями &#8216; and $_POST["kapcha3"] == &#8216;Предпочитаю быть один &#8216;) {</p>
<p align="left">echo &#8220;&lt;p&gt;С кем Вы предпочитаете проводить свободное время?:&#8221; .$_POST["kapcha2"]. &#8221; , &#8221; .$_POST["kapcha3"];}</p>
<p align="left">if ( $_POST["kapcha1"] == &#8216;С семьей &#8216; and $_POST["kapcha2"] == &#8216;С друзьями &#8216; and $_POST["kapcha3"] == &#8216;Предпочитаю быть один &#8216;) {</p>
<p align="left">echo &#8220;&lt;p&gt;С кем Вы предпочитаете проводить свободное время?:&#8221; .$_POST["kapcha1"]. &#8221; , &#8221; .$_POST["kapcha2"]. &#8221; , &#8221; .$_POST["kapcha3"];}</p>
<p align="left">echo &#8220;&lt;p&gt;&#8221; . $_POST["kiti"];</p>
<p align="left">if ( $_POST["animals"] !== &#8221;) {</p>
<p align="left">echo &#8220;&lt;p&gt;Сколько иностранных языков вы знаете:&#8221; .$_POST["animals"];}</p>
<p align="left">echo &#8220;&lt;p&gt;&#8221; .$_POST["vid"];</p>
<p align="left">echo  &#8220;&lt;p&gt;&#8221; .$_POST["kolvo"];</p>
<p align="left">if ( $_POST["skrud"] !== &#8221;) {</p>
<p align="left">echo  &#8220;&lt;p&gt;Есть ли у Вас свободное время, если Да, то сколько? (часов в день):&#8221; .$_POST["skrud"];}</p>
<p align="left">if ( $_POST["pole"] !== &#8221;) {</p>
<p align="left">echo  &#8220;&lt;p&gt;Вы рассказали о себе следующее: &#8221; .$_POST["pole"];}?&gt;</p>
<p><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020224_0642_10.png" alt="" /><span style="color: black; times new roman; 10pt; background-color: white;"><br />
</span></p>
<p><span style="color: black; times new roman; 10pt; background-color: white;">Используя компилятор, код будет выглядеть так:<br />
</span></p>
<p><img src="https://web.snauka.ru/wp-content/uploads/2024/02/020224_0642_11.png" alt="" /><span style="color: black; times new roman; 10pt; background-color: white;"><br />
</span></p>
<p><span style="color: black; times new roman; 10pt; background-color: white;">В заключение, веб-формы также можно использовать для обратной связи, заявок, оформления заказов, голосования, тестирования, оформления подписки и других областях.</span></p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2024/01/101430/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Разработка авторизации на сайте</title>
		<link>https://web.snauka.ru/issues/2024/07/102305</link>
		<comments>https://web.snauka.ru/issues/2024/07/102305#comments</comments>
		<pubDate>Tue, 02 Jul 2024 11:11:55 +0000</pubDate>
		<dc:creator>Гриневский Денис Станиславович</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[MySQL]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[база данных]]></category>
		<category><![CDATA[разработка веб-страницы]]></category>
		<category><![CDATA[форма регистрации и авторизации]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/issues/2024/07/102305</guid>
		<description><![CDATA[Научный руководитель: Вильданов Алмаз Нафкатович к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал &#160; Для начала работы необходимо зарегистрировать аккаунт на hostland.ru, для этого переходим на сайт и нажимаем кнопку «Вход», а затем зарегистрироваться. Выбираем нужный тариф, при регистрации первый месяц будет бесплатным, однако нужно подтвердить аккаунт (рисунок 1): Рисунок 1. Авторизация на сайте hostland.ru Теперь нам [...]]]></description>
			<content:encoded><![CDATA[<p style="background: white; text-align: center;"><em>Научный руководитель: Вильданов Алмаз Нафкатович<br />
</em><em><span>к.ф.-м.н., </span></em><em><span>Уфимский университет науки и технологий, Нефтекамский филиал</span></em></p>
<p>&nbsp;</p>
<p style="text-align: justify;"><span>Для начала работы необходимо зарегистрировать аккаунт на hostland.ru, для этого переходим на сайт и нажимаем кнопку «Вход», а затем зарегистрироваться. Выбираем нужный тариф, при регистрации первый месяц будет бесплатным, однако нужно подтвердить аккаунт (рисунок 1):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1106_1.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 1. Авторизация на сайте hostland.ru<br />
</em></span></p>
<p style="text-align: justify;"><span>Теперь нам необходимо создать пользователя и саму базу данных. Информационные системы, работающие с MySQL по-прежнему актуальны и широко используются. MySQL предоставляет надежное и масштабируемое решение для хранения данных, что делает его популярным выбором для веб-разработчиков [1]. Многие современные веб-приложения, включая интернет-магазины и корпоративные системы, продолжают использовать MySQL благодаря его производительности, безопасности и поддержке сообщества.<br />
</span></p>
<p style="text-align: justify;"><span>Сначала перейдите на вкладку MySQL -&gt; Пользователи MySQL. Создайте нового пользователя, например, host1872291_1, и придумайте для него пароль, к примеру 12345 (рисунок 2):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1106_2.png" alt="" /></p>
<p style="text-align: center;"><span><em>Рисунок 2. MySQL<br />
</em></span></p>
<p><span>Далее переходим во вкладку базы данных MySQL. Создаем базу данных, для удобства с такими же данными, как и пользователь. И прикрепляем созданного нами пользователя (рисунок 3):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1106_3.png" alt="" /><span><em>Рисунок 3. Добавление базы данных</em><br />
</span></p>
<p style="text-align: justify;"><span>Затем переходим во вкладку phpMyAdmin. PhpMyAdmin это веб-интерфейс для управления СУБД [2]. Выбираем нашу базу данных и создаём нужные нам таблицы (рисунок 4):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1106_4.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 4. Создание таблицы<br />
</em></span></p>
<p style="text-align: justify;"><span>Не забудьте сделать первое поле ключевым и автоинкрементным. Если вы упустили этот момент, не переживайте — вы можете внести изменения позже, зайдя в структуру таблицы. Используйте различные типы данных. Например, для хранения пола используйте тип enum, который позволяет обозначить фиксированный набор значений, в данном случае два. Для коротких строк, таких как имена и фамилии, применяйте тип varchar(25), где числовое значение в скобках указывает максимальную длину строки. Помните, что строки, превышающие 25 символов, будут обрезаны при сохранении в базу данных.<br />
</span></p>
<p><span>Нажимаем Новая назовем таблицу login для сохранения данных пользователей при регистрации, вводим столбцы как на примере, задаем тип text (рисунок 5):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1106_5.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 5. Таблица login<br />
</em></span></p>
<p style="text-align: justify;"><span>Используйте различные типы данных. Например, для хранения пола используйте тип enum, который позволяет обозначить фиксированный набор значений. Для коротких строк, таких как имена и фамилии, применяйте тип varchar(25), где числовое значение в скобках указывает максимальную длину строки [3]. Помните, что строки, превышающие 25 символов, будут обрезаны при сохранении в базу данных.<br />
</span></p>
<p style="text-align: justify;"><span>Переходим в файловый менеджер и создаём папку connection в которой создаем data.php он нам нужен для подключения к таблице. В нем мы создаем объект data класса PDO. Указываем имя БД, пользователя и пароль (рисунок 6):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1106_6.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 6. Код для файла data.php<br />
</em></span></p>
<p><span>Теперь этот файл больше не меняется и будет использоваться на всех страницах, где нужен вывод данных. Далее создаем index.php. Именно с него начинается наш сайт. Поэтому в нём мы сделаем нашу авторизацию.<br />
</span></p>
<p><span>Подключаем к нашей БД и пишем следующий код для проверки наличия пользователя в БД(рисунок 7) и кнопку регистрации для того случая, если пользователь новый. В итоге получаем(рисунок 8):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1106_7.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 7. Код для Авторизации<br />
</em></span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1106_8.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 8. Пример оформления поля авторизации<br />
</em></span></p>
<p><span>Затем создадим файл reg.php, именно в нём мы будем записывать новых пользователей в БД, пишем код (рисунок 9) и получаем (рисунок 10):<br />
</span></p>
<p style="text-align: center;"><span>.<img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1106_9.png" alt="" /><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 9. Код для регистрации<br />
</em></span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1106_10.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 10. Пример оформления поля авторизации<br />
</em></span></p>
<p><span>После всего что мы проделали, нам осталось сделать главное меню в которой мы и увидим нашу таблицу minerals_info. Для этого создадим файл main.php и напишем в нём следующий код (рисунок 11):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1106_11.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 11. Код для вывода таблицы</em>.<br />
</span></p>
<p style="text-align: justify;"><span>Таким образом, в случае того если пользователь не зарегистрирован, но попадёт на данную страницу, он не увидит нашу таблицу (рисунок 12), а увидит лишь строчку &#8220;Эта страница только для авторизованных пользователей!&#8221;.<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1106_12.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Р<em>исунок 12. Пример вывода таблицы.</em></span></p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2024/07/102305/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Разработка базы данных магазина детских товаров</title>
		<link>https://web.snauka.ru/issues/2024/07/102319</link>
		<comments>https://web.snauka.ru/issues/2024/07/102319#comments</comments>
		<pubDate>Tue, 02 Jul 2024 11:31:01 +0000</pubDate>
		<dc:creator>Ишпулатова Александра Юрьевна</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[MySQL]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[база данных]]></category>
		<category><![CDATA[разработка веб-страницы]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/issues/2024/07/102319</guid>
		<description><![CDATA[Научный руководитель: Вильданов Алмаз Нафкатович к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал Разработка веб-страниц с базами данных &#8211; это важный этап создания любого сайта. Благодаря базам данных сайт становится более динамичным и интерактивным для пользователей. На платформе hostland.ru вы можете легко создать веб-страницу с базой данных, используя различные инструменты и сервисы. Одним из основных инструментов для [...]]]></description>
			<content:encoded><![CDATA[<p style="background: white; text-align: center;"><em style="text-align: center;"><span>Научный руководитель: Вильданов Алмаз Нафкатович<br />
</span></em><em>к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал</em></p>
<p style="text-align: justify;"><span>Разработка веб-страниц с базами данных &#8211; это важный этап создания любого сайта. Благодаря базам данных сайт становится более динамичным и интерактивным для пользователей. На платформе hostland.ru вы можете легко создать веб-страницу с базой данных, используя различные инструменты и сервисы.<br />
</span></p>
<p style="text-align: justify;"><span>Одним из основных инструментов для работы с базами данных на сайте hostland.ru является MySQL. MySQL &#8211; это мощная система управления реляционными базами данных, которая позволяет создавать и управлять базами данных для вашего сайта. С помощью MySQL вы можете хранить информацию о пользователях, товарах, заказах и многом другом.<br />
</span></p>
<p style="text-align: justify;"><span>Информационные системы, использующие MySQL, остаются востребованными и широко применяются в современной веб-разработке [1]. MySQL предлагает надежное и масштабируемое решение для хранения данных, что делает его популярным среди разработчиков. Многие современные веб-приложения, включая интернет-магазины и корпоративные системы, выбирают MySQL из-за его высокой производительности, надежности и поддержки со стороны сообщества разработчиков.<br />
</span></p>
<p style="text-align: justify;"><span>Для разработки веб-страниц с базами данных на сайте hostland.ru вы можете использовать различные языки программирования, такие как PHP, Python, Ruby и другие. Эти языки позволяют создавать динамические веб-страницы, взаимодействующие с базой данных и отображающие пользователю актуальную информацию.<br />
</span></p>
<p style="text-align: justify;"><span>Для того чтобы создать базу данных, первым делом нужно зарегистрироваться на хостинге. Хостинг – это услуга, предоставляющая возможность размещать ваш веб-сайт или веб-приложение в интернете. Подписываясь на эту услугу, вы арендуете место на сервере для хранения всех файлов и данных, необходимых для корректной работы вашего сайта.<br />
</span></p>
<p><span>Следом, нам нужно создать пользователя и саму базу данных. Сначала перейдите на вкладку MySQL. Создайте нового пользователя, например, host1872316, и придумайте для него пароль (рисунок 1).<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1118_1.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рисунок 1<br />
</span></p>
<p><span>Создаем базу данных и прикрепляем пользователя (рисунок 2):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1118_2.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рисунок 2.<br />
</span></p>
<p style="text-align: justify;"><span>Затем нажмите кнопку открыть → phpMyAdmin. PhpMyAdmin представляет собой веб-интерфейс для управления СУБД MySQL. Он позволяет выполнять администрирование сервера MySQL, запускать SQL-команды и просматривать содержимое таблиц и баз данных через браузер [2]. Перейдите к своей базе данных и создайте нужные таблицы (рисунок 3).<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1118_3.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рисунок 3<br />
</span></p>
<p style="text-align: justify;"><span>Для разработки базы данных каталога мужской одежды, сначала необходимо продумать структуру будущей базы данных. Это включает в себя определение таблиц, их полей и связей между ними. Рассмотрим пример структуры базы данных магазина детских товаров.<br />
</span></p>
<p><span>Таблица &#8220;products&#8221; (Товары):<br />
</span></p>
<p><span>•    product_id (INT): Уникальный идентификатор товара.<br />
</span></p>
<p><span>•    product_name (VARCHAR(100)): Название товара.<br />
</span></p>
<p><span>•    category_id (INT): Ссылка на таблицу &#8220;categories&#8221;, указывающая категорию товара.<br />
</span></p>
<p><span>•    age_group (ENUM(&#8217;0-2&#8242;, &#8217;3-5&#8242;, &#8217;6-8&#8242;, &#8217;9-12&#8242;)): Возрастная группа, для которой предназначен товар.<br />
</span></p>
<p><span>•    release_date (DATE): Дата выпуска товара.<br />
</span></p>
<p><span>•    description (TEXT): Описание товара.<br />
</span></p>
<p><span>•    cost (INT): Цена товара.<br />
</span></p>
<p><span>Таблица &#8220;categories&#8221; (Категории):<br />
</span></p>
<p><span>•    category_id (INT): Уникальный идентификатор категории.<br />
</span></p>
<p><span>•    category_name (VARCHAR(100)): Название категории.<br />
</span></p>
<p><span>•    category_description (TEXT): Описание категории.<br />
</span></p>
<p><span>Не забудьте сделать первое поле ключевым и автоинкрементным. Если вы упустили этот момент, не переживайте — вы можете внести изменения позже, зайдя в структуру таблицы (рисунок 4).<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1118_4.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рисунок 4<br />
</span></p>
<p><span>Заполним таблицу данными (рисунок 5).<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1118_5.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рисунок 5<br />
</span></p>
<p style="text-align: justify;"><span>Поле с ключом и автоинкрементом заполнять не требуется. Можно добавлять данные по два набора за раз. Заполните нужные поля и нажмите «Вперед».<br />
</span></p>
<p style="text-align: justify;"><span>Используйте различные типы данных. Например, для хранения пола используйте тип enum, который позволяет обозначить фиксированный набор значений, в данном случае два. Для коротких строк, таких как имена и фамилии, применяйте тип varchar(25), где числовое значение в скобках указывает максимальную длину строки [3]. Помните, что строки, превышающие 25 символов, будут обрезаны при сохранении в базу данных (рисунок 6).<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1118_6.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рисунок 6<br />
</span></p>
<p><span>Для работы с базой данных, конечно, одного PhpMyAdmin недостаточно. Нужен удобный веб-интерфейс с разграничением доступа. Создадим для начала простейшее веб-приложение.<br />
</span></p>
<p><span>В папке connection создадим файл data.php для подключения к нашей БД. В нем мы создаем объект data класса PDO. Указываем имя БД, пользователя и пароль (рисунок 7):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1118_7.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рисунок 7<br />
</span></p>
<p><span>Теперь этот файл больше не меняется и будет использоваться на всех страницах, где нужен вывод данных.<br />
</span></p>
<p style="text-align: justify;"><span>Создадим в папке www файл index.php для первичного вывода данных (рисунок 8, 9).<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1118_8.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рисунок 8<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1118_9.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рисунок 9<br />
</span></p>
<p><span>Таким образом будет выглядеть наша таблица на сайте (рисунок 10).<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2024/07/070224_1118_10.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рисунок 10<br />
</span></p>
<p style="text-align: justify;"><span>Одним из осуществленных преимуществ работы с базами данных на сайте hostland.ru является простота управления данными. Вы можете легко добавлять, изменять и удалять записи в базе данных, не имея специальных навыков программирования. Благодаря интуитивному интерфейсу и шаблонам, предоставленным на платформе hostland.ru, вы сможете легко настроить свою базу данных и веб-страницы под ваши потребности.<br />
</span></p>
<p style="text-align: justify;"><span>Кроме того, разработка веб-страниц с базами данных на сайте hostland.ru обеспечивает высокую производительность и безопасность вашего сайта. Серверы hostland.ru обеспечивают быстрый доступ к базам данных и защищают данные пользователей с помощью современных методов шифрования и защиты.<br />
</span></p>
<p style="text-align: justify;"><span>Таким образом, разработка веб-страниц с базами данных на сайте hostland.ru – это удобный и эффективный способ создания динамичного и интерактивного сайта. С помощью инструментов и сервисов, предоставленных на платформе hostland.ru, вы сможете легко создать и управлять базами данных, делая ваш сайт более привлекательным для пользователей.</span></p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2024/07/102319/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Разработка базы данных музыкальных инструментов</title>
		<link>https://web.snauka.ru/issues/2024/10/102717</link>
		<comments>https://web.snauka.ru/issues/2024/10/102717#comments</comments>
		<pubDate>Thu, 24 Oct 2024 14:46:27 +0000</pubDate>
		<dc:creator>Сагдатов Тимур Альбертович</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[MySQL]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[база данных]]></category>
		<category><![CDATA[каталог музыкальных инструментов]]></category>
		<category><![CDATA[создание веб-страницы]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/?p=102717</guid>
		<description><![CDATA[Научный руководитель: Вильданов Алмаз Нафкатович Уфимский университет науки и технологий, Нефтекамский филиал к.ф.-м.н. &#160; Введение В современном мире эффективное управление данными является неотъемлемой частью успешного ведения бизнеса. Магазины музыкальных инструментов, как и другие коммерческие предприятия, нуждаются в надёжных и удобных системах для хранения и обработки информации о товарах, категориях, ценах и клиентах. Разработка базы данных играет [...]]]></description>
			<content:encoded><![CDATA[<p style="text-align: center;" align="right">Научный руководитель: <em>Вильданов Алмаз Нафкатович<br />
<em>Уфимский университет науки и технологий, Нефтекамский филиал<br />
</em></em><em>к.ф.-м.н.</em></p>
<p>&nbsp;</p>
<p><strong>Введение</strong></p>
<p>В современном мире эффективное управление данными является неотъемлемой частью успешного ведения бизнеса. Магазины музыкальных инструментов, как и другие коммерческие предприятия, нуждаются в надёжных и удобных системах для хранения и обработки информации о товарах, категориях, ценах и клиентах. Разработка базы данных играет ключевую роль в автоматизации этих процессов, позволяя организовать работу с большими объёмами данных и упростить управление магазином.</p>
<p>В этой статье мы рассмотрим процесс создания базы данных для интернет-магазина музыкальных инструментов с использованием MySQL и PHP. Мы изучим ключевые этапы разработки: от проектирования структуры таблиц до интеграции базы данных с веб-интерфейсом. Также будет показано, как с помощью MySQL и PHP можно обеспечить удобный ввод, хранение и вывод данных на веб-страницу, что позволит создать полноценный каталог товаров и организовать их эффективное управление.</p>
<p>В данной статье рассматривается процесс разработки веб-страницы с формой для добавления данных в базу данных «Музыкальные инструменты». Этот процесс включает несколько ключевых этапов:</p>
<p><strong>1. Создание базы данных</strong>:</p>
<ul>
<li>Регистрация на бесплатном хостинге Hostland.ru для размещения проекта.</li>
<li>Настройка базы данных и создание таблицы через интерфейс phpMyAdmin.</li>
</ul>
<p><strong>2. Подключение к базе данных</strong>:</p>
<ul>
<li>Разработка PHP-скрипта data.php для подключения к базе данных с использованием класса PDO, обеспечивающего безопасное и эффективное взаимодействие с MySQL.</li>
</ul>
<p><strong>3. Создание основной страницы для вывода данных</strong>:</p>
<ul>
<li>Разработка страницы index.php, которая отображает данные из таблицы clothes, предоставляя пользователю доступ к информации в базе.</li>
</ul>
<p><strong>4. Создание формы для поиска данных</strong>:</p>
<ul>
<li>Создание страницы index2.php, включающей HTML-форму для поиска данных и соответствующий PHP-скрипт, который обрабатывает запросы и ищет информацию в базе данных.</li>
</ul>
<p><strong>5. Визуальное оформление</strong>:</p>
<ul>
<li>Разработка файла стилей style.css, который улучшает внешний вид веб-страницы и придает ей аккуратный и современный дизайн.</li>
</ul>
<p>После выполнения всех этих шагов была создана полноценная веб-страница, которая позволяет пользователям осуществлять поиск мужской одежды в базе данных и удобно отображать результаты в табличной форме.</p>
<p><strong>Создание базы данных</strong></p>
<p>Информационные системы, основанные на MySQL, по-прежнему пользуются большим спросом и занимают ключевые позиции в мире технологий. MySQL зарекомендовал себя как надежное и масштабируемое решение для управления данными, что делает его одним из фаворитов среди веб-разработчиков. Благодаря отличной производительности, устойчивости к нагрузкам и широкой поддержке сообщества MySQL остается предпочтительным выбором для множества современных веб-приложений, включая интернет-магазины и корпоративные платформы. Его гибкость и стабильность продолжают привлекать разработчиков, стремящихся создавать эффективные и долговечные решения. Рассмотрим пример структуры базы данных музыкальных инструментов.</p>
<p>Таблица &#8220;instuments&#8221; :</p>
<ul>
<li>instrument_id (INT, PRIMARY KEY): уникальный идентификатор музыкального инструмента.</li>
<li>name (VARCHAR(255), NOT NULL): название музыкального инструмента.</li>
<li>category_id (INT): идентификатор категории музыкального инструмента, связанный с таблицей &#8220;instrument_categories&#8221;.</li>
<li>type (ENUM(&#8216;Струнный&#8217;, &#8216;Духовой&#8217;, &#8216;Ударный&#8217;, &#8216;Электронный&#8217;)): тип музыкального инструмента.</li>
<li>manufacturing_date (DATE): дата изготовления музыкального инструмента.</li>
<li>description (TEXT): описание музыкального инструмента.</li>
<li>price (INT): цена музыкального инструмента.</li>
</ul>
<p>Таблица &#8220;instrument_categories&#8221;:</p>
<ul>
<li>category_id (INT, PRIMARY KEY): уникальный идентификатор категории музыкальных инструментов.</li>
<li>category_name (VARCHAR(255), NOT NULL): название категории музыкальных инструментов.</li>
<li>description (TEXT): описание категории музыкальных инструментов.</li>
</ul>
<p>Процесс добавления данных реализуется с помощью функции «вставить», как показано на рис. 1. Для этого пользователь выбирает соответствующую опцию в меню, после чего открывается форма для ввода информации. В каждое поле этой формы необходимо внести требуемые значения. После завершения ввода и отправки формы данные автоматически сохраняются в базе. Результат успешного добавления мгновенно отображается на экране, подтверждая правильность операции.</p>
<p><a href="https://web.snauka.ru/issues/2024/10/102717/1-752" rel="attachment wp-att-102721"><img class="alignnone size-full wp-image-102721 aligncenter" src="https://web.snauka.ru/wp-content/uploads/2024/10/1.png" alt="" width="776" height="425" /></a></p>
<p align="center">Рис. 1. Вставка данных в таблицу</p>
<p>&nbsp;</p>
<p>Далее возвращаемся на сайт Hostland.ru и переходим в раздел «Файлы | FTP». Там находим и выбираем опцию «Файловый менеджер», которая находится чуть ниже. В файловом менеджере открываем папку «www» и создаём в ней новую директорию с именем «connection». Внутри этой папки создаём файл с именем data.php. В этот файл вставляем заранее подготовленный код.</p>
<p>Весь процесс создания папки и добавления кода наглядно показан на рисунке 2.</p>
<p style="text-align: center;"> <a href="https://web.snauka.ru/issues/2024/10/102717/2-495" rel="attachment wp-att-102722"><img src="https://web.snauka.ru/wp-content/uploads/2024/10/2.png" alt="" width="780" height="247" /></a></p>
<p align="center">Рис. 2. Подключение к БД</p>
<p>На месте «host1874466_1» и «12345» вводим свои данные.</p>
<p>Затем возвращаемся назад в папку «www» и создаём файл index.php и вводим этот код (рисунок 3) с помощью этого файла мы выводим две наши таблицы&#8221;instuments&#8221; и  &#8220;instrument_categories&#8221;:</p>
<p><a href="https://web.snauka.ru/issues/2024/10/102717/3-391" rel="attachment wp-att-102723"><img class="alignnone size-full wp-image-102723 aligncenter" src="https://web.snauka.ru/wp-content/uploads/2024/10/3.png" alt="" width="421" height="653" /></a></p>
<p style="text-align: center;">Рис. 3. Вывод таблиц на сайте</p>
<p>В случае необходимости в отступе, вводим &lt;br /&gt; между кодами вывода наших таблиц (пример разницы на рисунках 4 и 5).</p>
<p align="center"> <a href="https://web.snauka.ru/issues/2024/10/102717/4-303" rel="attachment wp-att-102724"><img class="aligncenter size-full wp-image-102724" src="https://web.snauka.ru/wp-content/uploads/2024/10/4.png" alt="" width="1017" height="291" /></a></p>
<p align="center">Рис. 4. Таблицы без отступа</p>
<p align="center"> <a href="https://web.snauka.ru/issues/2024/10/102717/5-205" rel="attachment wp-att-102725"><img class="aligncenter size-full wp-image-102725" src="https://web.snauka.ru/wp-content/uploads/2024/10/5.png" alt="" width="1021" height="303" /></a></p>
<p style="text-align: center;">Рис. 5. Таблицы с отступами</p>
<p><strong>Заключение</strong></p>
<p>Этот пример демонстрирует ключевые принципы взаимодействия с базами данных и формами на PHP, что может стать отличным фундаментом для разработки разнообразных веб-приложений. Проект легко поддается модификации и масштабированию в зависимости от требований — можно добавлять новые возможности и совершенствовать уже существующие функции.</p>
<p>В итоге можно сказать, что связка MySQL и PHP представляет собой мощный инструмент, который не только упрощает создание веб-приложений, но и позволяет эффективно управлять данными. В будущем для повышения безопасности и производительности стоит рассмотреть возможность использования более продвинутых подходов, таких как внедрение ORM (объектно-реляционного отображения), добавление систем аутентификации и авторизации пользователей, а также оптимизация SQL-запросов.</p>
<p>Мы надеемся, что этот материал окажется полезным как для начинающих веб-разработчиков, так и для более опытных специалистов, желающих найти практические примеры работы с PHP в реальных проектах.</p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2024/10/102717/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Разработка веб-приложения для каталога косметики</title>
		<link>https://web.snauka.ru/issues/2025/02/103085</link>
		<comments>https://web.snauka.ru/issues/2025/02/103085#comments</comments>
		<pubDate>Mon, 24 Feb 2025 04:33:54 +0000</pubDate>
		<dc:creator>Пальгова Полина Павловна</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[MySQL]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[база данных]]></category>
		<category><![CDATA[каталог мужской одежды]]></category>
		<category><![CDATA[разработка веб-страницы]]></category>
		<category><![CDATA[форма добавления данных]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/issues/2025/02/103085</guid>
		<description><![CDATA[Научный руководитель: Вильданов Алмаз Нафкатович к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал Введение Сегодня MySQL – это одна из самых популярных систем управления базами данных (СУБД), которая идеально подходит для начинающих разработчиков. Она является бесплатной и открытой, что делает её отличным выбором для тех, кто только начинает изучать базы данных. MySQL известна своей простотой в установке [...]]]></description>
			<content:encoded><![CDATA[<p style="background: white; text-align: center;">Научный руководитель: <em>Вильданов Алмаз Нафкатович<br />
</em><em>к.ф.-м.н., </em><em>Уфимский университет науки и технологий, Нефтекамский филиал</em></p>
<p style="text-align: right; background: white;">
<p style="text-align: justify;"><span><strong>Введение<br />
</strong></span></p>
<p style="text-align: justify;"><span>Сегодня MySQL – это одна из самых популярных систем управления базами данных (СУБД), которая идеально подходит для начинающих разработчиков. Она является бесплатной и открытой, что делает её отличным выбором для тех, кто только начинает изучать базы данных. MySQL известна своей простотой в установке и использовании, поэтому студент может быстро освоить её основные принципы.<br />
</span></p>
<p style="text-align: justify;"><span>Для начинающих разработчиков MySQL становится важным инструментом, так как она позволяет эффективно работать с большими объёмами данных. Она поддерживает множество типов данных и функций, что помогает создать полноценные базы для различных веб-приложений. Например, студент может легко организовать хранение данных для блога, интернет-магазина или учебного портала.<br />
</span></p>
<p style="text-align: justify;"><span>Одним из ключевых преимуществ MySQL является её тесная интеграция с PHP – языком программирования, который широко используется для создания динамических веб-сайтов. PHP позволяет взаимодействовать с MySQL, создавая мощные и гибкие веб-приложения. Например, студент может написать скрипт на PHP, который отправляет запросы в базу данных MySQL для получения нужной информации, как, например, список пользователей.<br />
</span></p>
<p style="text-align: justify;"><span>PHP и MySQL работают вместе так, что разработчик может создать интерфейс для взаимодействия с базой данных, где пользователи могут добавлять, редактировать или удалять данные через веб-страницу. Благодаря этой связке студент понимает основы клиент-серверного взаимодействия. Создавая такой проект, студент учится базовым принципам веб-программирования, что будет полезно в будущей карьере.<br />
</span></p>
<p style="text-align: justify;"><span>Процесс создания веб-приложения с использованием MySQL и PHP интуитивно понятен. Студент начинает с установки локального веб-сервера, например XAMPP, который поддерживает как PHP, так и MySQL. Далее, он создаёт базу данных, пишет код на PHP для работы с ней, и уже через несколько шагов у него готово полноценное веб-приложение.<br />
</span></p>
<p style="text-align: justify;"><span>Когда проект завершён, следующим важным шагом становится размещение приложения в интернете. Для этого студент может зарегистрироваться на одном из популярных хостингов, например, Hostland. Этот хостинг предоставляет удобный интерфейс для работы с базами данных MySQL и поддерживает PHP, что делает его подходящим выбором для новичков.<br />
</span></p>
<p style="text-align: justify;"><span>После того, как студент загружает свой проект на Hostland, его приложение становится доступным для пользователей по всему миру. База данных MySQL теперь подключена к интернету, что позволяет приложению работать в режиме онлайн, предоставляя данные из любой точки мира.<br />
</span></p>
<p style="text-align: justify;"><span>Hostland также предлагает инструменты для управления базами данных, которые позволяют студенту легко обновлять или изменять свою базу данных, не погружаясь в сложные команды. Это упрощает процесс администрирования и делает обучение более комфортным.<br />
</span></p>
<p style="text-align: justify;"><span>В данной статье рассматривается процесс разработки веб-страницы с формой для добавления данных в базу данных «Каталог мужской одежды». Этот процесс включает несколько ключевых этапов:<br />
</span></p>
<ul>
<li>
<div><span><strong>Создание базы данных</strong>:<br />
</span></div>
<ul>
<li><span>Регистрация на бесплатном хостинге hostland.ru.<br />
</span></li>
<li><span>Создание базы данных и таблицы в phpMyAdmin.<br />
</span></li>
</ul>
</li>
<li>
<div><span><strong>Разработка подключения к базе данных</strong>:<br />
</span></div>
<ul>
<li><span>Создание PHP-файла </span><span>data.php</span><span> для подключения к базе данных с использованием класса </span><span>PDO</span><span>.<br />
</span></li>
</ul>
</li>
<li>
<div><span><strong>Создание основной страницы для отображения данных</strong>:<br />
</span></div>
<ul>
<li><span>Создание файла </span><span>index.php</span><span>, который выводит данные из таблицы </span><span>cosmetics</span><span>.<br />
</span></li>
</ul>
</li>
<li>
<div><span><strong>Создание формы поиска данных</strong>:<br />
</span></div>
<ul>
<li><span>Создание файла </span><span>index2.php</span><span>, который содержит HTML-форму поиска данных и PHP-скрипт для поиска этих данных в базе данных.<br />
</span></li>
</ul>
</li>
<li>
<div><span><strong>Декоративное оформление</strong>:<br />
</span></div>
<ul>
<li><span>Создание файла стилей </span><span>style.css</span><span> для улучшения внешнего вида веб-страниц.<br />
</span></li>
</ul>
</li>
</ul>
<p style="text-align: justify;"><span>В результате выполнения всех шагов, описанных в статье, мы получили полностью функционирующую веб-страницу, которая позволяет производить поиск мужской одежды в базе данных и отображать их в удобном табличном формате.<br />
</span></p>
<p><span><strong>Разработка базы данных<br />
</strong></span></p>
<p style="text-align: justify;"><span>Информационные системы, использующие MySQL, остаются востребованными и широко распространены [1]. MySQL представляет собой надежное и масштабируемое решение для хранения данных, что делает его популярным выбором среди веб-разработчиков. Многие современные веб-приложения, такие как интернет-магазины и корпоративные системы, продолжают предпочитать MySQL из-за его высокой производительности, надежности и поддержки со стороны разработчиков.<br />
</span></p>
<p style="text-align: justify;"><span>Для разработки базы данных каталога косметики, сначала необходимо продумать структуру будущей базы данных. Это включает в себя определение таблиц, их полей и связей между ними. Рассмотрим пример структуры базы данных для каталога косметики.<br />
</span></p>
<p><span>Таблица Сosmetics (Косметика):<br />
</span></p>
<ul>
<li><span>id (INT): Уникальный идентификатор.<br />
</span></li>
<li><span>title (VARCHAR(220)): Название товара.<br />
</span></li>
<li><span>delivery (INT): Срок доставки.<br />
</span></li>
<li><span>fabrica (ENUM(3Deluxe, Aravia, CEHKO, Estel)): Производитель.<br />
</span></li>
<li><span>Before date (date): Срок годности.<br />
</span></li>
<li><span>cost (INT): Цена.<br />
</span></li>
<li><span>id cat (int): Категория.<br />
</span></li>
</ul>
<p style="text-align: justify;"><span>Таблица cats (Категории товаров):<br />
</span></p>
<ul>
<li><span>id_cat (INT): Уникальный идентификатор категории.<br />
</span></li>
<li><span>name (VARCHAR(255)): Название категории.<br />
</span></li>
<li>
<div><span>descr (TEXT): Описание категории.<br />
</span></div>
</li>
</ul>
<p style="text-align: justify;"><span>Добавление данных осуществляется через функцию «вставить» [3]. Этот процесс проиллюстрирован на рис. 1. Пользователь должен выбрать опцию «вставить» в меню. Далее, открывается форма для ввода данных. В поля формы вводятся необходимые значения. После заполнения формы, данные сохраняются в таблице.<br />
</span></p>
<p style="text-align: justify;"><span>Результат добавления данных отображается на экране.<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2025/02/022425_0427_1.png" alt="" /></p>
<p style="text-align: center;"><span>Рис. 1. Вставка данных в таблицу<br />
</span></p>
<p style="text-align: justify;"><span>Затем возвращаемся на сайт Hostland.ru и заходим во вкладку «файлы | FTP». Выбираем опцию «Файловый менеджер», расположенную немного ниже. Переходим в папку «www» и создаём новую папку с названием «connection». Внутри этой папки создаём файл data.php. В этот файл необходимо вставить предоставленный код.<br />
</span></p>
<p style="text-align: justify;"><span>Процесс создания и вставки кода иллюстрирован на рисунке 2.<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2025/02/022425_0427_2.png" alt="" /></p>
<p style="text-align: center;"><span>Рис. 2. Подключение к БД<br />
</span></p>
<p><span><br />
Указываем имя БД, пользователя и пароль.<br />
</span></p>
<p style="text-align: justify;"><span>Возвращаемся назад в папку «www» и создаём файл index.php и вставляем этот код (рисунок 3):<br />
</span></p>
<p style="text-align: center;"><span><br />
<img src="https://web.snauka.ru/wp-content/uploads/2025/02/022425_0427_3.png" alt="" /><br />
Рис. 3. Вывод таблицы на сайте<br />
</span></p>
<p style="text-align: justify;"><span>С помощью таблицы стилей CSS проведем оформление таблиц. Результат представлен на экране (рисунок 4):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2025/02/022425_0427_4.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рис. 4. Демонстрация вывода базы данных на сайте<br />
</span></p>
<p style="text-align: justify;"><span>Создаём последний файл «index2.php», это форма для поиска данных в таблицу и вставляем данный код (рис. 5):<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2025/02/022425_0427_5.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span>Рис. 5. Код формы поиска</span></p>
<p>&nbsp;</p>
<p><span>В конечном итоге получается сайт такого формата (рисунок 6):<br />
</span></p>
<p style="text-align: center;"><span><br />
<img src="https://web.snauka.ru/wp-content/uploads/2025/02/022425_0427_6.png" alt="" /><br />
Рис. 6. Демонстрация формы поиска<br />
</span></p>
<p><span><strong>Заключение<br />
</strong></span></p>
<p style="text-align: justify;"><span>Данный пример иллюстрирует основные принципы работы с базами данных и формами на PHP, что может быть полезно при создании различных веб-приложений. Этот проект можно расширять и модифицировать в зависимости от потребностей, добавляя новые функции и улучшая существующие.<br />
</span></p>
<p style="text-align: justify;"><span>Благодаря использованию MySQL и PHP студент получает ценную практику в разработке реальных веб-приложений, учится работать с запросами, формами и системами аутентификации пользователей. Такой подход помогает быстрее освоить базовые концепции веб-разработки и лучше понять, как работают динамические сайты.<br />
</span></p>
<p style="text-align: justify;"><span>В завершение, можно сказать, что MySQL и PHP – это мощная связка технологий, которая не только помогает создавать веб-приложения, но и учит управлять данными.<br />
</span></p>
<p style="text-align: justify;"><span>В перспективе, для повышения безопасности и производительности, можно рассмотреть использование более сложных технологий и подходов, таких как применение ORM (объектно-реляционное отображение), внедрение системы аутентификации и авторизации пользователей, а также оптимизация запросов к базе данных.<br />
</span></p>
<p style="text-align: justify;"><span>Мы надеемся, что данный материал будет полезен как начинающим веб-разработчикам, так и более опытным специалистам, ищущим практические примеры реализации веб-приложений на PHP.</span></p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2025/02/103085/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Разработка интерактивной формы заказа блюд с использованием HTML и PHP</title>
		<link>https://web.snauka.ru/issues/2025/06/103504</link>
		<comments>https://web.snauka.ru/issues/2025/06/103504#comments</comments>
		<pubDate>Fri, 20 Jun 2025 16:25:59 +0000</pubDate>
		<dc:creator>Ямалова Алия Рамилевна</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[безопасность]]></category>
		<category><![CDATA[веб-разработка]]></category>
		<category><![CDATA[заказ блюд]]></category>
		<category><![CDATA[интерактивность]]></category>
		<category><![CDATA[обработка данных]]></category>
		<category><![CDATA[форма]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/issues/2025/06/103504</guid>
		<description><![CDATA[Научный руководитель: Вильданов Алмаз Нафкатович к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал &#160; В данной статье будет описан процесс создания простой веб-формы с использованием выпадающего списка (select). Форма будет отправлять данные на сервер, где они будут обрабатываться с помощью PHP. Это может быть полезно для создания интерактивных форм, таких как заказ блюд в ресторане или выбор [...]]]></description>
			<content:encoded><![CDATA[<p style="text-align: center;" align="right"><em>Научный руководитель: Вильданов Алмаз Нафкатович<strong></strong></em></p>
<p style="text-align: center;" align="right"><em>к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал</em></p>
<p>&nbsp;</p>
<p>В данной статье будет описан процесс создания простой веб-формы с использованием выпадающего списка (select). Форма будет отправлять данные на сервер, где они будут обрабатываться с помощью PHP. Это может быть полезно для создания интерактивных форм, таких как заказ блюд в ресторане или выбор параметров в любой другой онлайн-системе.</p>
<p>Для реализации этой задачи используются следующие технологии:</p>
<p>HTML — язык разметки для создания структуры страницы.</p>
<p>CSS — язык стилей для оформления внешнего вида.</p>
<p>JavaScript — необязательный компонент, но может быть использован для добавления динамических функций.</p>
<p>PHP — серверный язык программирования для обработки данных, переданных через форму.</p>
<p>&nbsp;</p>
<p>Шаг 1: Создание HTML-формы</p>
<p>Первым шагом является создание HTML-формы с выпадающим списком. Ниже приведен пример кода:</p>
<div style="background-color: #d3d3d3;">
<p>&lt;!DOCTYPE html&gt;&lt;html lang=&#8221;ru&#8221;&gt;</p>
<p>&lt;head&gt;</p>
<p style="padding-left: 30px;">&lt;meta charset=&#8221;UTF-8&#8243;&gt;</p>
<p style="padding-left: 30px;">&lt;meta name=&#8221;viewport&#8221; content=&#8221;width=device-width, initial-scale=1.0&#8243;&gt;</p>
<p style="padding-left: 30px;">&lt;title&gt;Форма с выпадающим списком&lt;/title&gt;</p>
<p>&lt;/head&gt;</p>
<p>&lt;body&gt;</p>
<p style="padding-left: 30px;">&lt;h1&gt;Выберите блюдо&lt;/h1&gt;</p>
<p style="padding-left: 30px;">&lt;form method=&#8221;post&#8221; action=&#8221;"&gt;</p>
<p style="padding-left: 60px;">&lt;label for=&#8221;dinner&#8221;&gt;Выберите блюдо:&lt;/label&gt;&lt;br&gt;</p>
<p style="padding-left: 60px;">&lt;select name=&#8221;dinner&#8221; id=&#8221;dinner&#8221;&gt;</p>
<p style="padding-left: 90px;">&lt;option value=&#8221;" disabled selected&gt;Выберите блюдо&lt;/option&gt;</p>
<p style="padding-left: 90px;">&lt;option value=&#8221;Каша&#8221;&gt;Каша&lt;/option&gt;</p>
<p style="padding-left: 90px;">&lt;option value=&#8221;Винегрет&#8221;&gt;Винегрет&lt;/option&gt;</p>
<p style="padding-left: 90px;">&lt;option value=&#8221;Пирог&#8221;&gt;Пирог&lt;/option&gt;</p>
<p style="padding-left: 90px;">&lt;option value=&#8221;Компот&#8221;&gt;Компот&lt;/option&gt;</p>
<p style="padding-left: 60px;">&lt;/select&gt;&lt;br&gt;&lt;br&gt;</p>
<p style="padding-left: 60px;">&lt;input type=&#8221;submit&#8221; value=&#8221;Отправить&#8221;&gt;</p>
<p style="padding-left: 30px;">&lt;/form&gt;</p>
</div>
<p>Появиться выпадающий список (рисунок 1).</p>
<p align="center"> <img src="https://web.snauka.ru/wp-content/uploads/2025/07/070225_1313_1.png" alt="" /></p>
<p align="center"><em>Рисунок 1. Выпадающий список</em></p>
<div style="background-color: #d3d3d3;">
<p style="padding-left: 30px;">&lt;?php // Обработка данных формы</p>
<p style="padding-left: 30px;">if (isset($_POST["dinner"])) {</p>
<p style="padding-left: 60px;">echo &#8220;&lt;p&gt;Мой заказ: &#8221; . htmlspecialchars($_POST["dinner"]) . &#8220;&lt;/p&gt;&#8221;;</p>
<p style="padding-left: 30px;">}</p>
<p style="padding-left: 30px;">?&gt;</p>
<p>&lt;/body&gt;</p>
<p>&lt;/html&gt;</p>
</div>
<p>Описание кода:</p>
<p>&lt;form&gt; : Элемент формы, который определяет метод отправки (method=&#8221;post&#8221;) и адрес обработчика (action=&#8221;" — текущая страница).</p>
<p>&lt;select&gt; : Выпадающий список с несколькими вариантами (&lt;option&gt;).</p>
<p>Первый &lt;option&gt; имеет атрибут disabled и selected, чтобы он был дефолтным значением и недоступным для выбора.</p>
<p>&lt;input type=&#8221;submit&#8221;&gt; : Кнопка для отправки формы.</p>
<p>PHP-обработка : Если форма была отправлена, PHP проверяет наличие данных из поля dinner и выводит их на экран.</p>
<p>&nbsp;</p>
<p>Шаг 2: Обработка данных на сервере (PHP)</p>
<p>PHP используется для обработки данных, переданных через форму. В данном случае, если пользователь выбрал блюдо и нажал кнопку &#8220;Отправить&#8221;, PHP выведет сообщение с выбранным блюдом (рисунок 2).</p>
<div style="background-color: #d3d3d3;">
<p>&lt;?php</p>
<p>if (isset($_POST["dinner"])) {</p>
<p style="padding-left: 30px;">echo &#8220;&lt;p&gt;Мой заказ: &#8221; . htmlspecialchars($_POST["dinner"]) . &#8220;&lt;/p&gt;&#8221;;</p>
<p>}</p>
<p>?&gt;</p>
</div>
<p>isset($_POST["dinner"]) : Проверяет, была ли передана переменная dinner.</p>
<p>htmlspecialchars() : Защищает от XSS-атак, преобразуя специальные символы в HTML-сущности.</p>
<p align="center"> <img src="https://web.snauka.ru/wp-content/uploads/2025/07/070225_1313_2.png" alt="" /></p>
<p align="center">Рисунок 2 &#8211; Кнопка &#8220;Отправить&#8221;</p>
<p>&nbsp;</p>
<p>Шаг 3: Отображение результата</p>
<p>После отправки формы пользователь увидит выбранное блюдо на странице. Например, если выбрано &#8220;Пирог&#8221;, результат будет выглядеть так (рисунок 3):</p>
<p>Мой заказ: Пирог</p>
<p align="center"> <img src="https://web.snauka.ru/wp-content/uploads/2025/07/070225_1313_3.png" alt="" /></p>
<p align="center">Рисунок 3. Результат</p>
<p>В данной статье был описан процесс создания простой формы с выпадающим списком на HTML и PHP. Такая форма может быть использована для различных целей, таких как заказ товаров, выбор параметров или любых других ситуаций, где необходимо предоставить пользователю возможность выбрать один из нескольких вариантов.</p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2025/06/103504/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Создание формы отзыва с использованием HTML и PHP</title>
		<link>https://web.snauka.ru/issues/2025/06/103505</link>
		<comments>https://web.snauka.ru/issues/2025/06/103505#comments</comments>
		<pubDate>Mon, 30 Jun 2025 16:26:02 +0000</pubDate>
		<dc:creator>Шарифуллин Ильназ Зимфирович</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[безопасность ввода]]></category>
		<category><![CDATA[веб-разработка]]></category>
		<category><![CDATA[интерактивные формы]]></category>
		<category><![CDATA[обработка данных]]></category>
		<category><![CDATA[обратная связь]]></category>
		<category><![CDATA[форма отзыва]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/issues/2025/06/103505</guid>
		<description><![CDATA[Научный руководитель: Вильданов Алмаз Нафкатович к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал &#160; В современном веб-разработке часто возникает необходимость создавать интерактивные формы для сбора информации от пользователей. Одним из распространенных примеров является форма отзыва, которая позволяет пользователям оставить свои комментарии или предложения на сайте. В данной статье мы рассмотрим процесс создания простой формы отзыва с использованием [...]]]></description>
			<content:encoded><![CDATA[<p style="text-align: center;" align="right"><em>Научный руководитель: Вильданов Алмаз Нафкатович</em></p>
<p style="text-align: center;" align="right"><em>к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал</em></p>
<p>&nbsp;</p>
<p>В современном веб-разработке часто возникает необходимость создавать интерактивные формы для сбора информации от пользователей. Одним из распространенных примеров является форма отзыва, которая позволяет пользователям оставить свои комментарии или предложения на сайте. В данной статье мы рассмотрим процесс создания простой формы отзыва с использованием HTML и PHP.</p>
<p>Целью данной статьи является описание шаг-by-шагового процесса создания формы отзыва, которая будет принимать данные от пользователя (отзыв и имя) и выводить их на экран после отправки. Мы также обсудим основные требования к форме и реализацию их с помощью соответствующих технологий.</p>
<p>Необходимо создать форму отзыва, состоящую из:</p>
<ol start="1">
<li>Текстового поля (textarea) для ввода отзыва.</li>
<li>Поля ввода имени (input).</li>
<li>Кнопки отправки данных.</li>
</ol>
<p>Требования к форме:</p>
<ul>
<li>Поле для имени должно быть обязательным для заполнения.</li>
<li>Поле для отзыва должно иметь подсказку текста.</li>
<li>Данные должны отправляться методом POST.</li>
<li>После отправки формы должен выводиться отзыв и имя автора.</li>
</ul>
<p>Шаг 1: Создание HTML-структуры формы</p>
<p>Первым шагом является создание HTML-кода для формы отзыва. Мы будем использовать тег &lt;form&gt; для определения формы, а также элементы &lt;textarea&gt; и &lt;input&gt; для ввода данных.</p>
<div style="background-color: #d3d3d3;">
&lt;!DOCTYPE html&gt;</p>
<p>&lt;html lang=&#8221;ru&#8221;&gt;</p>
<p>&lt;head&gt;</p>
<p style="padding-left: 30px;">&lt;meta charset=&#8221;UTF-8&#8243;&gt;</p>
<p style="padding-left: 30px;">&lt;title&gt;Форма отзыва&lt;/title&gt;</p>
<p>&lt;/head&gt;</p>
<p>&lt;body&gt;</p>
<p style="padding-left: 30px;">&lt;h1&gt;Оставьте свой отзыв&lt;/h1&gt;</p>
<p style="padding-left: 30px;">&lt;form method=&#8221;POST&#8221; action=&#8221;"&gt;</p>
<p style="padding-left: 60px;">&lt;!&#8211; Текстовое поле для отзыва &#8211;&gt;</p>
<p style="padding-left: 60px;">&lt;label for=&#8221;summary&#8221;&gt;Ваш отзыв:&lt;/label&gt;&lt;br&gt;</p>
<p style="padding-left: 60px;">&lt;textarea id=&#8221;summary&#8221; name=&#8221;summary&#8221; placeholder=&#8221;Введите ваш отзыв&#8221; required&gt;&lt;/textarea&gt;&lt;br&gt;</p>
<p style="padding-left: 60px;">
<p style="padding-left: 60px;">&lt;!&#8211; Поле ввода имени &#8211;&gt;</p>
<p style="padding-left: 60px;">&lt;label for=&#8221;surname&#8221;&gt;Ваше имя:&lt;/label&gt;&lt;br&gt;</p>
<p style="padding-left: 60px;">&lt;input type=&#8221;text&#8221; id=&#8221;surname&#8221; name=&#8221;surname&#8221; placeholder=&#8221;Введите ваше имя&#8221; required&gt;&lt;br&gt;</p>
<p style="padding-left: 60px;">
<p style="padding-left: 60px;">&lt;!&#8211; Кнопка отправки &#8211;&gt;</p>
<p style="padding-left: 60px;">&lt;button type=&#8221;submit&#8221;&gt;Отправить&lt;/button&gt;</p>
<p style="padding-left: 30px;">&lt;/form&gt;</p>
<p style="padding-left: 30px;">
<p style="padding-left: 30px;">&lt;!&#8211; Место для вывода отзыва &#8211;&gt;</p>
<p style="padding-left: 30px;">&lt;div id=&#8221;response&#8221;&gt;&lt;/div&gt;</p>
<p>&lt;/body&gt;</p>
<p>&lt;/html&gt;</p>
</div>
<p>&nbsp;</p>
<p>Объяснение кода:</p>
<ul>
<li>Тег &lt;form&gt; : Определяет форму с методом отправки данных POST и действием (action), указанным как текущая страница (&#8220;&#8221;).</li>
<li>Тег &lt;textarea&gt; : Используется для ввода многострочного текста. Атрибут placeholder содержит подсказку для пользователя, а required делает это поле обязательным для заполнения.</li>
<li>Тег &lt;input&gt; : Используется для ввода имени пользователя. Также имеет атрибуты placeholder и required.</li>
<li>Кнопка &lt;button&gt; : Отвечает за отправку данных формы.</li>
</ul>
<p>&nbsp;</p>
<p>Шаг 2: Обработка данных с помощью PHP</p>
<p>Для обработки данных, переданных формой, мы используем PHP. После отправки формы данные будут доступны через глобальный массив $_POST. Мы проверим, были ли переданы данные, и если да, то выведем их на экран.</p>
<div style="background-color: #d3d3d3;">
&lt;?php</p>
<p>// Проверяем, были ли отправлены данные формы</p>
<p>if (isset($_POST["surname"]) &amp;&amp; isset($_POST["summary"])) {</p>
<p style="padding-left: 30px;">// Получаем данные из POST-запроса</p>
<p style="padding-left: 30px;">$name = htmlspecialchars($_POST["surname"]);</p>
<p style="padding-left: 30px;">$review = htmlspecialchars($_POST["summary"]);</p>
<p style="padding-left: 30px;">
<p style="padding-left: 30px;">// Выводим отзыв и имя автора</p>
<p style="padding-left: 30px;">echo &#8220;&lt;p&gt;Ваш отзыв: &#8221; . $review . &#8220;&lt;/p&gt;&#8221;;</p>
<p style="padding-left: 30px;">echo &#8220;&lt;p&gt;Автор: &#8221; . $name . &#8220;&lt;/p&gt;&#8221;;</p>
<p>}</p>
<p>?&gt;</p>
</div>
<p>Объяснение кода:</p>
<ol start="1">
<li>Проверка наличия данных : Функция isset() используется для проверки, были ли переданы значения полей surname и summary.</li>
<li>Обработка данных : Функция htmlspecialchars() применяется для экранизации специальных символов в данных, что предотвращает XSS-атаки.</li>
<li>Вывод данных : Если данные были успешно получены, они выводятся на экран в виде сообщения.</li>
</ol>
<p>Шаг 3: Интеграция PHP в HTML</p>
<p>Чтобы форма работала корректно, необходимо поместить PHP-код непосредственно в HTML-файл. Это можно сделать, сохраняя файл с расширением .php вместо .html.</p>
<p>&nbsp;</p>
<p>После выполнения всех шагов у нас получится работающая форма отзыва. При отправке данных форма будет проверять, были ли заполнены все обязательные поля, и затем выводить отзыв и имя автора на экран.</p>
<p>В данной статье мы разобрали процесс создания простой формы отзыва с использованием HTML и PHP. Были описаны основные требования к форме и показано, как обрабатывать данные с помощью PHP. Такая форма может быть легко интегрирована в любое веб-приложение для сбора обратной связи от пользователей.</p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2025/06/103505/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Разработка игры «Музыкальная студия» для развития навыков распознавания музыкальных инструментов</title>
		<link>https://web.snauka.ru/issues/2026/01/104128</link>
		<comments>https://web.snauka.ru/issues/2026/01/104128#comments</comments>
		<pubDate>Fri, 23 Jan 2026 14:34:41 +0000</pubDate>
		<dc:creator>Незванов Александр Алексеевич</dc:creator>
				<category><![CDATA[05.00.00 ТЕХНИЧЕСКИЕ НАУКИ]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[веб-технологии]]></category>
		<category><![CDATA[геймификация]]></category>
		<category><![CDATA[интерактивная игра]]></category>
		<category><![CDATA[музыкальные инструменты]]></category>
		<category><![CDATA[обучение через игру]]></category>

		<guid isPermaLink="false">https://web.snauka.ru/issues/2026/01/104128</guid>
		<description><![CDATA[Научный руководитель: Вильданов Алмаз Нафкатович к.ф.-м.н., Уфимский университет науки и технологий, Нефтекамский филиал В условиях цифровизации образования возрастает роль интерактивных и мультимедийных средств обучения. Одним из перспективных направлений является геймификация — применение игровых механик в неигровых контекстах, в том числе в образовании. Музыкальное воспитание, особенно на ранних этапах, требует развития слухового внимания, визуального узнавания и ассоциативного мышления. [...]]]></description>
			<content:encoded><![CDATA[<p style="background: white; text-align: center;"><em>Научный руководитель: </em><em><span>Вильданов Алмаз Нафкатович<br />
</span></em><em><span>к.ф.-м.н., </span></em><em>Уфимский университет науки и технологий, Нефтекамский филиал</em></p>
<p style="text-align: justify;"><span>В условиях цифровизации образования возрастает роль интерактивных и мультимедийных средств обучения. Одним из перспективных направлений является геймификация — применение игровых механик в неигровых контекстах, в том числе в образовании. Музыкальное воспитание, особенно на ранних этапах, требует развития слухового внимания, визуального узнавания и ассоциативного мышления. В этой связи разработка простых, но эффективных обучающих игр становится актуальной задачей.<br />
</span></p>
<p style="text-align: justify;"><span>Целью данной работы является создание веб-приложения «Музыкальная студия», позволяющего пользователю тренировать навыки распознавания музыкальных инструментов по их изображениям. Игра предназначена для широкой аудитории — от детей до взрослых, интересующихся музыкой или изучающих её основы.<br />
</span></p>
<p style="text-align: justify;"><span>Для реализации проекта были использованы технологии HTML5, CSS3 и JavaScript (ES6). Визуальная составляющая включает фоновое изображение студии и отдельные PNG-изображения десяти музыкальных инструментов: акустическая гитара, электрогитара, бас-гитара, ударная установка (бочка и малый барабан), балалайка, коровий бубен, флейта, пианино и саксофон. Все элементы позиционируются абсолютно внутри контейнера с фиксированными размерами (900×600 пикселей), что обеспечивает стабильное отображение на экранах с достаточным разрешением.<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2026/01/012326_1426_1.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 1. Рабочее поле игры<br />
</em></span></p>
<p style="text-align: justify;"><span>Подготовим изображения (рисунок 2). Рисунки лучше подготовить в формате .png, в котором поддерживается прозрачный фон.<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2026/01/012326_1426_2.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 2. Спрайты для игры<br />
</em></span></p>
<p style="text-align: justify;"><span>Логика игры построена следующим образом. При запуске страницы формируется массив из названий инструментов, который перемешивается с помощью алгоритма Фишера–Йейтса:<br />
</span></p>
<p style="text-align: justify;"><span>const MASSIV = [<br />
</span></p>
<p style="text-align: justify;"><span>    "Acoustic-guitar",<br />
</span></p>
<p style="text-align: justify;"><span>    "Electric-guitar",<br />
</span></p>
<p style="text-align: justify;"><span>    "Bass-guitar",<br />
</span></p>
<p style="text-align: justify;"><span>    "Kick",<br />
</span></p>
<p style="text-align: justify;"><span>    "Snare",<br />
</span></p>
<p style="text-align: justify;"><span>    "Balalaika",<br />
</span></p>
<p style="text-align: justify;"><span>    "Cowbell",<br />
</span></p>
<p style="text-align: justify;"><span>    "Flute",<br />
</span></p>
<p style="text-align: justify;"><span>    "Piano",<br />
</span></p>
<p style="text-align: justify;"><span>    "Saxophone"<br />
</span></p>
<p style="text-align: justify;"><span>];<br />
</span></p>
<p style="text-align: justify;"><span>Затем пользователю последовательно предлагается найти на сцене указанный инструмент. После клика по правильному объекту:<br />
</span></p>
<p style="text-align: justify;"><span>— проигрывается звуковой сигнал подтверждения;<br />
</span></p>
<p style="text-align: justify;"><span>— элемент клонируется и заменяется на копию без обработчика события (во избежание повторного нажатия);<br />
</span></p>
<p style="text-align: justify;"><span>— к клону применяется CSS-переход, плавно уменьшающий его прозрачность до нуля.<br />
</span></p>
<p style="text-align: justify;"><span>Этот подход обеспечивает чистоту игрового процесса и визуальную обратную связь. После нахождения всех десяти инструментов выводится сообщение «Вы прошли игру!» и проигрывается финальный звук.<br />
</span></p>
<p style="text-align: center;"><img src="https://web.snauka.ru/wp-content/uploads/2026/01/012326_1426_3.png" alt="" /><span><br />
</span></p>
<p style="text-align: center;"><span><em>Рисунок 3. Окончание игры<br />
</em></span></p>
<p style="text-align: justify;"><span>Преимущества предложенного решения:<br />
</span></p>
<p style="text-align: justify;"><span>— минимальная зависимость от внешних библиотек;<br />
</span></p>
<p style="text-align: justify;"><span>— адаптивность к различным темам (достаточно заменить изображения и массив);<br />
</span></p>
<p style="text-align: justify;"><span>— использование открытых аудио- и графических ресурсов;<br />
</span></p>
<p style="text-align: justify;"><span>— поддержка принципов доступности и простоты интерфейса.<br />
</span></p>
<p style="text-align: justify;"><span>Таким образом, игра «Музыкальная студия» демонстрирует, как базовые веб-технологии могут быть эффективно применены для создания образовательного контента. Подобные приложения могут использоваться как в самостоятельном обучении, так и в рамках школьных или дополнительных образовательных программ по музыке и информатике.</span></p>
]]></content:encoded>
			<wfw:commentRss>https://web.snauka.ru/issues/2026/01/104128/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
