ShablonForWebsites

Шаблоны для создания сайтов. Это расширение позволяет быстро вставлять готовые шаблоны для различных компонентов сайтов.

Функции

• Поддержка различных шаблонов.
• Легко настраиваемое расширение.

Требования

• Visual Studio Code версии 1.95.0 или выше.

Установка

1. Установите расширение из Visual Studio Code Marketplace или вручную установите .vsix файл.
2. Перейдите в меню "Extensions" (Расширения).
3. Нажмите на три точки в правом верхнем углу панели расширений и выберите "Install from VSIX...".
4. Выберите .vsix файл и установите его.

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

Для начала введите команду в любой папке (для создания package.json) - npm init -y

Далее жмём всегда для ввода чего-то туда куда хотим ввести и - ctrl + shift + p (Вводим Insert (Название команды))

Переходим в package.json

Вводим packagejson

Далее скачиваем все нужные библиотеки (вводим в терминал) - npm install

Теперь создаём такую структуру данных

(Любая папка)

├── node_modules

├── public

│ ├── css

│ │ └── styles.css

│ ├── js

│ │ ├── admin.js

│ │ ├── login.js

│ │ ├── order-form.js

│ │ ├── orders.js

│ │ └── register.js

│ ├── admin.html

│ ├── index.html

│ ├── login.html

│ ├── order-form.html

│ ├── orders.html

│ └── register.html

├── create.js

├── package-lock.json

├── package.json

└── server.js

В server.js вводим - server

После строки const bcrypt = require('bcrypt'); - insertDBConnection (Соединение с бд, введите пароль (обычно это root), затем название бд (сделайте её зарание в PGAdmin))

После функции adminAuth - MH (просмотр всех папок)

Затем, после этого вводим - MainBE (Функционал)

Теперь в файле create.js - BDCreate (Создание БД)

После этого введите в терминал - node create.js (затем ctrl + c для отмены)

Далее в файлах js, css пишем их названия, а в html пишем названия + .html (Примеры order, admin.html)

А, ой, в PGAdmin нужно будет менять себе роль, чтобы быть админом

Команды

Расширение предоставляет следующие команды:

1. Insert DB Connection

   • Команда: extension.insertDBConnection
   • Вставляет шаблон для подключения к базе данных PostgreSQL.

2. Insert styles root

   • Команда: extension.insertFigmaStyles
   • Вставляет стили для корневого элемента.

3. Insert server

   • Команда: extension.server
   • Вставляет шаблон для настройки сервера Express.

4. Insert BDCreate

   • Команда: extension.BDCreate
   • Вставляет шаблон для создания таблиц в базе данных PostgreSQL.

5. Insert MainBE

   • Команда: extension.MainBE
   • Вставляет основной бэкенд код.

6. Insert package.json

   • Команда: extension.packagejson
   • Вставляет шаблон для файла package.json.

7. Insert MH

   • Команда: extension.MH
   • Вставляет шаблон для главного файла.

8. Insert stule.css

   • Команда: extension.stule
   • Вставляет шаблон для файла stule.css.

9. Insert Admin Code

   • Команда: extension.admin
   • Вставляет шаблон для панели администратора.

10. Insert Login Code

    • Команда: extension.login
    • Вставляет шаблон для страницы входа.

11. Insert Order Form Code

    • Команда: extension.orderForm
    • Вставляет шаблон для формы заказа.

12. Insert Orders Code

    • Команда: extension.orders
    • Вставляет шаблон для отображения заказов.

13. Insert Register Code

    • Команда: extension.register
    • Вставляет шаблон для страницы регистрации.

14. Insert index.html

    • Команда: extension.index.html
    • Вставляет шаблон для файла index.html.

15. Insert register.html

    • Команда: extension.register.html
    • Вставляет шаблон для файла register.html.

16. Insert login.html

    • Команда: extension.login.html
    • Вставляет шаблон для файла login.html.

17. Insert orders.html

    • Команда: extension.orders.html
    • Вставляет шаблон для файла orders.html.

18. Insert order-form.html

    • Команда: extension.order-form.html
    • Вставляет шаблон для файла order-form.html.

19. Insert admin.html

    • Команда: extension.admin.html
    • Вставляет шаблон для файла admin.html.

Известные Проблемы

• На данный момент известных проблем нет.

Примечания к Релизу

1.0.0

Первый выпуск ShablonForWebsites.

Наслаждайтесь!