====== Swagger ====== [[https://swagger.io/|swagger - написання документації]] **Swagger** - це набір інструментів для розробки, документування та взаємодії з веб-сервісами на основі їх API (інтерфейсів програмування застосунків). Основний компонент Swagger - це Swagger UI, який дозволяє генерувати автоматичну документацію для веб-сервісу на основі специфікації OpenAPI (раніше відомої як Swagger Specification). Swagger дозволяє розробникам швидко розробляти, тестувати та взаємодіяти з API, а також надає зручний спосіб для документування API та його функціоналу. Завдяки Swagger, розробники можуть легко створювати, зберігати та редагувати специфікації API, а також докладно описувати всі доступні ендпоінти, параметри запитів та відповіді сервера. ===== Бібліотека redocly/cli ===== * Для зручної роботи зі Swagger ми скористаємося бібліотекою @redocly/cli npm i -D @redocly/cli Для роботи з документацією ми одразу можемо додати відповідні зміни у поле scripts в package.json: // package.json { /* Інший код файлу */ "scripts": { "build": "npm run build-docs", "build-docs": "redocly bundle --ext json -o docs/swagger.json", "preview-docs": "redocly preview-docs", } } * Команда preview-docs допоможе нам писати документацію з hot-reload, тобто з гарячим перезавантаженням сторінки при внесенні змін(як в nodemon). Більш детально можете прочитати про це за [[https://redocly.com/docs/cli/commands/preview-docs|посиланням]] * Команда build-docs буде формувати один файл із розширенням .json за шляхом docs/swagger.json. Відповідно, нам треба створити таку папку з файлом, де у файл ми запишемо порожній обʼєкт: // docs/swagger.json {} Для того, щоб працювати з redocly CLI, нам також треба створити файл redocly.yaml в корені проєкту. Цей файл містить конфігурацію для роботи з redocly CLI. Він дозволяє налаштовувати параметри генерації документації для API, включаючи налаштування стилів, шрифтів, тем тощо. За допомогою цього файлу ми можемо легко керувати параметрами проєкту без необхідності змінювати код. # redocly.yaml # See for more information. apis: sample@v1: root: docs/openapi.yaml extends: - recommended rules: no-unused-components: error theme: openapi: htmlTemplate: ./docs/index.html theme: colors: primary: main: '#32329f' generateCodeSamples: languages: # Array of language config objects; indicates in which languages to generate code samples. - lang: curl - lang: Node.js - lang: JavaScript В цьому файлі ми бачимо, що нам треба створити ще файли docs/index.html та docs/openapi.yaml. Створимо їх з наступним вмістом API Reference | ReDoc {{{redocHead}}} {{{redocHTML}}} # docs/openapi.yaml openapi: 3.1.0 info: version: 1.0.0 title: Students app license: name: Apache 2.0 url: description: > This is a documentation of students app tags: - name: Students description: Operations about users. - name: Auth description: Auth operations. servers: - url: - url: paths: components: securitySchemes: bearerAuth: type: http scheme: bearer ===== Бібліотека Swagger UI Express для публікації документаціїї swagger на сервері ===== [[https://www.npmjs.com/package/swagger-ui-express|Swagger UI Express - публікації документаціїї ]] ===== Розширення для VSCode Redocly OpenAPI: ===== Також перед початком написання документації ми радимо вам встановити розширення у VSCOde [[https://marketplace.visualstudio.com/items?itemName=Redocly.openapi-vs-code|Redocly OpenAPI]] ===== Використання ===== ==== preview ==== npm run preview-docs Перегляд попередньої збудованої сторінки буде доступний на **http://127.0.0.1:8080/** Взагалі в терміналі треба читати - там пише на який порт і куди сервіс запуститься.