Tic Tac Vue

Тик-Так-Вью

Tic-Tac-Vue -это простое одностраничное приложение JavaScript (SPA), написанное с помощью Vue, Vuex и Vue Router. Его цель - быть «тематическим исследованием» для начинающих, которые хотят изучать Vue и ее мощную экосистему.

Нажмите здесь, чтобы попробовать демо -версию онлайн.

Таблица контента

• Методологии
• Технические навыки
• Установить
• Использование

Методологии

В этом проекте я принял две методологии, чтобы иметь лучший факторизованный код и организованные исходные файлы: BEM и Atomic Design.

Бем

BEM (что означает модификатор блочного элемента)-это методология, которая помогает вам создать повторно используемые компоненты в фронтальной разработке. Все дело в разделении ваших классов CSS, используя блоки , элементы и модификаторы . Окончательный DOM может быть условно, но у вас будет лучший исходный код, и из -за того, что вам не нужно гнездовать классы CSS, ваш пакет CSS приведет к тому, что он приведет менее тяжелый.

Нажмите здесь, если вы хотите углубиться в BEM.

Атомный дизайн

Atomic Design - это методология создания систем проектирования. Подобно химии, вы можете организовать свой файл компонентов (в этом сценарии единичных компонентов) с использованием атомов , молекул и организмов .

Атомы

Атомы являются основными строительными блоками материи. Применяемые к веб -интерфейсам, атомы представляют собой наши HTML -теги, такие как метка формы, вход или кнопка.

Молекулы

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

Организмы

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

Технические навыки

Прежде всего, я настоятельно рекомендую вам взглянуть на документацию Vue, особенно для:

• Обработчики VUE
• Vue Reps
• VUE вычисляют свойства
• Vue единичные компоненты
• Штат Vuex
• Vuex Getters
• Вуэкс мутации
• Vue Router

Установить

Вы можете установить Tic-tac-vue, клонирование проекта:

 git clone https://github.com/Sanfra1407/tic-tac-vue.git

Затем установите зависимости NPM:

 npm install

Использование

Поскольку этот проект был разработан с помощью VITE.JS, вы можете использовать его собственные интегрированные команды CLI для обслуживания, создания или предварительного просмотра приложения.

Начать сервер dev

 npm run dev

Компилируется и минифизирует для производства

 npm run build

Предварительный просмотр встроенного приложения

 npm run preview

Линты и исправляют файлы

 npm run lint

Развертывать

Чтобы развернуть вашу заявку, вы можете следовать официальному руководству VITE.JS.