1.0.2 • Published 5 years ago

@63pokupki/core-static-public-assets v1.0.2

Weekly downloads
-
License
-
Repository
-
Last release
5 years ago

Как запустить проект:

Для работы нужны два проекта: core и core-static Проекты должны располагаться в одной директории (делать git clone в одной родительской папке)

Установка core

Скачать проект: git clone git@git.63pokupki.ru:sp/core.git

Установить зависимости: в корне проекта

npm i

В директории src/Configs создать файл конфигурации MainConfig.js по примеру MainConfig.sample.js

Пример работающего (на момент написания) конфига:

// Конфигурация
module.exports = {
	mysql: { // Knex mysql
		client: 'mysql',
		connection: {
			host: '10.1.100.210',
			user: 'dbadm',
			password: 'Dbadm123!',
			database: 'spwww',
		},
		pool: {
			min: 0,
			max: 7,
		},
		migrations: {
			tableName: 'knex_migrations',
			directory: './src/Infrastructure/SQL/Migrations',
		},
		acquireConnectionTimeout: 60000,
		seeds: {
			directory: './src/Infrastructure/SQL/Seeds',
		},
	},
	common: { // Общие настройки
		env: 'dev', // Тип окружения
		oldCoreURL: 'http://dev.63pokupki.ru', // URL старого сайта old_core
		errorMute: false, // Режим тишины для ошибок только для консольных команд
		hook_url: 'https://mm.63pokupki.ru:8443/hooks/un1jemjyxjfz9ecqeqjrgde5sw', // Сообщения об ошибках matermost
		port: 3005, // порт на котором будет работать нода
	},

	/**
     * Конфигурация для sequelizejs. Соединение с Postgresql базой.
     * @see http://docs.sequelizejs.com/class/lib/sequelize.js~Sequelize.html#instance-constructor-constructor
     */
	mysql2: {
		dialect: 'mysql',
		host: '10.1.100.71',
		username: 'dbadm',
		password: 'Dbadm123!',
		database: 'SPWWW',
		logging: false,
		port: 3306,
		dialectOptions: {
			supportBigNumbers: true,
			decimalNumbers: true,
		},
	},

	redis: { // Конфигруация редиса
		url: 'redis://127.0.0.1:6379',
	},

	/**
     Конфиг подклчения RabbitMQ
     Для запуска на локальной машине
     docker run -d --hostname 0.0.0.0 --network host rabbitmq:3

     Документация
     https://docs.docker.com/samples/library/rabbitmq/
     https://www.rabbitmq.com/tutorials/tutorial-two-javascript.html

     пока работает с продом, для тестирования обновления каталогов

     s3_item_img - название очереди для загрузки картинок от оргов
     */

	rabbit: {
		// Список очередей которые будут подняты
		queryList: [
			's3_item_img', // Очередь для картинок каталога
			's3_item_img_do', // Очередь для картинок каталога на DO
			's3_item_img_migrate',
		],
		// Соединение с кроликом
		connection: 'amqp://192.168.0.97:5672',
	},

	/**
	 * todo: убрать
     * подключение к боевому S3 серверу
     * item - основной бакет для картинок товаров
     * item_test - тоже самое для теста
     */
	S3: { // item image - картинки размера x512 [devops]
		endpoint: 'https://fra1.digitaloceanspaces.com/',
		bucket: '63pokupki',
		baseUrl: 'https://63pokupki.fra1.cdn.digitaloceanspaces.com',
		access: 'IBRUUGJCVVWFXKMZIESM',
		secret: 'IFGdHM7pFsdCBVJgcXbzvtR2tHyfrIJh28Vzx0KvZ1s',
	},
	S3DO: { // Все остальные файлы [devops2]
		endpoint: 'https://fra1.digitaloceanspaces.com/',
		bucket: '63pokupkifiles',
		baseUrl: 'https://63pokupkifiles.fra1.cdn.digitaloceanspaces.com',
		access: 'KLNBNENOJV633XSEA6BN',
		secret: '770J6hhjuD6AegVhMtZ/o3GAZzbA3CKMzqpe5ftNCKA',
	},
	S3DO256: { // item image - картинки размера x256 [devops1]
		endpoint: 'https://fra1.digitaloceanspaces.com/',
		bucket: '63pokupki256',
		baseUrl: 'https://63pokupki256.fra1.cdn.digitaloceanspaces.com',
		access: 'F36HL4TDNCYVPPEZXNF4',
		secret: 'XrjfRDe71/inKUensI615+NjYIaDUkZsDkwM29Q1fnM',
	},
	S3DO512: { // item image - картинки размера x512 [devops]
		endpoint: 'https://fra1.digitaloceanspaces.com/',
		bucket: '63pokupki',
		baseUrl: 'https://63pokupki.fra1.cdn.digitaloceanspaces.com',
		access: 'IBRUUGJCVVWFXKMZIESM',
		secret: 'IFGdHM7pFsdCBVJgcXbzvtR2tHyfrIJh28Vzx0KvZ1s',
	},
};

Запустить проект: make watch

Установка core-static

Скачать: git clone git@git.63pokupki.ru:sp/core-static.git

Установить зависимости для frontend и backend частей отдельно: npm i в каждой из них

Команды писать каждую из своей директории:

Backend запуск в режиме слежения: make watch Frontend запуск в режиме слежения: npm run live

Остановить процесс в терминале Ctrl+C

При запуске в консоли будет выведен адрес и порт по которому нужно зайти для просмотра

Добавление статической страницы:

Со стороны backend

  1. Создать шаблон страницы в директории backend/src/Views/page/ и расширением .hbs. Шаблон будет включен в общий layout по умолчанию: backend/src/Views/layouts/main.hbs в секцию {{{ body }}} Все повторяющиеся блоки находятся в backend/src/Views/partials Функции-помощники, обертки, фильтры находятся в backend/src/Views/helpers

  2. В файле backend/src/Pages/Routes.ts добавить route и template по примеру

  3. В директории backend/src/Pages создать файл - контроллер (Express Router) для страницы. Пример ниже:

import * as express from "express";
import { faSendRouter } from "../System/Response";
import { DeliveryR } from "./Routes";
import { StaticRequest, faAjaxRequest } from "../System/Request";
import { faAuthMiddleware } from "../System/Middleware/AuthMiddleware";

const router = express.Router();

/**
 * Страница доставки
 */
router.get(
    DeliveryR.route, faAuthMiddleware,
    faSendRouter(DeliveryR.tpl, async (req: StaticRequest) => {

        /* СЕО */
        req.sys.seo.title = `Доставка - Совместные покупки (СП) в Самаре, Москве, Тольятти, Сызрани, Ульяновске, Димитровграде, Уфе, Перми, Краснодаре | «63покупки»`;
        req.sys.seo.description = `Доставка - 63pokupki.ru. Форум совместных покупок — это оптовые цены от производителей. Покупайте товары через интернет-магазин СП выгодно и с доставкой в разные города России.`;

        /**
         * Список пунктов доставки
         */
        const { data: delivery } = await faAjaxRequest("/delivery-page/get-delivery-list", req, {});
        return {
            delivery
        };
    })
);

export { router as DeliveryCtrl };

В нем можно запросить данные по апи и связать их с шаблоном. Если данные с апи не нужны, то функция должна вернуть пустой объект.

  1. Импортировать созданный ранее контроллер в backend/src/index.ts

  2. Применить контроллер app.use(ПЕРЕМЕННАЯ_НАЗВАНИЯ_КОНТРОЛЛЕРА); после всех вызовов app.use для middleware

  3. Запустить проекты core и core-static вместе, перейти по адресу, проверить на наличие ошибок. В дальнейшем изменения в шаблоне писать в режиме make watch (live режим)

  4. Просмотр: http://localhost:3080/page/имя-страницы, например - http://localhost:3080/page/Delivery

Со стороны frontend

При разработке удобно использовать общий файл стилей дизайн системы. Он собирается под названием ds.

При использовании на проде надо выделять отдельную точку входа в дизайн системе под конкретную страницу (для минимизации размера) А после подключить ее в файле entry.

Пример: 'delivery': ['./src/pages/static/delivery/Delivery.ts', './node_modules/@63pokupki/design-system/dist/css/delivery.css']

Создать файл Store.ts в поддиректории Store.

Необходимо импортировать модули хранилища: user и menu Пример:

/**
 * Vuex для этой страницы
 */
import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);

import { UserStore } from '../../../../Module/User/UserStore';
import { MenuStore } from '../../../../Module/Menu/MenuStore';

export const store = new Vuex.Store({
    modules: {
        UserStore,
        MenuStore
    }
});

Cоздать точку входа для страницы

В месте frontend/src/pages/static/НАЗВАНИЕ/НАЗВАНИЕ_ФАЙЛА. Инициализировать общие для всех страниц компоненты. Минимально необходимый набор:

import { store } from "./Store/Store";
import { faLoadCommonComponents } from "../../../CommonLoader";

/**
 * Инициализация страницы. Общие действия
 */
async function main() {
    await faLoadCommonComponents(store);
}

main();

Этот файл будет использоваться как точка входа в файле entry.js

Живая сборка запускается командой npm run live

1.0.2

5 years ago

1.0.1

5 years ago

1.0.0

5 years ago