Курс на Stepik
Обложка курса «Java|TypeScript: Fullstack: Spring Boot, React и S3 » на Stepik
3 000 ₽

Java|TypeScript: Fullstack: Spring Boot, React и S3 ★ 4.833

Открыть на
STEPIK.ORG

Соберите веб-приложение целиком: REST API на Java и Spring Boot, базу PostgreSQL и клиент на React и TypeScript. Добавьте регистрацию, JWT, права владельца, поиск и фотографии в S3. Настройте сборку Docker-образа через GitHub Actions и запуск backend в Docker Compose.

Показатель Текущие показатели Рост
Значение 🏆 Рейтинг 3 дн 7 дн 30 дн
Количество учеников на курсе «Java|TypeScript: Fullstack: Spring Boot, React и S3 »Учеников на курсе 66
Сертификаты, выданные на курсе «Java|TypeScript: Fullstack: Spring Boot, React и S3 »Сертификатов выдано 0
Отзывы о курсе «Java|TypeScript: Fullstack: Spring Boot, React и S3 »Отзывов получено 6
Рейтинг курса «Java|TypeScript: Fullstack: Spring Boot, React и S3 »Рейтинг курса 4.833
Уроки в курсе «Java|TypeScript: Fullstack: Spring Boot, React и S3 »Количество уроков 70
Тесты в курсе «Java|TypeScript: Fullstack: Spring Boot, React и S3 »Количество квизов 182
Задачи с кодом в курсе «Java|TypeScript: Fullstack: Spring Boot, React и S3 »Количество задач с кодом 1
Время прохождения курса «Java|TypeScript: Fullstack: Spring Boot, React и S3 »Время прохождения курса —
Стоимость курса «Java|TypeScript: Fullstack: Spring Boot, React и S3 »Стоимость курса 3 000 ₽ —
Обновления курса «Java|TypeScript: Fullstack: Spring Boot, React и S3 »Обновления курса — —
Дата публикации курса «Java|TypeScript: Fullstack: Spring Boot, React и S3 »Дата публикации курса — ———
Последнее обновление курса «Java|TypeScript: Fullstack: Spring Boot, React и S3 »Последнее обновление — ———
Сложность normal — ———

Содержание курса

Разделы в курсе «Java|TypeScript: Fullstack: Spring Boot, React и S3 » 18 разделов Уроки в курсе «Java|TypeScript: Fullstack: Spring Boot, React и S3 » 70 уроков Тесты в курсе «Java|TypeScript: Fullstack: Spring Boot, React и S3 » 182 теста Задачи в курсе «Java|TypeScript: Fullstack: Spring Boot, React и S3 » 1 задача Время прохождения курса «Java|TypeScript: Fullstack: Spring Boot, React и S3 » 2 ч. Последнее обновление курса «Java|TypeScript: Fullstack: Spring Boot, React и S3 » обн. 14 ноября 2026

Как проходить этот курс

2 урока
1. Установка и настройка необходимых инструментов ↗
2. Онлайн-встречи ↗

🚀 Начало

2 урока
1. Добро пожаловать на курс! ↗
2. Давайте познакомимся! ↗

Погружение

25 уроков
1. Перед началом ↗
2. Создание проекта ↗
3. Первые шаги: таблица с данными ↗
4. Подключение Bootstrap ↗
5. Bootstrap в деле ↗
6. Первый React-компонент ↗
7. Передача данных ↗
8. Добавление кнопки ↗
9. React useState ↗
10. Создание формы ввода ↗
11. Ввод данных от пользователя ↗
12. Удаление данных ↗
13. Ошибка генерации ↗
14. Key-ошибка ↗
15. База данных ↗
16. Создание Spring Boot приложения ↗
17. Первая сущность ↗
18. Java-JPA repo ↗
19. Postman ↗
20. JavaScript - Axios первый запрос ↗
21. Java CORS, JPA ↗
22. CORS ↗
23. Исправление клиента ↗
24. JS+Postman-разговорчики ↗
25. Финал ↗

Создание проекта и подключение базы данных

3 урока
1. Создаём проект через Spring Initializr ↗
2. Запускаем PostgreSQL в Docker ↗
3. Подключаем PostgreSQL и создаём первую миграцию ↗

Модель контакта и первое REST API

6 уроков
1. Описываем сущность контакта ↗
2. Добавляем репозиторий и DTO контакта ↗
3. Преобразуем DTO и сущность через MapStruct ↗
4. Добавляем сервис чтения контактов ↗
5. Открываем получение контактов через REST API ↗
6. Подключаем Swagger UI для проверки API ↗

Что делать дальше

3 урока
1. Подведение итогов ↗
2. Техническое задание на доработку ↗
3. Бонус оффер ↗

Изменение контактов и обработка ошибок

4 урока
1. Добавляем создание контактов ↗
2. Добавляем обновление контактов ↗
3. Добавляем удаление контактов ↗
4. Добавляем понятные ошибки API ↗

Поиск и сортировка контактов

3 урока
1. Добавляем поиск контактов ↗
2. Наполняем базу контактами через Datafaker ↗
3. Добавляем сортировку контактов ↗

Фотографии контактов и S3-хранилище

7 уроков
1. Подготавливаем S3-хранилище для фотографий ↗
2. Подключаем S3-клиенты и создаём бакет ↗
3. Добавляем ключ фотографии контакта ↗
4. Проверяем и сохраняем фотографии ↗
5. Загружаем фотографию контакта через API ↗
6. Удаляем и заменяем фотографию контакта ↗
7. Удаляем фото с контактом и обрабатываем ошибки S3 ↗

Регистрация, вход и защита API

6 уроков
1. Добавляем модель пользователя и DTO ↗
2. Создаём сервис регистрации и хешируем пароль ↗
3. Добавляем HTTP-метод регистрации пользователя ↗
4. Подключаем Spring Security и настраиваем JWT ↗
5. Добавляем вход и выдачу JWT ↗
6. Защищаем операции с контактами и подключаем JWT в Swagger ↗

Личные контакты и права владельца

5 уроков
1. Связываем контакт с текущим пользователем ↗
2. Проверяем владельца при изменении и удалении контакта ↗
3. Получаем свои контакты с поиском и сортировкой ↗
4. Получаем текущего пользователя и уточняем ошибки доступа ↗
5. Создаём демонстрационных пользователей и их контакты ↗

Доступ из браузера и запуск в Docker

3 урока
1. Настраиваем CORS для браузерного клиента ↗
2. Собираем Docker-образ и публикуем через GitHub Actions ↗
3. Запускаем окружение из готового Docker-образа ↗

Создание TypeScript-клиента и оформление приложения

4 урока
1. Создаём React-приложение на TypeScript через Vite ↗
2. Очищаем шаблон и настраиваем Vite ↗
3. Подключаем Bootstrap и тему Darkly ↗
4. Организуем каталоги и описываем тип контакта ↗

Загрузка, поиск и сортировка контактов

6 уроков
1. Добавляем запрос контактов и обработку ошибок ↗
2. Загружаем и отображаем контакты ↗
3. Показываем контакты в адаптивных карточках ↗
4. Добавляем поиск контактов с задержкой ввода ↗
5. Проверяем код линтером и уточняем запуск загрузки ↗
6. Добавляем выбор порядка контактов ↗

Маршруты и страница контакта

3 урока
1. Подключаем маршруты и переход к контакту ↗
2. Загружаем и отображаем отдельный контакт ↗
3. Показываем поля и фотографию контакта ↗

Вход, регистрация и личный список контактов

5 уроков
1. Подготавливаем вход, хранение токена и контекст пользователя ↗
2. Добавляем провайдер пользователя и страницу входа ↗
3. Добавляем меню пользователя и подготавливаем RequireAuth ↗
4. Добавляем регистрацию и проверку полей формы ↗
5. Добавляем личный список контактов и запросы с токеном ↗

Создание, редактирование и удаление контактов

4 урока
1. Описываем данные и запросы для изменения контактов ↗
2. Добавляем форму создания контакта ↗
3. Добавляем редактирование контакта владельцем ↗
4. Добавляем удаление контакта с подтверждением ↗

Фотографии контактов и самостоятельная работа

3 урока
1. Добавляем загрузку и замену фотографии контакта ↗
2. Добавляем отдельное удаление фотографии ↗
3. Самостоятельная работа: дата обновления и аватары ↗