Создание клиент-серверного приложения на основе restful api архитектуры | Статья в журнале «Молодой ученый»

Отправьте статью сегодня! Журнал выйдет 5 июля, печатный экземпляр отправим 9 июля.

Опубликовать статью в журнале

Авторы: , ,

Рубрика: Информационные технологии

Опубликовано в Молодой учёный №29 (371) июль 2021 г.

Дата публикации: 15.07.2021

Статья просмотрена: 864 раза

Библиографическое описание:

Ивонин, О. А. Создание клиент-серверного приложения на основе restful api архитектуры / О. А. Ивонин, А. Г. Гречихин, И. Р. Гильматдинов. — Текст : непосредственный // Молодой ученый. — 2021. — № 29 (371). — С. 18-20. — URL: https://moluch.ru/archive/371/83265/ (дата обращения: 26.06.2025).



В данной работе было спроектировано и разработано клиент-серверное приложение с архитектурой Restfull и взаимодействием с клиентом по API. Затронуты проблемы, связанные с проектированием микросервисов и его взаимодействия с клиентом. В качестве клиента был выбран React JS и тема электронного журнала для учета успеваемости студентов.

Ключевые слова: проектирование, алгоритмы, микросервисы, React JS, разработка ПО, асинхронное программирование, API, Restful, Java, Spring.

Одна из задач, которая часто встречается в статистике, — группировка наблюдений по определенному признаку. Одним из способов решения данной задачи является визуальная группировка, где в качестве осей выступают значения признаков, а сами точки на плоскости наблюдениями, которые необходимо отнести к какой-либо группе.

Цель работы: изучить принципы работы клиент-серверных приложений с Restful API архитектурой. Создать серверную часть приложения с подобной архитектурой. Создать клиентское веб-приложение с целью проверки работоспособности реализованной серверной части, выявить последующую возможность применения подобной серверной архитектуры приложения.

Серверная архитектура RESTful в современном мире клиент-серверных приложений является наиболее популярной по причине распределения нагрузок между несколькими серверами путем разбиения всего функционала на несколько микросервисов, с которыми может взаимодействовать клиентское приложения. Для реализации подобного серверного приложения был выбран язык программирования JAVA в связке с фреймворком Spring [1].

Одним из архитектурных решений в проекте является REST. Для взаимодействия между сервером и клиентом используется RESTful API. С помощью HTTP или HTTPS запросов (POST и GET), клиент может получать какие-либо данные, либо же изменять, добавлять и удалять компоненты. [2]

К таковым компонентам относятся: группы, дисциплины, оценки, студенты. В случае с изменением данных, сутью RESTful API является получение POST запроса извне, конвертирование модели в сущность базы данных и сохранение как таковой. Преимуществами подобной архитектуры является тот факт, что данный API возможно использовать в будущем при разработке приложений или интегрировании нового функционала в существующие приложения.

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

Схема работы такого сервера с RESTful API архитектурой отображена на рисунке 1.

Схема работы RESTful API сервера

Рис. 1. Схема работы RESTful API сервера

Для взаимодействия с Restful сервером было решено реализовать клиентское веб-приложение на языке программирования JavaScript с использованием Node.JS и React JS. Данная связка позволяет использовать JavaScript на сервере, повысить масштабируемость и читаемость реализуемого кода приложения. Основным же плюсом данного решения является разрешение использования JS для работы с данными и файлами (в противном случае данные операции блокирует встроенная в браузеры политика CORS (политика, работающая с взаимодействием между разными доменами, разрешая, или запрещая подобны обмен)). [3]

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

Асинхронность наиболее часто используется как раз-таки при использовании внешних API, которые взаимодействуют со сторонним сервером. Таким образом клиентское приложение отрисовывает интерфейс сразу же после получения «обещаний» от кода, который взаимодействует с API, а уже после получения «обещанных» данных обновляет только ту часть приложения, к которым относятся полученные данные. Упрощенная схема работы подобного клиентского приложения изображена на рисунке 2. [4]

Схема работы клиентского веб-приложения

Рис. 2. Схема работы клиентского веб-приложения

В результате полученных теоретических данных было реализовано два приложения, одно с серверной части, а другое с клиентской, которые взаимодействуют между собой через API интерфейсы, которые позволяют реализовывать клиентскую часть на любой из доступных платформ, которые позволяют отправлять и принимать POST и GET запросы.

В процессе реализации были выявлены проблемы, с которыми сталкивается разработчик при реализации асинхронных запросов к серверу.

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

Литература:

  1. Лонг Д Java в облаке. Spring Boot, Spring Cloud, Cloud Foundry [учебное пособие] / Лонг Д. — Издательский Дом ПИТЕР, 2019–624 c.
  2. Арно Лоре Проектирование веб-API [учебное пособие] / Беликов Д. А. — ДМК-Пресс, 2020 г — 440 с.
  3. Руководство по React JS [электронный ресурс]: URL: https://ru.reactjs.org/docs/getting-started.html (дата обращения: 18.02.2021)
  4. Руководство по работе с REST API в React JS [электронный ресурс]: URL: https://ru.reactjs.org/docs/faq-ajax.html (Дата обращения: 22.02.2021)
Основные термины (генерируются автоматически): API, POST, GET, данные, клиентское веб-приложение, схема работы, CORS, клиентская часть, клиентское приложение, подобная архитектура.


Ключевые слова

проектирование, алгоритмы, Java, API, Spring, разработка ПО, микросервисы, React JS, асинхронное программирование, Restful

Похожие статьи

Разработка веб-приложения «Семейный органайзер»

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

Кроссплатформенная разработка на Flutter: ограничения и возможности

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

Требования к разработке специализированных меток для функционирования маркерных приложений с AR-технологией на базе платформы Vuforia

Данная статья посвящена теме разработки и корректуры маркеров для AR-приложений. В настоящей работе отображается процесс взаимодействия с алгоритмом анализа маркеров Vuforia, демонстрируется перечень требований к разработке, а также реализация коррек...

Редактирование и создание шаблонов сайтов

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

Docker Compose: управление многоконтейнерными приложениями

В этой статье рассмотрены ключевые принципы работы с Docker Compose — инструментом для управления многоконтейнерными приложениями. Описаны основные возможности: создание и настройка сервисов, использование сетей, томов, также приведены практические п...

Веб-приложение обработки данных Discord-бота

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

Разработка Web-приложения с применением технологии ASP.NET

В статье рассматриваются возможности применения технологии ASP.NET, позволяющей создавать динамические Web-страницы. Разработанный стартовый проект содержит данные о предприятиях и организациях Карагандинской области, предоставляемых ими вакансиях, и...

Разработка веб-сервиса для хранения и передачи данных

В данной статье рассматривается процесс разработки веб-сервиса для облачного хранения и передачи данных, описываются основные аспекты создания серверной части с использованием фреймворка Spring и реализации клиентской части с использованием React, а ...

Адаптивный дизайн веб-сайта с использованием фронтэнд-фреймворка Bootstrap

В данной статье раскрывается понятие адаптивного дизайна как одного из процессов веб разработки. Даются определения разновидностей фронтэнд фреймворков, используемых в веб разработке, и подробный анализ компонентов фреймворка Bootstrap. Делается выво...

Автоматизация развертывания компонент распределенного приложения современными средствами управления конфигурацией

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

Похожие статьи

Разработка веб-приложения «Семейный органайзер»

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

Кроссплатформенная разработка на Flutter: ограничения и возможности

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

Требования к разработке специализированных меток для функционирования маркерных приложений с AR-технологией на базе платформы Vuforia

Данная статья посвящена теме разработки и корректуры маркеров для AR-приложений. В настоящей работе отображается процесс взаимодействия с алгоритмом анализа маркеров Vuforia, демонстрируется перечень требований к разработке, а также реализация коррек...

Редактирование и создание шаблонов сайтов

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

Docker Compose: управление многоконтейнерными приложениями

В этой статье рассмотрены ключевые принципы работы с Docker Compose — инструментом для управления многоконтейнерными приложениями. Описаны основные возможности: создание и настройка сервисов, использование сетей, томов, также приведены практические п...

Веб-приложение обработки данных Discord-бота

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

Разработка Web-приложения с применением технологии ASP.NET

В статье рассматриваются возможности применения технологии ASP.NET, позволяющей создавать динамические Web-страницы. Разработанный стартовый проект содержит данные о предприятиях и организациях Карагандинской области, предоставляемых ими вакансиях, и...

Разработка веб-сервиса для хранения и передачи данных

В данной статье рассматривается процесс разработки веб-сервиса для облачного хранения и передачи данных, описываются основные аспекты создания серверной части с использованием фреймворка Spring и реализации клиентской части с использованием React, а ...

Адаптивный дизайн веб-сайта с использованием фронтэнд-фреймворка Bootstrap

В данной статье раскрывается понятие адаптивного дизайна как одного из процессов веб разработки. Даются определения разновидностей фронтэнд фреймворков, используемых в веб разработке, и подробный анализ компонентов фреймворка Bootstrap. Делается выво...

Автоматизация развертывания компонент распределенного приложения современными средствами управления конфигурацией

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

Задать вопрос