AdonisJS Framework Tutorial: создание полнофункционального веб-приложения

AdonisJS Framework Tutorial Программирование и разработка

Когда дело доходит до разработки веб-приложений, есть десятки фреймворков на выбор. Менее известный, но очень любимый фреймворк — AdonisJs, известный своим красивым кодом и простотой для бэкэнда.

AdonisJs — это узел. js MVC для согласованного, стабильного и выразительного кода. Адонис заботится о многих трудоемких деталях разработки, предлагая стабильную экосистему для серверных веб-приложений.

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

Что такое AdonisJs?

AdonisJs — это фреймворк Node.js, основанный на Laravel. Он реализует аналогичные концепции внедрения зависимостей и поставщиков, красивый код и интуитивно понятный дизайн. AdonisJs был разработан, чтобы доставлять разработчикам радость и легкость в их работе, поэтому он пренебрегает последовательным и выразительным API для разработки полнофункциональных веб-приложений.

Эта среда MVC в стиле Laravel фокусируется на основных аспектах создания масштабируемого, стабильного и масштабируемого веб-приложения, таких как:

  • Приятный опыт разработчика
  • Согласованный API
  • Скорость и производительность
  • Поддержка рассылки, аутентификации, проверки данных, Redis и т.д.

AdonisJs Плюсы и минусы

Давайте посмотрим на наиболее заметные плюсы и минусы AdonisJs.

Плюсы

  • Структура папок: AdonisJs предлагает удобную структуру папок, которая упрощает организацию.
  • Валидатор: AdonisJs предоставляет специальный провайдер валидации, который упрощает валидацию пользовательского ввода.
  • Lucid ORM: AdonisJs имеет первоклассную поддержку для таких баз данных, как MariaDB и MySQL.
  • ICO и поставщик услуг: AdonisJs предлагает простой способ управления зависимостями через IOC. Поставщики услуг могут управлять зависимостями жизненного цикла.
  • Безопасность: AdonisJs поставляется с инструментами для защиты веб-сайтов от распространенных веб-атак, таких как защита от межсайтовой подделки.
  • Тестирование: AdonisJS упрощает ручное тестирование, позволяя разработчикам писать функциональные модульные тесты для тестирования своих веб-приложений.
Читайте также:  Фильтрация данных в Django

Минусы

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

Структура папок AdonisJs

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

Напоминание: архитектура Model View Controller (MVC) состоит из трех частей:

  1. Модель: самый низкий уровень шаблона для хранения данных.
  2. Просмотр: это позволяет пользователю просматривать данные.
  3. Контроллер: программный код, управляющий моделью и представлением.

Давайте посмотрим на структуру папок AdonisJs и определим некоторые ключевые термины.

Давайте посмотрим на структуру папок AdonisJs

Приложение

Папка приложения содержит логику приложения, в том числе:

  • Контроллеры: они контролируют поток логики. Контроллеры можно связывать вместе с маршрутами.
  • Промежуточное ПО: Промежуточное ПО содержит методы, которые должны выполняться до или после HTTP-запроса.
  • Модели: они определяют модели и отношения базы данных.

Внутри папки приложения можно создать больше папок, таких как Validators, Exceptions, Helpers и ModelFilter.

Config

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

database

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

public

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

resources

Сюда мы помещаем шаблоны представлений и файлы шаблонов Edge.

start

Эти файлы используются для загрузки приложения. Здесь мы также можем создавать такие файлы, как Events, Redis и Hooks.

.env

Файл.env находится в корневой папке. Он будет содержать все переменные, связанные с нашей рабочей средой. У разработки и производства обычно разные настройки.

ace

Файл ace используется для выполнения команд, специфичных для проекта.

package.json

Это стандартный файл Node.js.

server.js

Этот файл загружает HTTP-сервер.

Создать базовое приложение

Теперь, когда мы знакомы с AdonisJs, давайте узнаем, как на самом деле создать наше первое приложение. Начать довольно просто. Во-первых, вы должны загрузить AdonisJs с официального сайта или пока можете воспользоваться встроенным виджетом программирования от Educative.

Мы начнем с adonisисполняемого файла, чтобы создать наше первое приложение. В этом примере мы создадим приложение для блога.

adonis new blog

Эта команда создает новый проект с именем blog. Затем мы войдем cdв каталог, чтобы запустить сервер.

cd blog
npm run dev

 

Выход:

[nodemon] starting `node --harmony_proxies server.js`
info adonis:framework serving app on http://localhost:3333

Создание маршрутов

Этот start/routes.jsфайл определяет шаблоны URL-адресов, к которым пользователи могут обращаться в качестве точек входа в веб-приложение. Когда пользователь запрашивает URL-адрес, Адонис находит шаблон URL-адреса внутри start/routes.js, поэтому, если шаблон совпадает, Адонис обрабатывает логику внутри этого маршрута.

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

AdonisJs предлагает маршрут по умолчанию, который отображает welcome.njkпредставление. Чтобы начать с нуля, мы должны сначала удалить это. Ниже мы реализуем код, который регистрирует 2 разных маршрута для домашней страницы и страницы контактов.

'use strict'
 
const Route = use('Route')
 
Route.on('/').render('home')
Route.on('/contact').render('contact')

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

Контроллеры обрабатывают логику приложения. Они связаны с нашими моделями, представлениями и помощниками. Контроллеры отвечают на HTTP-запросы, поэтому они не предназначены для включения в другие файлы.

Совет: попробуйте преобразовать контроллеры в отдельные файлы, чтобы избежать запутанного кода.

'use strict'
 
class TestController {
 hello(){
   return 'Hello from Controller'
 }
}
 
module.exports = TestController

Контроллеры обрабатывают логику приложения

Выход:

“Hello from controller”

Внутри app/Controllers/Http/TestController.jsфайла мы создали функцию с именем hello(). Мы обращаемся к контроллеру в строке 20. TestController- это имя этого контроллера и helloимя метода.

Создание представлений

Представления — это компоненты, видимые пользователю. Представления сохраняются в каталоге ресурсов / представлений с.njkрасширением. Ниже мы создаем два представления для наших страниц сверху.

./ace make:view home
./ace make:view contact

Ace — это служебный инструмент командной строки для Adonis, используемый для создания представлений, контроллеров и моделей.

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

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/css/bootstrap.css">
  <link rel="stylesheet" href="/style.css">
</head>
<body>
  <div class="container">
 
    <div class="header clearfix">
      <nav>
        <ul class="nav nav-pills pull-xs-right">
          <li class="nav-item"><a href="/" class="nav-link">Home</a></li>
          <li class="nav-item"><a href="/about" class="nav-link">About</a></li>
          <li class="nav-item"><a href="/contact" class="nav-link">Contact</a></li>
        </ul>
        <h3 class="text-muted"> Adonis Blog </h3>
      </nav>
    </div>
 
    <section>
      {% block content %}{% endblock %}
    </section>
 
  </div>
</body>
</html>

Оттуда мы можем расширить базовый шаблон на другие представления и добавить CSS в public/style.cssфайл.

Части приложения AdonisJs

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

ПО промежуточного слоя

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

  • Сервер: выполняется до того, как запрос попадет в систему маршрутизатора
  • Глобальный: выполняется, когда шаблон маршрута совпадает с URL-запросом.
  • Именованный: прикрепляется к определенному маршруту или группе маршрутов и выполняется для них.

Промежуточное ПО создается внутри папки app/Middlewareи регистрируется внутри start/kernel.jsфайла.

Промежуточное ПО создается внутри папки app

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

'use strict';
 
class AuthRequired {
 async handle ({ auth, response }, next) {
   try {
     await auth.check()
   } catch (error) {
     return response.json({
       error: "Unauthorized access"
     })
   }
   // call next() to advance the request
   await next()
 }
}
 
module.exports = AuthRequired;

Способы запроса

Объект запроса предлагает методы для получения информации о запросе. Мы можем создавать маршруты к URL-адресам в start/route.jsфайле. AdonisJs создает объект запроса для любого запроса URL с помощью глобального промежуточного программного обеспечения.

Глобальное промежуточное ПО выполняет это по умолчанию BodyParser. Есть много способов запроса. Ниже мы назвали несколько:

  • request.all(): Возвращает объект, содержащий все данные запроса (включая параметры запроса и данные тела запроса).
  • request.get(): Возвращает объект, содержащий данные параметров запроса.
  • request.post(): Возвращает объект, содержащий данные тела запроса из отправленной формы.
  • request.input(key): Возвращает значение указанного ключа.
Оцените статью
bestprogrammer.ru
Добавить комментарий