Прошло чуть больше 3 месяцев с момента моего последнего поста о создании платежного решения с использованием Javascript.



Да, иногда это может быть ошеломляюще с 9 до 5, я рад, что наконец смог сделать часть будущей серии о том, как создать платежный шлюз или решение с использованием Javascript.

В последнем посте я говорил о том, почему я выбрал JavaScript, и не буду повторяться здесь, однако я пришел к выводу, что использование других фреймворков (не для Javascript) или языков также может дать вам довольно хорошее и надежное решение. Поэтому в будущем я расскажу об использовании других языков (PHP и Python) и фреймворков (Laravel и Django), чтобы найти похожие или даже лучшие решения. Все сводится к тому, в чем вы хорошо разбираетесь.

Достаточно об этом, давайте углубимся в шлюз (JavaScript — NodeJS).

Начало

При этом мы будем использовать TypeScript, что, я считаю, является преимуществом по сравнению с использованием только JavaScript, чтобы избежать ошибок, которые могли проникнуть в среду выполнения. Видите ли, базовый JavaScript является динамическим и слабо типизированным, что может вызвать проблемы при управлении растущей кодовой базой, в то время как TypeScript, являющийся надмножеством JavaScript, обладает сильными характеристиками статической типизации, компиляции и объектно-ориентированного программирования, которые пригодятся при поиске. в больших проектах кода или когда-либо растущей базе кода, такой как платежный шлюз (из предыдущего блога вы увидите, что мы смотрим на интеграцию мобильных денег, VISA и MasterCard, SMS, электронную почту и другие функции выставления счетов и безопасности, которые имеют тенденцию постоянно меняться через некоторое время)

Поскольку у нас это не так, давайте начнем с настройки нашего шлюза с помощью TypeScript, Express и MongoDB.

Шаг 1

Мы создадим нашу папку и переместимся в нее:

$ mkdir gateway
$ cd gateway

Затем мы можем продолжить и инициализировать наш проект npm:

$ npm init

Вы можете использовать флаг -y, чтобы использовать значения по умолчанию npm init, автоматически говоря "да". Однако я люблю делать это личным 😎 поэтому я придумал что-то вроде этого:

Шаг 2 — Добавьте и настройте TypeScript

После инициализации нашего проекта следует добавить и настроить TypeScript. Помните, что это делается внутри папки нашего шлюза.

Сначала мы устанавливаем TypeSript, как показано ниже:

$ npm install --save-dev typescript

Затем мы добавляем файл tsconfig.json в корневой каталог gateway, который используется для настройки параметров компиляции TypeScript.

$ nano tsconfig.json

Затем вставьте код ниже:

Глядя на фрагмент выше, вот простое объяснение переменных, которые мы использовали:

  • module: указывает метод генерации кода модуля. Узел использует commonjs.
  • esModuleInterop: обеспечивает взаимодействие между модулями CommonJS и ES во время импорта.
  • target: указывает уровень языка вывода (мы используем ES6).
  • moduleResolution: Это помогает компилятору понять, на что ссылается импорт. Значение node имитирует механизм разрешения модуля Node.
  • sourceMap: создает соответствующий файл .map, позволяющий отладчикам и другим инструментам отображать исходный код TypeScript при работе с созданными файлами JavaScript.
  • outDir: это место для вывода .js файлов после компиляции. В нашем проекте мы будем использовать папкуdist.

Подробнее об этом читайте здесь Опции компилятора TypeScript

Шаг 3. Добавьте и настройте сервер Express.

Начнем с установки экспресса:

$ npm install --save express
$ npm install -save-dev @types/express
//We use the @types/express package for TypeScript to know about the types of Express classes.

Затем мы создаем папку src в нашей папке gateway для хранения файлов TypeScript с расширением .ts:

$ mkdir src

Затем мы добавляем файл с именем app.ts, который будет выступать в качестве нашего основного приложения проекта, и позже мы добавим соответствующий транспилированный файл app.js в package.json для запуска в качестве основного файла вместо index.js:

$ nano src/app.ts

Добавьте приведенный ниже код, чтобы создать минималистичный экспресс-сервер:

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

$ npx tsc

Вышеприведенное использует параметры конфигурации в tsconfig.json для создания .js файлов в папке dist, которые мы будем использовать при запуске приложения, как показано ниже:

$ node dist/app.js

Для успешного запуска мы получим вывод ниже:

Express is listening at http://localhost:3000

Вы можете открыть ссылку в браузере, и вы должны увидеть Hello World! в браузере. Ура!! Вы установили и настроили свой экспресс-сервер. Вы можете открыть dist/app.js и посмотреть, как это выглядит. Ниже приведен фрагмент.

Наконец, давайте установим и настроим MongoDB.

Шаг 4 — Добавьте и настройте MongoDB

Во-первых, вам нужно убедиться, что MongoDB установлена ​​и работает на вашем компьютере, вы можете использовать приведенные ниже ссылки для получения инструкций по установке, запуску и созданию базы данных (в нашем случае это должно быть gateway) в соответствии с вашей операционной системой. .

Мы можем продолжить и добавить mongodbи mongoose в наш проект, используя команду ниже:

$ npm install mongodb mongoose
$ npm install -save-dev @types/mongodb @types/mongoose

Далее мы собираемся подключиться к нашей базе данных, которую мы создали, обновив наш код app.ts, как показано ниже:

Мы импортировали модуль mongoose и использовали его для подключения к нашей базе данных, которая использует URL-адрес mongodb://localhost:27017/gateway. При успешном соединении db экспресс-сервер будет запущен, и вы получите следующий вывод:

Express is listening at http://localhost:3000

Ух ты! Это была длинная нить, но я благодарен, что вы нашли время, чтобы пройти через все это. Будет здорово, если вы похлопаете или даже подпишитесь на меня для будущих сообщений в этой серии и других темах. Далее мы рассмотрим действия с базой данных.

Если вам нужен код, используемый в этом посте, вы можете использовать ссылку ниже: