как создать веб приложение с базой данных

Руководство. Создание веб-приложения и моделей данных для EF Database First с помощью ASP.NET MVC

С помощью MVC, Entity Framework и шаблонов ASP.NET можно создать веб-приложение, которое предоставляет интерфейс для существующей базы данных. В этой серии руководств показано, как автоматически создавать код, позволяющий пользователям отображать, изменять, создавать и удалять данные, находящиеся в таблице базы данных. Созданный код соответствует столбцам в таблице базы данных.

В этом учебнике рассматривается создание веб-приложения и создание моделей данных на основе таблиц базы данных.

Изучив это руководство, вы:

предварительные требования

Создание веб-приложения ASP.NET

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Нажмите кнопку ОК.

Проект создается с файлами и папками по умолчанию.

В этом учебнике будет использоваться Entity Framework 6. Вы можете дважды проверить версию Entity Framework в проекте, используя окно Управление пакетами NuGet. При необходимости обновите версию Entity Framework.

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Создание моделей

Теперь в таблицах базы данных будут созданы Entity Framework модели. Эти модели представляют собой классы, которые будут использоваться для работы с данными. Каждая модель отражает таблицу в базе данных и содержит свойства, соответствующие столбцам в таблице.

Щелкните правой кнопкой мыши папку модели и выберите Добавить и новый элемент.

В окне Добавление нового элемента выберите данные в левой области и ADO.NET EDM из параметров в центральной области. Назовите новый файл модели контосомодел.

Нажмите кнопку Добавить.

В мастере EDM выберите элемент конструктор EF из базы данных.

Щелкните Далее.

В окно свойств подключения укажите имя локального сервера, на котором создана база данных (в данном случае — LocalDB) \ProjectsV13). После указания имени сервера выберите Контосауниверситидата из доступных баз данных.

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Нажмите кнопку ОК.

Теперь отображаются правильные свойства соединения. Для соединения в файле Web. config можно использовать имя по умолчанию.

Щелкните Далее.

Выберите последнюю версию Entity Framework.

Щелкните Далее.

Нажмите кнопку Готово.

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

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Папка Models теперь содержит много новых файлов, связанных с моделями, созданными из базы данных.

Прежде чем продолжить работу с этим руководством, выполните сборку проекта. В следующем разделе будет создан код на основе моделей данных, но этот раздел не будет работать, если проект не был построен.

Дальнейшие действия

Изучив это руководство, вы:

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

Источник

Apache NetBeans 12.5

Автор: Трой Джуниперо (Troy Giunipero)

В этом документе описана процедура создания простого веб-приложения, которое подключается к серверу базы данных MySQL. Здесь также рассмотрены основные идеи и технологии веб-разработки, такие какJavaServer Pages (JSP), библиотека стандартных тегов JavaServer Pages (JSTL), интерфейс API связи с базами данных Java (JDBC) и двухуровневая архитектура между клиентом и сервером. Этот учебный курс разработан для начинающих разработчиков, обладающих базовыми знаниями в области веб-разработок и желающих применить свои знания к базе данных MySQL.

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

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Для работы с этим учебным курсом требуется следующее программное обеспечение и ресурсы.

7.2, 7.3, 7.4, 8.0, пакет Java EE

Драйвер JDBC MySQL Connector/J

GlassFish Server Open Source Edition 3.1.2.2

Примечания:

Комплект загрузки Java среды IDE NetBeans позволяет пользователям установить сервер GlassFish. Для работы с данным учебным курсом требуется сервер GlassFish.

Если необходимо сравнить проект с работающим решением, можно загрузить демонстрационное приложение.

Планирование структуры

С помощью двухуровневой архитектуры, в которой клиент взаимодействует с сервером напрямую, можно создать простое веб-приложение. В рамках данного учебного курса веб-приложение Java взаимодействует напрямую с базой данных MySQL с использованием API связи с базами данных Java. В сущности, именно драйвер MySQL Connector/J JDBC обеспечивает обмен данными между кодом Java, распознанным сервером приложения (GlassFish), и любым содержимым на SQL, языке, понятном для сервера базы данных (MySQL).

Для реализации описанного выше сценария необходимо разработать простое приложение для организации IFPWAFCAD Международной ассоциации по консультированию и развитию для бывших профессиональных борцов.

index.jsp

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

response.jsp

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Создание нового проекта

Сначала необходимо создать новый веб-проект в среде IDE:

Выберите «Файл > Новый проект» (CTRL+SHIFT+N; &#8984+SHIFT+N в Mac ОС) в главном меню. Выберите категорию «Java Web», а затем выберите «Веб-приложение». Нажмите кнопку «Далее».

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

С помощью этого мастера можно создать пустое веб-приложение в стандартном проекте IDE. В стандартном проекте для компиляции, развертывания и выполнения приложения используется созданный в среде IDE сценарий сборки проекта Ant.

В поле «Имя проекта» введите «IFPWAFCAD». Также укажите местоположение проекта на компьютере. По умолчанию проекты в среде IDE помещаются в папку NetBeansProjects в домашнем каталоге. Нажмите кнопку «Далее».

В панели «Сервер и параметры» укажите сервер GlassFish в качестве сервера, на котором будет запускаться приложение.

*Примечание.*Сервер GlassFish отображается в раскрывающемся списке ‘Сервер’, если установлена версия Java IDE NetBeans. Поскольку сервер GlassFish включен в загрузку, он регистрируется в среде IDE автоматически. Для использования в проекте другого сервера нажмите кнопку «Добавить» рядом с полем с раскрывающимся списком «Сервер» и зарегистрируйте другой сервер в среде IDE. Работа с другими серверами, помимо GlassFish в рамках данного учебного курса не рассматривается.

В поле «Версия Java EE» выберите Java EE 5.

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Для веб-проектов Java EE 6 и Java EE 7 использование дескриптора развертывания web.xml не требуется. Шаблон проекта NetBeans не содержит файл web.xml в проектах Java EE 6 и Java EE 7. Однако в данном учебном курсе рассматривается процесс объявления источника данных в дескрипторе развертывания. Функции, характерные только для Java EE 6 или Java EE 7, не требуются, поэтому в качестве версии проекта можно указать Java EE 5.

Нажмите кнопку «Завершить». Создается шаблон проекта для всего приложения и в редакторе открывается пустая страница JSP ( index.jsp ). Файл `index.jsp`служит в приложении страницей приветствия.

Подготовка веб-интерфейса

Начните с подготовки страницы приветствия ( index.jsp ) и страницы ответов ( response.jsp ). На странице приветствия реализована форма HTML для сбора пользовательских данных. На обеих страницах для просмотра структурированных данных используется таблица HTML. В этом разделе также рассматривается процесс создания таблицы стилей, которая расширяет внешний вид обеих страниц.

Настройка страницы приветствия

Убедитесь, что страница index.jsp открыта в редакторе. Если файл еще не открыт, дважды щелкните index.jsp под узлом «Веб-страницы» проекта IFPWAFCAD в окне «Проекты».

Измените текст между тегами

на Добро пожаловать в IFPWAFCAD, Международную ассоциацию по консультированию и развитию для бывших профессиональных борцов!

Откройте палитру среды IDE, выбрав в главном меню «Окно» > «Палитра» (CTRL+SHIFT+8; &#8984+SHIFT+8 в ОС Mac). Наведите курсор на значок «Таблица» в категории «HTML» и обратите внимание на то, что отображается фрагмент кода для элемента по умолчанию.

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Установите курсор сразу же после тегов

. (Именно в этом месте будет внедрена новая таблица HTML). Далее в окне «Палитра» дважды щелкните значок «Таблица».

В появившемся диалоговом окне «Вставка таблицы» укажите следующие значения и затем нажмите кнопку «ОК»:

Рядов: 2

Столбцов: 1

Размер границы: 0 Код таблицы HTML создан и добавлен на страницу.

Добавьте следующее содержимое в заголовок таблицы и ячейку первой строки таблицы (новое содержимое выделено полужирным шрифтом):

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Нажмите клавишу Enter, чтобы добавить пустую строку после добавленного содержимого, затем дважды щелкните «Список» в палитре, чтобы открыть диалоговое окно «Вставить список».

В диалоговом окне «Вставить список» ведите subject_id для текстового поля «Имя» и нажмите «OK». Обратите внимание на то, что к форме добавляется фрагмент кода для раскрывающегося списка.

Количество параметров для раскрывающегося списка не имеет значения. Позже в этом учебном курсе будет показано добавление тегов JSTL для динамического создания на основе данных, полученных из таблицы базы данных «Subject».

Для форматирования кода щелкните правой кнопкой мыши в редакторе и выберите ‘Формат’ (Alt-Shift-F; Ctrl-Shift-F в Mac). Код автоматически форматируется и должен теперь выглядеть следующим образом:

Для просмотра этой страницы в браузере щелкните правой кнопкой мыши в редакторе и выберите ‘Запустить файл’ (Shift-F6; Fn-Shift-F6 в Mac). После этого страница JSP будет автоматически скомпилирована и развернута на сервере. Открывается браузер по умолчанию, и в нем выводится страница из местоположения, где она развернута.

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Создание страницы ответов

Для подготовки интерфейса для страницы response.jsp сначала необходимо создать файл в проекте. Обратите внимание на то, что большая часть содержимого, отображаемого на странице, создана динамически с помощью технологии JSP. Поэтому в следующих шагах будет необходимо добавить метки-заполнители, которые позже будут заменены кодом JSP.

Щелкните правой кнопкой мыши узел проекта «IFPWAFCAD» в окне «Проекты» и выберите «Создать > JSP». Откроется диалоговое окно «Новый файл JSP».

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Hello World!

Для просмотра этой страницы в браузере щелкните правой кнопкой мыши в редакторе и выберите ‘Запустить файл’ (Shift-F6; Fn-Shift-F6 в Mac). Выполняется компиляция и развертывание страницы на сервере GlassFish с последующим открытием в браузере по умолчанию.

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Создание таблицы стилей

Откройте мастер создания файлов, нажав кнопку ‘Создать файл’ ( как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных) на главной панели инструментов IDE. Выберите категорию «Web», а затем выберите «Каскадная таблица стилей» и нажмите кнопку «Далее».

В редакторе добавьте следующее содержимое к файлу style.css :

Для быстрого перехода между открытыми в редакторе файлами нажмите CTRL+TAB, а затем выберите требуемый файл.

Подготовка средств обмена данными между приложениями и базой данных

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

*Примечание. *Для дальнейшей работы необходимо убедиться в том, что база данных MySQL с именем MyNewDatabase настроена корректно и содержит данные примера из ifpwafcad.sql. Этот файл SQL создает две таблицы Subject и Counselor и затем заполняет их данными для примера. Если это не было выполнено ранее, или с этим заданием возникли сложности, то прежде чем продолжить учебный курс, обратитесь к разделу Подключение к базе данных MySQL.

Помимо этого для создания источника данных и работы с сервером GlassFish в рамках данного учебного курса необходимо защитить базу данных паролем. При использовании учетной записи MySQL root по умолчанию с пустым паролем с помощью командной строки можно установить другой пароль.

Дополнительные сведения приведены в официальном справочном руководстве по работе с MySQL: Защита исходных учетных записей MySQL.

Источник

Сегодня познакомимся с объектно-ориентированным программированием (ООП) в PHP. Используя принципы ООП, MySQL создадим простое web-приложение.

1. Введение

Данное учебное пособие о создании простого приложения с базой данных в стиле объектно-ориентированного программирования на PHP.

Мы будем использовать Bootstrap, чтобы не тратить время на вёрстку, а сосредоточимся на главном, а именно на ООП.

2. Файловая структура

Файловая структура данного приложения.

3. Структура таблицы базы данных

Создадим базу данных и две таблицы: для категорий и для самих товаров.

3.1 Создание базы данных и таблицы товаров

3.2 Вставка демо-данных для таблицы «Товары»

3.3 Создание таблицы для категорий товаров

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

3.4 Вставка демо-данных для таблицы «Категории»

В нашем проекте в качестве категорий будут:

Выполните следующий SQL запрос, используя ваш PhpMyAdmin.

3.5 Результат

Результатом данного раздела у вас должны быть:

4. Создание файлов шаблонов

Чтобы уменьшить беспорядок в коде, мы создадим файлы макетов с нужным кодом и ресурсами.

4.1 Создание файла шаблона «header»

Этот файл layout_header.php будет включен в начало тех файлов PHP, которые ему понадобятся. Таким образом, нам не придется каждый раз писать один и тот же код.

Как уже говорилось ранее, мы будем использовать фреймворк Bootstrap, чтобы наш проект выглядел хорошо.

4.2 Создание файла шаблона «footer»

Шаблон layout_footer.php будем подключать в конец каждого php-файла, который в нём нуждается. Таким образом, нам не придётся каждый раз писать один и тот же код.

Подключим следующие компоненты/библиотеки:

Можно было бы обойтись без сторонних библиотек, используя HTML, CSS и нативный JavaScript, но т.к. задача стоит разобраться в ООП, мы не будем много тратить времени на вёрстку.

Итак, создадим файл «подвала» и подключим его.

4.3 Создание кастомного CSS файла

Этот файл будем использовать для добавления стилей веб-страницы и для переопределения дефолтных стилей Bootstrap.

4.4 Результат

Файлы шаблонов, которые мы создали в этом разделе, предназначены для использования внутри другого файла PHP. Если мы попытаемся запустить файлы макета в одиночку, мы не получим желаемого результата.

Файл custom.css будет выглядеть так.

Шаблон layout_footer.php пуст. Давайте продолжим в следующем разделе, чтобы увидеть более значимый результат.

5. Создание записей в PHP методом ООП

5.1 Создание файла create_product.php

5.2 Создание кнопки «Просмотр всех товаров»

5.3 Подключение к базе данных

5.4 Создание класса конфигурации базы данных

Без этого класса невозможно установить соединение с базой данных. Этот файл класса будет включен в большинство файлов PHP нашего руководства по PHP ОПП MySQL.

В корне проекта создайте папку config и в ней файл database.php со следующим содержимым:

5.5 Создание формы в create_product.php

5.6 Вывод категорий в выпадающем списке

Следующий код будет извлекать категории, и помещать их в раскрывающийся список «Выбрать».

5.7 Создание класса для работы с категориями

5.8 Создание метода readName()

5.9 Выполнение php-кода при отправке формы

Пользователь будет вводить значения в HTML-форму, и при нажатии кнопки отправки, значения будут отправлены через запрос POST, а приведенный ниже код сохранит их в базе данных.

5.10 Создание класса для работы с товарами

5.11 Результат

Форма для создания товара.

Когда вы заполните форму и нажмёте кнопку «Создать».

6. Вывод товаров + пагинация с помощью PHP ООП

В этой части нашего руководства PHP ООП MySQL мы выведем записи из базы данных.

6.1 Создание файла index.php

6.2 Добавление кнопки «Создание товара»

6.3 Настройка переменных для создания пагинации

6.4 Получение записей из базы данных

Теперь мы извлечем товары из базы данных. Замените комментарий // здесь будет получение товаров из БД в файле index.php следующим кодом.

6.5 Создание метода readAll() в файле product.php

6.6 Вывод товаров из базы данных

На этот раз мы покажем пользователю список товаров. HTML Таблица будет содержать наши данные. Поместите следующий код после кода раздела 6.2.

6.7 Добавление кнопок просмотра, редактирования и удаления

Следующий код отобразит три кнопки (ссылки на соответствующие страницы): «Просмотр», «Редактировать» и «Удалить».

6.8 Создание файла paging.php для пагинации

6.9 Создание метода countAll() в objects/product.php

Следующий код будет использоваться для подсчета общего количества записей в базе данных. Это будет использоваться для нумерации страниц.

6.10 Включение paging.php в index.php

Следующий код покажет пагинацию под нашим списком записей. Поместите следующий код после закрывающего тега table в разделе 6.6.

6.11 Результат

Запустите http://php-oop-mysql/index.php через ваш локальный сервер, вы должны увидеть что-то вроде этого:

Список товаров, страница 1.

Список товаров, страница 2.

7. Обновление записи в PHP методом ООП

Я знаю, что наше руководство по PHP OOP MySQL довольно длинное. Пожалуйста, сделайте перерыв или выпейте кофе 🙂

7.1 Создание файла update_product.php

Создайте файл update_product.php и добавьте в него следующий код:

7.2 Создание кнопки «Просмотр всех товаров»

7.3 Получение информации об одном товаре на основе получаемого ID.

Следующий код получит текущие данные, которыми будет заполнена наша HTML-форма. Это важно, потому что это позволит пользователю узнать, какую именно запись он обновляет.

В файле update_product.php замените комментарий // здесь будет получение одного товара следующим кодом.

7.4 Добавление метода readOne() в класс Product

7.5 Добавление значений в форму обновления товара

7.6 Вывод категорий в выпадающем списке

Следующий код перечислит категории в раскрывающемся списке.

7.7 Код при отправке формы обновления товара

7.8 Добавление метода update() в класс товара

7.9 Результат

Щелкните любую кнопку «Редактировать» на главной странице приложения. Форма обновления товара должна выглядеть следующим образом.

Когда вы отправите форму, будет показано сообщение.

В базе данных будет изменена запись.

8.0 Чтение одной записи на PHP в ООП

Ранее мы сделали страницу для редактирования товара и код для «обновления записи». Теперь нам необходимо создать страницу для отображения товара. Этот раздел для чтения одной записи из базы данных будет сделать проще.

8.1 Создание страницы товара

8.2 Чтение одной записи на основе полученного ID

Следующий код считывает одну запись из базы данных. Поместите код перед комментарием // установка заголовка страницы в предыдущем разделе.

8.3 Отображение товара в HTML-таблице

8.4 Результат

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

9. Удаление записи на PHP в ООП

9.1 Добавление JavaScript для удаления товара

9.2 Создание файла delete_product.php

Откройте delete_product.php и добавьте в него следующий код:

9.3 Метод для удаления товара в классе Product

9.4 Результат

Щелкните любую кнопку Удалить на главной странице. Появится всплывающее окно подтверждения.

10. Поиск записей в PHP методом ООП

Следующие разделы являются бонусными, поэтому если вы не разобрались с кодом выше, лучше сначала разберитесь, а затем продолжайте изучение дальше.

И так, продолжим, добавим функцию поиска. Это ответит на вопрос: «Как искать данные в базе данных на php?» Это очень полезная функция, потому что вы позволяете пользователям легко искать определенные данные в нашей базе данных MySQL.

10.1 Изменение index.php

10.2 Создание read_template.php

Зачем нам этот шаблон? Он нам нужен, потому что точно такой же код может использоваться и в index.php и в search.php для отображения списка записей. Использование шаблона означает меньший объем кода.

Создайте read_template.php с формой поиска.

10.3 Создание core.php в папке config

Этот файл будет содержать наши переменные пагинации страниц. Использование файла core.php является хорошей практикой, его можно использовать для хранения других значений конфигурации, которые могут вам понадобиться в будущем.

Откройте core.php и добавьте следующий код:

10.4 Изменение кода в paging.php

Новый код paging.php будет выглядеть следующим образом.

10.5 Создание файла search.php

Это самый важный файл в этом разделе. В этом файле будут отображаться записи на основе поискового запроса пользователя.

10.6 Добавление методов search() и countAll_BySearch()

10.7 Результат

Выполним поиск по слову «телефон».

11. Загрузка файлов в PHP методом ООП

Это последняя часть нашего руководства по PHP ООП MySQL. Наслаждайтесь каждой строчкой кода! 🙂

В этом разделе мы добавим функцию «загрузки файлов» для товаров.

Источник

Пишем простое веб-приложение используя Spring MVC, Spring Data JPA и Hibernate

Привет, Хабр! Представляю Вашему вниманию перевод руководства «Spring MVC + Spring Data JPA + Hibernate — CRUD Example» автора Nam Ha Minh.

В этом руководстве по Java Spring вы узнаете, как настроить Spring MVC приложение для работы с Spring Data JPA, разработав простое веб-приложение, которое позволяет управлять информацией о клиентах.

По завершению этого руководства, вы сможете создать веб-приложение Java основанное на технологиях Spring MVC и Spring Data JPA, которое выглядит следующим образом:

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Программы и технологии используемые в этом руководстве: Java 8, Apache Tomcat 9, MySQL Server 5.7, Eclipse IDE 4.7 (Oxygen), Spring Framework 5.1, Hibernate 5.4, Spring Data JPA 2.1.5 и Servlet 3.1.

Начнём с создания базы данных.

1. Создание базы данных

Мы будем использовать MySQL. В нашем пример мы будем работать с данными в таблице customer, которая находится в схеме с именем sales. Таблица customer имеет 4 поля: id, name, email и address:

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Вы можете запустить следующий MySQL скрипт для создания схемы и таблицы:

2. Создание проекта в Eclipse

Создайте Dynamic Web Project в Eclipse, и конвертируйте его в проект Maven: для этого нажмите ПКМ по проекту, выберете Configure > Convert to Maven Project. В открывшемся диалоговом окне Create new POM введите следующую информацию:

— Group Id: net.codejava
— Artifact Id: CustomerManager

Также убедитесь, что версия JRE для проекта Java 8 или новее.

Затем, откройте pom.xml (файл Maven), чтобы настроить зависимости для этого проекта. Объявите свойства версий для Spring и Hibernate Frameworks:

Укажите зависимость для Spring Framework:

Для создания веб-приложений Spring MVC:

Для использования Spring Data JPA:

Мы используем Hibernate в качестве реализации JPA, поэтому добавим следующую зависимость:

Для того, чтобы приложение работало с MySQL, нам нужна зависимость для драйвера MySQL JDBC:

И теперь зависимости для Java Servlet, JSP и JSTL:

Создайте два Java пакета в корне проекта:
— net.codejava.config : для классов конфигурации.
— net.codejava.customer : для классов приложения.

3. Создание файла настройки JPA

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

И впишите в этот файл код представленный ниже:

Как вы можете видеть, мы указываем свойства для соединения с базой данных, такие как URL, user, password и класс JDBC драйвера. Так же обратите внимание, что имя SalesDB будет использоваться нами в коде конфигурации.

4. Создание Model Class

5. Конфигурация Spring MVC и Spring Data JPA

Далее, напишем Java код для настройки Spring MVC и Spring Data JPA. Мы будем использовать конфигурацию на основе Java, так как она проще, чем XML.

Настройка Spring Dispatcher Servlet

Для использования Spring MVC в нашем приложении, нам надо зарегистрировать Spring Dispatcher Servlet при запуске приложения, написав следующий класс:

Настройка Spring MVC

В этом классе мы создаём bean-компонент, который распознаёт представления (View), с помощью указания префикса и суффикса для этих представлений. Поэтому создайте каталог views внутри каталога WebContent/WEB-INF для хранения JSP файлов.

Здесь вы можете добавить и другие конфигурации Spring MVC.

Настройка Spring Data JPA

Здесь мы используем две важные аннотации:

Это минимальная необходимая конфигурация для использования Spring Data JPA.

Создание Repository Interface

7. Создание Service Class

Затем, создайте класс CustomerService :

Это похоже на магию, поскольку мы не пишем DAO код, но Spring Data JPA автоматически создаст реализацию во время выполнения.

8. Создание контроллера Spring MVC

Создайте класс CustomerContoroller для обработки всех запросов от клиентов:

Мы напишем методы обработки в следующих секциях.

9. Добавление списка клиентов

На домашней странице нашего приложения будут отображаться все клиенты, для этого добавьте соответствующий обрабатывающий метод в наш CustomerController класс:

Домашняя страница просмотра ( index.jsp ) должна выглядеть следующим образом:

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

10. Добавление нового пользователя

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

Напишем саму JSP форму с именем new_customer.jsp :

Теперь на главной странице у вас появится ссылка New Customer, при нажатии на которую вы увидите новую форму:

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Второй метод-обработчик будет обрабатывать кнопку Save в этой форме:

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

11. Изменение данных пользователя

Чтобы реализовать функцию редактирования клиента, добавим следующий метод-обработчик в класс CustomerController :

Нажмите на гиперссылку Edit рядом с клиентом на домашней странице, вызовется форма редактирования клиента, которая будет выглядеть примерно вот так:

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Метод-обработчик по-прежнему обрабатывает кнопку Save.

12. Удаление клиента

Для реализации функции удаления, напишите следующий метод-обработчик в классе CustomerController :

Нажмите на гиперссылку Delete рядом с клиентом на главной странице. Клиент удалится, а список обновится.

13. Поиск по клиентам

Наконец, давайте реализуем функцию поиска, которая позволяет пользователю искать клиентов, вводя ключевое слово. Функция поиска ищет ключевые слова в трёх полях: имя, email и адрес, для чего нам потребуется написать собственный метод в интерфейсе CustomerRepository :

Затем добавьте метод в класс CustomerService :

Теперь добавьте метод-обработчик в класс CustomerController :

И создайте страницу результата поиска search.jsp :

Для тестирования функции поиска, введите ключевое слово в поле поиска на домашней странице, и нажмите Enter. Вы увидите страницу результата поиска:

как создать веб приложение с базой данных. Смотреть фото как создать веб приложение с базой данных. Смотреть картинку как создать веб приложение с базой данных. Картинка про как создать веб приложение с базой данных. Фото как создать веб приложение с базой данных

Выводы

В данном руководстве вы узнали как можно разработать веб-приложение Spring MVC, используя Spring Data JPA для доступа к данным. Как вы могли видеть, Spring Data JPA значительно уменьшает и упрощает код, который нам нужно писать.

Для сравнения, вот структура проекта в Eclipse IDE:

Источник

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *