Vue Search System

Vue Search System - это поисковая система по репозиториям Github

• SPA структура
• Адаптировность, основные размеры экранара (Desktop, Table, Mobile)
• Кроссбраузерность (для IE >= 10)
• Демонстрация возможностей связки Vue.js + Vuex

DEMO

Стэк технологий

• Vue.js
• Vuex
• Vue Router
• Vue CLI v3.x
• Webpack - работает под капотом Vue CLI (+ кастомный конфиг vue.config.js)

а также:

• Pug
• SASS/SCSS
• БЭМ
• Code-style (Airbnb)

Основная структура проекта

vue-search-system
└── dist/
└── public/
└── src/
    └── assets/
    └── compiledIcons/
    └── components/
    └── config/
    └── core/
    └── layouts/
    └── pages/
    └── plugins/
    └── store/
    └── styles/
    └── ui/
    └── utils/
    |
    └── App.vue
    └── main.js
    └── router.js

└── package.json
└── vue.config.js
└── README.md
└── ...

• compiledIcons/ - скомпилированные svg-иконки
• assets/ - основные ассеты приложения (шрифты, картинки, иконки, и т.д.)
• components/ - основные компоненты приложения
• config/ - конфиги
• core/ - основное ядро приложения, "Фасад" для манипуляций с данными (запросы к API, фильтрация, и т.д.)
• layouts/ - компоненты отображения, макеты (layouts)
• pages/ - компоненты страниц (Home, About, etc.)
• plugins/ - кастомные функционал Vue.js (Плагины)
• store/ - компоненты хранилища, глобальное состояние (Vuex Store)
• styles/ - глобальные стили (миксины, variables, transitions, etc.)
• ui/ - базовые, кастомные компоненты интерфейса (кнопки, селекты, инпуты, иконки, и т.д.)
• utils/ - вспомогательные скрипты и утилиты (Хэлперы)
• App.vue - основной компонент приложения
• main.js - точка входа
• router.js - маршрутизация приложения

Установка

Для работы необходим Node.js и менеджер пакетов (npm или yarn)

• Node.js - v10.14.2
• yarn - v1.15.2

1. Установить зависимости

cd vue-gallery
yarn install

2. Собрать svg иконки (разовая сборка)

yarn run svg

3. Собрать локально, запустить дев сервер

yarn start

Боевая сборка

В последствии сборка и деплой будет автоматизирована, но пока что все скрипты запускаются независимо

Собрать и минифицировать билд

yarn build

Запустить eslint

yarn lint

Деплой

yarn deploy

Для деплоя и хостинга используется платформа Now Platform v2.0 - Cборщик @now/static-build

TODO