Обзор приложения Spring MVC + AngularJS + Bootstrap + HTML5

Обзор и описание учебного приложения для изучения фреймворков Spring MVC, AngularJS, Bootstrap и HTML5 в одном приложении.

Используемые технологии и библиотеки

• Spring MVC 4.2.4.Release
• Spring Security 4.0.4.Release
• Spring Data 1.9.1.Release
• Hibernate 5.0.1.Final
• AngularJS 1.5.0.
• JUnit 4.12
• Logback 1.0.13
• SLF4J 1.7.13
• Java 1.8
• JSP 2.2
• Servlet 3.1.0
• Maven 3.2.5
• IntelliJ IDEA 15.0.2

Содержание

1. Введение. Описание приложения и рассматриваемых тем.
2. Основные настройки Spring MVC, подключение фреймворка Bootstrap и шаблонной темы.
3. Создание PDF и Excel документов и загрузка файлов с помощью Spring MVC.
4. Spring MVC и JDBC. Настройка JDBC datasource, выполнение SQL запросов в Spring MVC.
5. Отправка электронной почты (email) с помощью Spring MVC и Apache Velocity Templates.
6. Подключение ORM (Hibernate) в приложение Spring MVC. Настройки, создание сущностей, выполнение запросов к БД.
7. Перехват исключений (Exception Handling) в Spring MVC. Настройка логирования в Spring MVC с помощью Logback.
8. JSTL в Spring MVC. Базовые понятия и примеры использования на странице jsp.
9. Планировщик задач и использование таймера в Spring MVC на примере ScheduleTask и Quartz.
10. Перехватчики (Interceptors) в Spring MVC. Настройка, пример использования.
11. Переадресация и пересылка (redirect & forward) в Spring MVC.
12. Области видимости Session scope и Request scope в Spring MVC. Работа с объектами.
13. Использование Cookies в Spring MVC. Конфигурация CoockieLocaleResolver в Spring MVC.
14. Тестирование с помощью JUnit в Spring MVC. Подключение и настройка JUnit. Внедрение ресурсов и зависимостей в тестирующий класс.
15. Spring MVC и Spring Security. Настройка Spring Security, создание страницы логина, настройка ролей, ограничение доступа к частям приложения с помощью аннотаций или xml настроек. Обзор базовых security тегов на странице jsp.
16. Работа с JSON и XML (преобразование объектов) в Spring MVC. Формирование ответа и обработка запроса. RestTemplate в Spring.
17. Локализация (localization) в Spring MVC. Настройка приложения, создание resource bundle.
18. Spring MVC Java Config (конфигурация с аннотациями) для web.xml
19. Spring MVC Java Config (конфигурация с аннотациями) для mvc-config.xml
20. Spring MVC Java Config (конфигурация с аннотациями) для Spring Security (security-config.xml)
21. Spring MVC Java Config (конфигурация с аннотациями) для application-context.xml

Google AngularJS. Основы фреймворка. Использование AgularJS внутри готового Spring MVC приложения

1. Базовые понятия JavaScript: объект в JS, JSON, stringify, JS массивы, nested объекты.
2. AngularJS Hello world example. Основы AngularJS: модуль, контроллер, выражения.
3. Обзор модели (ng-model) и связывания (ng-bind) с объектами в AngularJS.
4. Двустороннее связывание объектов и модели AngularJS.
5. Обзор директив AnugularJS: ng-class, ng-click, ng-show, ng-switch, ng-if, ng-init, ng-repeat.
6. Внедрение зависимостей (Dependency Injection) в AngularJS.
7. Контроллер ng-controller AngularJS. Наследование контроллеров.
8. Использование фильтров AngularJS filters. Angular ng-repeat filter и собственный фильтр.
9. Валидация формы (angular form validation) в AngularJS. Свойства $invalid, $valid, $touched, $pristine, $dirty.
10. Понятие routing и templates в приложении AngularJS. Использование ngRoute, $routeProvider.
11. RESTful сервисы в AngularJS. Использование сервисов $http, $resource для REST вызовов.

1. Описание задачи и проекта. Введение

В этом цикле статей будет достаточно подробно рассматриваться один из ведущих Java фреймворков — Spring MVC в связке с такими популярными фреймворками, как AngularJS и Bootstrap. В отдельной статье будут рассмотрены важные нововведения, которые предоставляет язык HTML5.

1.1. Как будет построен цикл статей

По ходу изучения каждой темы вы будете узнавать какие настройки нужны для запуска или работы с той или иной функцией или технологией фреймворка. Для каждой темы будут описаны необходимые maven зависимости, рассмотрена spring-mvc.xml конфигурация. Т.к. это веб приложение, то каждая тема будет сопровождаться представлением jsp на странице которой будут демонстрироваться результаты работы Java, JSTL, JavaScript или другого кода.

Для более легкого понимания того, что вообще происходит в проекте, он будет выкладываться в двух видах.

• Первый — архив проекта, который содержит в себе текущую тему (настройки, pom зависимости, jsp страницы и java классы), а так же все предыдущие темы (т.е. последовательное увеличение записей в настройках и подключенных зависимостей).
• Второй — окончательный проект со всеми настройками, страницами и кодом, который был на момент написания статьи.

Такой подход позволит новичкам не запутаться в паре десятков подключенных библиотек в pom.xml, большого кол-ва записей в файлах конфигурации Spring MVC: mvc-config.xml, application-context.xml, spring-security.xml, web.xml и др. Для второго случая — позволит увидеть весь набор и проект целиком, если необходимо узнать только определенную часть.

2. Структура проекта

Ниже приведены скриншоты получившийся структуры данного проекта.

Каждая тема статьи будет соответствовать пакету из веб-представления (webapp) со своей jsp страницей и, там где это необходимо, соответствующим пакетом с java классами. Названия пакетов легко сопоставить с изучаемой темой (orm, exception, rest и т.д.).

3. Проект Spring MVC + AngularJS + Bootstrap

Начальная странца:

Раздел Spring MVC:

Раздел AngularJS:

Пример из раздела AngularJS:

Пример из раздела Spring MVC:

 

Исходные коды

MVC_AngularJS_Html5 full project — полный проект Spring MVC + AngularJS + Bootstrap + HTML5.

startbootstrap-modern-business-1.0.5 — bootstrap шаблон темы, который был использован в проекте.

Пример Spring MVC 4 для начинающих. Базовые настройки. Подключение Bootstrap в Spring MVC.

 

69