full, i am sure

.gitignore

@@ -5,6 +5,7 @@
 !.vscode/launch.json
 !.vscode/extensions.json
 !.vscode/*.code-snippets
+.history/*
 
 # Local History for Visual Studio Code
 .history/
@@ -12,3 +13,35 @@
 # Built Visual Studio Code Extensions
 *.vsix
 
+# Compiled output
+/dist
+/tmp
+/out-tsc
+/bazel-out
+
+# Node
+/node_modules
+npm-debug.log
+yarn-error.log
+
+# IDEs and editors
+.idea/
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# Miscellaneous
+/.angular/cache
+.sass-cache/
+/connect.lock
+/coverage
+/libpeerconnection.log
+testem.log
+/typings
+
+# System files
+.DS_Store
+Thumbs.db

.vscode/launch.json

@@ -0,0 +1,14 @@
+{
+    "configurations": [
+        {
+            "type": "java",
+            "name": "Spring Boot-ServerApplication<server>",
+            "request": "launch",
+            "cwd": "${workspaceFolder}",
+            "mainClass": "com.example.server.ServerApplication",
+            "projectName": "server",
+            "args": "",
+            "envFile": "${workspaceFolder}/.env"
+        }
+    ]
+}

.vscode/settings.json

@@ -0,0 +1,54 @@
+{
+    "files.autoSave": "onFocusChange",
+    "files.eol": "\n",
+    "editor.detectIndentation": false,
+    "editor.formatOnType": false,
+    "editor.formatOnPaste": true,
+    "editor.formatOnSave": true,
+    "editor.tabSize": 4,
+    "editor.insertSpaces": true,
+    "editor.codeActionsOnSave": {
+        "source.organizeImports": "explicit",
+        "source.sortImports": "explicit"
+    },
+    "editor.snippetSuggestions": "bottom",
+    "debug.toolBarLocation": "commandCenter",
+    "debug.showVariableTypes": true,
+    "errorLens.gutterIconsEnabled": true,
+    "errorLens.messageEnabled": false,
+    "prettier.tabWidth": 4,
+    "prettier.singleQuote": false,
+    "prettier.printWidth": 120,
+    "prettier.trailingComma": "es5",
+    "prettier.useTabs": false,
+    "[json]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[jsonc]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[javascript]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[css]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[html]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "java.compile.nullAnalysis.mode": "automatic",
+    "java.configuration.updateBuildConfiguration": "automatic",
+    "[java]": {
+        "editor.pasteAs.enabled": false,
+        "editor.codeActionsOnSave": {
+            "source.organizeImports": "never",
+            "source.sortImports": "explicit"
+        }
+    },
+    "gradle.nestedProjects": true,
+    "java.saveActions.organizeImports": true,
+    "java.dependency.packagePresentation": "hierarchical",
+    "java.codeGeneration.hashCodeEquals.useJava7Objects": true,
+    "spring-boot.ls.problem.boot2.JAVA_CONSTRUCTOR_PARAMETER_INJECTION": "WARNING",
+    "spring.initializr.defaultLanguage": "Java"
+}

MyWebSite/.eslintrc.json

@@ -0,0 +1,16 @@
+{
+    "env": {
+        "browser": true,
+        "es2021": true
+    },
+    "extends": ["airbnb-base", "prettier"],
+    "plugins": ["prettier", "html"],
+    "parserOptions": {
+        "ecmaVersion": 12,
+        "sourceType": "module"
+    },
+    "rules": {
+        "prettier/prettier": "error",
+        "no-console": "off"
+    }
+}

MyWebSite/.prettierrc

@@ -0,0 +1,7 @@
+{
+    "tabWidth": 4,
+    "singleQuote": false,
+    "printWidth": 120,
+    "trailingComma": "es5",
+    "useTabs": false
+}

MyWebSite/.vscode/extensions.json

@@ -0,0 +1,8 @@
+{
+    "recommendations": [
+        "usernamehw.errorlens",
+        "AndersEAndersen.html-class-suggestions",
+        "dbaeumer.vscode-eslint",
+        "esbenp.prettier-vscode"
+    ]
+}

MyWebSite/.vscode/launch.json

@@ -0,0 +1,14 @@
+{
+    "configurations": [
+        {
+            "type": "java",
+            "name": "Spring Boot-ServerApplication<server>",
+            "request": "launch",
+            "cwd": "${workspaceFolder}",
+            "mainClass": "com.example.server.ServerApplication",
+            "projectName": "server",
+            "args": "",
+            "envFile": "${workspaceFolder}/.env"
+        }
+    ]
+}

MyWebSite/.vscode/settings.json

@@ -0,0 +1,43 @@
+{
+    "files.autoSave": "onFocusChange",
+    "files.eol": "\n",
+    "editor.detectIndentation": false,
+    "editor.formatOnType": false,
+    "editor.formatOnPaste": true,
+    "editor.formatOnSave": true,
+    "editor.tabSize": 4,
+    "editor.insertSpaces": true,
+    "editor.codeActionsOnSave": {
+        "source.organizeImports": "explicit",
+        "source.sortImports": "explicit"
+    },
+    "editor.snippetSuggestions": "bottom",
+    "debug.toolBarLocation": "commandCenter",
+    "debug.showVariableTypes": true,
+    "errorLens.gutterIconsEnabled": true,
+    "errorLens.messageEnabled": false,
+    "prettier.tabWidth": 4,
+    "prettier.singleQuote": false,
+    "prettier.printWidth": 120,
+    "prettier.trailingComma": "es5",
+    "prettier.useTabs": false,
+    "[json]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[jsonc]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[javascript]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[css]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[html]": {
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "java.configuration.updateBuildConfiguration": "interactive",
+    "java.compile.nullAnalysis.mode": "automatic",
+    "java.import.gradle.buildServer.enabled": false,
+    "java.import.gradle.enabled": true
+}

MyWebSite/App.jsx

@@ -0,0 +1,24 @@
+import 'bootstrap/dist/css/bootstrap.min.css';
+import 'bootstrap/dist/js/bootstrap.bundle.min';
+import BasketPage from './pages/BasketPage';
+import { Route, BrowserRouter as Router, Routes } from 'react-router-dom';
+import CatalogPage from './pages/CatalogPage';
+import DiscountsPage from './pages/DiscountsPage';
+import HomePage from './pages/HomePage';
+import ContactUsPage from './pages/ContactUsPage';
+
+function App() {
+  return (
+    <Router>
+      <Routes>
+        <Route path="/" element={<HomePage />} />
+        <Route path="/catalog" element={<CatalogPage />} />
+        <Route path="/discounts" element={<DiscountsPage />} />
+        <Route path="/basket" element={<BasketPage />} />
+        <Route path="/contact" element={<ContactUsPage />} />
+      </Routes>
+    </Router>
+  );
+}
+
+export default App;

MyWebSite/basket1.html

@@ -0,0 +1,200 @@
+<!doctype html>
+<html lang="ru">
+    <head>
+        <meta charset="utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <title>Корзина | Книжный интернет-магазин "Тома"</title>
+        <!-- Bootstrap CSS -->
+        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" />
+        <!-- Bootstrap Icons -->
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css" />
+        <!-- Ваш CSS -->
+        <link rel="stylesheet" href="style.css" />
+    </head>
+    <body>
+        <!-- Навигация -->
+        <nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top shadow-sm">
+            <div class="container">
+                <a class="navbar-brand d-flex align-items-center" href="index.html">
+                    <img src="../server/src/main/resources/static/assets/logo.png" alt="Логотип" class="logo me-2" />
+                    <span class="d-none d-lg-block">Книжный магазин "Тома"</span>
+                    <span class="d-lg-none">"Тома"</span>
+                </a>
+
+                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarContent">
+                    <span class="navbar-toggler-icon"></span>
+                </button>
+
+                <div class="collapse navbar-collapse" id="navbarContent">
+                    <ul class="navbar-nav ms-auto">
+                        <li class="nav-item dropdown">
+                            <a
+                                class="nav-link dropdown-toggle"
+                                href="#"
+                                id="navbarDropdown"
+                                role="button"
+                                data-bs-toggle="dropdown"
+                                aria-expanded="false"
+                            >
+                                Страницы
+                            </a>
+                            <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
+                                <li><a class="dropdown-item" href="index.html">Главная</a></li>
+                                <li><a class="dropdown-item" href="catalog.html">Каталог</a></li>
+                                <li><a class="dropdown-item" href="discounts.html">Скидки</a></li>
+                                <li><a class="dropdown-item" href="basket.html">Корзина</a></li>
+                                <li><a class="dropdown-item" href="contactUs.html">Контакты</a></li>
+                            </ul>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link position-relative show-cart-btn" href="#">
+                                <i class="bi bi-cart3"></i>
+                                <span
+                                    class="cart-count badge bg-danger rounded-pill position-absolute top-0 start-100 translate-middle"
+                                    style="display: none"
+                                ></span>
+                            </a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </nav>
+
+        <!-- Основной контент -->
+        <main class="container mt-5 pt-5">
+            <div class="row justify-content-center">
+                <div class="col-lg-10">
+                    <h2 class="text-center mb-4">Ваша корзина</h2>
+
+                    <!-- Список товаров -->
+                    <div id="cartItemsContainer">
+                        <!-- Товары будут загружены через JavaScript -->
+                    </div>
+
+                    <!-- Итоговая информация -->
+                    <div class="card mb-4 border-danger">
+                        <div class="card-body">
+                            <div class="d-flex justify-content-between align-items-center">
+                                <h4 class="mb-0">Общая стоимость:</h4>
+                                <h4 class="mb-0" id="cartTotal">0 руб.</h4>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- Кнопки действий -->
+                    <div class="d-flex justify-content-between mb-5">
+                        <a href="catalog.html" class="btn btn-outline-primary">
+                            <i class="bi bi-arrow-left me-2"></i>Продолжить покупки
+                        </a>
+                        <div>
+                            <button id="clearCartBtn" class="btn btn-outline-danger me-2">
+                                <i class="bi bi-trash me-2"></i>Очистить корзину
+                            </button>
+                            <button id="checkoutBtn" class="btn btn-success btn-lg px-4">
+                                <i class="bi bi-credit-card me-2"></i>Оформить заказ
+                            </button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </main>
+
+        <!-- Подвал -->
+        <footer class="bg-light py-4 mt-5">
+            <div class="container">
+                <div class="row">
+                    <div class="col-md-6 mb-4 mb-md-0">
+                        <h5 class="mb-3">Контакты</h5>
+                        <ul class="list-unstyled">
+                            <li><i class="bi bi-envelope me-2"></i> info@toma.ru</li>
+                            <li><i class="bi bi-phone me-2"></i> +7 (123) 456-78-90</li>
+                            <li><i class="bi bi-clock me-2"></i> Пн-Пт 9:00-18:00</li>
+                            <li><i class="bi bi-geo-alt me-2"></i> г. Москва, ул. Литераторов, д. 1</li>
+                        </ul>
+                    </div>
+
+                    <div class="col-md-6 text-md-end">
+                        <h5 class="mb-3">Социальные сети</h5>
+                        <div class="social-media">
+                            <a href="#" class="text-decoration-none me-3"><i class="bi bi-facebook fs-3"></i></a>
+                            <a href="#" class="text-decoration-none me-3"><i class="bi bi-vk fs-3"></i></a>
+                            <a href="#" class="text-decoration-none"><i class="bi bi-telegram fs-3"></i></a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </footer>
+
+        <!-- Bootstrap JS -->
+        <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>
+
+        <!-- Наш компонент -->
+        <script src="bookComponent.js"></script>
+
+        <script>
+            // Инициализация корзины на странице basket.html
+            document.addEventListener("DOMContentLoaded", async () => {
+                const model = new BookModel();
+                const view = new BookView();
+                const controller = new BookController(model, view);
+
+                // Загружаем и отображаем корзину при загрузке страницы
+                const cartItems = await model.fetchCartItems();
+                view.renderCart(cartItems);
+
+                // Обновляем счетчик в навигации
+                await controller.updateCartCount();
+
+                // Обработчики для кнопок на странице корзины
+                document.getElementById("clearCartBtn").addEventListener("click", async () => {
+                    if (confirm("Вы уверены, что хотите очистить корзину?")) {
+                        await model.clearCart();
+                        view.renderCart([]);
+                        await controller.updateCartCount();
+                    }
+                });
+
+                document.getElementById("checkoutBtn").addEventListener("click", () => {
+                    alert("Заказ оформлен! Спасибо за покупку!");
+                    model.clearCart();
+                    view.renderCart([]);
+                    controller.updateCartCount();
+                });
+
+                // Обработчик изменения количества товаров
+                document.addEventListener("change", async (event) => {
+                    if (event.target.classList.contains("cart-item-quantity")) {
+                        const id = parseInt(event.target.dataset.id);
+                        const quantity = parseInt(event.target.value);
+
+                        if (quantity > 0) {
+                            await model.updateCartItem(id, { quantity });
+                            const cartItems = await model.fetchCartItems();
+                            view.renderCart(cartItems);
+                            await controller.updateCartCount();
+                        } else {
+                            event.target.value = 1;
+                        }
+                    }
+                });
+
+                // Обработчик удаления товаров
+                document.addEventListener("click", async (event) => {
+                    if (
+                        event.target.classList.contains("remove-from-cart") ||
+                        event.target.closest(".remove-from-cart")
+                    ) {
+                        const id = parseInt(
+                            event.target.dataset.id || event.target.closest(".remove-from-cart").dataset.id
+                        );
+                        await model.removeFromCart(id);
+                        const cartItems = await model.fetchCartItems();
+                        view.renderCart(cartItems);
+                        await controller.updateCartCount();
+                    }
+                });
+            });
+        </script>
+    </body>
+</html>

MyWebSite/bookComponent.js

@@ -0,0 +1,794 @@
+import React from "react";
+
+// Модель
+class BookModel {
+    constructor() {
+        this.API_URL = "http://localhost:3001";
+    }
+
+    async fetchGenres() {
+        try {
+            const response = await fetch(`${this.API_URL}/genres`);
+            if (!response.ok) throw new Error("Ошибка загрузки жанров");
+            return await response.json();
+        } catch (error) {
+            console.error("fetchGenres error:", error);
+            return [];
+        }
+    }
+    async createGenre(genreData) {
+        try {
+            const response = await fetch(`${this.API_URL}/genres`, {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(genreData),
+            });
+            if (!response.ok) throw new Error("Ошибка создания жанра");
+            return await response.json();
+        } catch (error) {
+            console.error("createGenre error:", error);
+            throw error;
+        }
+    }
+    async fetchBooksByGenre(genreId) {
+        try {
+            const response = await fetch(`${this.API_URL}/books?genreId=${genreId}`);
+            if (!response.ok) throw new Error("Ошибка загрузки книг");
+            return await response.json();
+        } catch (error) {
+            console.error("fetchBooksByGenre error:", error);
+            return [];
+        }
+    }
+
+    async fetchBook(id) {
+        try {
+            const response = await fetch(`${this.API_URL}/books/${id}`);
+            if (!response.ok) throw new Error("Ошибка загрузки книги");
+            return await response.json();
+        } catch (error) {
+            console.error("fetchBook error:", error);
+            return null;
+        }
+    }
+
+    async createBook(bookData) {
+        try {
+            const response = await fetch(`${this.API_URL}/books`, {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(bookData),
+            });
+            if (!response.ok) throw new Error("Ошибка создания книги");
+            return await response.json();
+        } catch (error) {
+            console.error("createBook error:", error);
+            throw error;
+        }
+    }
+
+    async updateBook(id, bookData) {
+        try {
+            const response = await fetch(`${this.API_URL}/books/${id}`, {
+                method: "PUT",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(bookData),
+            });
+            if (!response.ok) throw new Error("Ошибка обновления книги");
+            return await response.json();
+        } catch (error) {
+            console.error("updateBook error:", error);
+            throw error;
+        }
+    }
+
+    async deleteBook(id) {
+        try {
+            const response = await fetch(`${this.API_URL}/books/${id}`, {
+                method: "DELETE",
+            });
+            if (!response.ok) throw new Error("Ошибка удаления книги");
+            return await response.json();
+        } catch (error) {
+            console.error("deleteBook error:", error);
+            throw error;
+        }
+    }
+
+    async fetchCartItems() {
+        try {
+            const response = await fetch(`${this.API_URL}/cart?_expand=book`);
+            if (!response.ok) throw new Error("Ошибка загрузки корзины");
+            return await response.json();
+        } catch (error) {
+            console.error("fetchCartItems error:", error);
+            return [];
+        }
+    }
+
+    async addToCart(bookId) {
+        try {
+            const existingItem = await this.getCartItemByBookId(bookId);
+
+            if (existingItem) {
+                return await this.updateCartItem(existingItem.id, { quantity: existingItem.quantity + 1 });
+            } else {
+                const response = await fetch(`${this.API_URL}/cart`, {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify({ bookId, quantity: 1 }),
+                });
+                if (!response.ok) throw new Error("Ошибка добавления в корзину");
+                return await response.json();
+            }
+        } catch (error) {
+            console.error("addToCart error:", error);
+            throw error;
+        }
+    }
+
+    async getCartItemByBookId(bookId) {
+        try {
+            const response = await fetch(`${this.API_URL}/cart?bookId=${bookId}`);
+            if (!response.ok) throw new Error("Ошибка проверки корзины");
+            const items = await response.json();
+            return items[0] || null;
+        } catch (error) {
+            console.error("getCartItemByBookId error:", error);
+            return null;
+        }
+    }
+
+    async updateCartItem(id, data) {
+        try {
+            const response = await fetch(`${this.API_URL}/cart/${id}`, {
+                method: "PATCH",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(data),
+            });
+            if (!response.ok) throw new Error("Ошибка обновления корзины");
+            return await response.json();
+        } catch (error) {
+            console.error("updateCartItem error:", error);
+            throw error;
+        }
+    }
+
+    async removeFromCart(id) {
+        try {
+            const response = await fetch(`${this.API_URL}/cart/${id}`, {
+                method: "DELETE",
+            });
+            if (!response.ok) throw new Error("Ошибка удаления из корзины");
+            return await response.json();
+        } catch (error) {
+            console.error("removeFromCart error:", error);
+            throw error;
+        }
+    }
+
+    async clearCart() {
+        try {
+            const items = await this.fetchCartItems();
+            await Promise.all(items.map((item) => this.removeFromCart(item.id)));
+            return true;
+        } catch (error) {
+            console.error("clearCart error:", error);
+            throw error;
+        }
+    }
+}
+
+// Представление
+class BookView {
+    constructor() {
+        this.bookModal = document.getElementById("bookModal")
+            ? new bootstrap.Modal(document.getElementById("bookModal"))
+            : null;
+        this.bookModalTitle = document.getElementById("bookModalLabel");
+        this.bookForm = document.getElementById("bookForm");
+        this.genreSelect = document.getElementById("bookGenre");
+        this.genreModal = document.getElementById("genreModal")
+            ? new bootstrap.Modal(document.getElementById("genreModal"))
+            : null;
+        this.genreModalTitle = document.getElementById("genreModalLabel");
+        this.genreForm = document.getElementById("genreForm");
+        this.cartModal = document.getElementById("cartModal")
+            ? new bootstrap.Modal(document.getElementById("cartModal"))
+            : null;
+
+        // Ищем контейнеры корзины на разных страницах
+        this.cartItemsContainer = document.getElementById("cartItemsContainer") || document.getElementById("cartItems");
+        this.cartTotal = document.getElementById("cartTotal") || document.querySelector("#cartModal #cartTotal");
+        // Инициализация refs для модальных окон
+        this.modalRefs = {
+            bookModal: React.createRef(),
+            genreModal: React.createRef(),
+            cartModal: React.createRef(),
+        };
+    }
+
+    renderBooks(books, genreName) {
+        const container = document.getElementById("books-container");
+        if (!container) return;
+        container = document.getElementById(`${genreName.toLowerCase()}-books`);
+        if (!container) {
+            console.warn(`Контейнер для жанра ${genreName} не найден`);
+            return;
+        }
+
+        container.innerHTML = "";
+
+        if (!books || books.length === 0) {
+            container.innerHTML = '<div class="col-12 text-muted">Книги не найдены</div>';
+            return;
+        }
+
+        books.forEach((book) => {
+            const bookCard = this.createBookCard(book);
+            container.appendChild(bookCard);
+        });
+    }
+
+    renderGenresSections(genres) {
+        const main = document.querySelector("main");
+        if (!main) return;
+
+        // Удаляем старые секции жанров
+        document.querySelectorAll(".genre-section").forEach((section) => section.remove());
+
+        // Создаём новые секции для каждого жанра
+        genres.forEach((genre) => {
+            const section = document.createElement("section");
+            section.className = "mb-5 genre-section";
+            section.innerHTML = `
+                <div class="genre-title bg-light p-3 rounded text-center mb-4">
+                    <h3>${genre.name}</h3>
+                </div>
+                <div class="row g-4" id="${genre.name.toLowerCase()}-books"></div>
+            `;
+            main.insertBefore(section, main.querySelector("footer"));
+        });
+    }
+
+    createBookCard(book) {
+        const col = document.createElement("div");
+        col.className = "col-md-6 mb-4";
+
+        col.innerHTML = `
+            <div class="card h-100 border-0 shadow-sm" data-id="${book.id}">
+                <div class="row g-0">
+                    <div class="col-md-4">
+                        <img src="${book.image || "images/default-book.jpg"}" 
+                            class="img-fluid rounded-start h-100" 
+                            alt="${book.title || "Без названия"}" 
+                            style="object-fit: cover"
+                            onerror="this.src='images/default-book.jpg'">
+                    </div>
+                    <div class="col-md-8">
+                        <div class="card-body">
+                            <h5 class="card-title">${book.title || "Без названия"}</h5>
+                            <p class="card-text text-muted">${book.author || "Автор не указан"}</p>
+                            <p class="card-text">${book.description || "Описание отсутствует"}</p>
+                            <div class="d-flex justify-content-between align-items-center">
+                                <p class="h5 mb-0">${book.price || 0} руб.</p>
+                                <div>
+                                    <button class="btn btn-primary me-2 mb-2 add-to-cart">В корзину</button>
+                                    <button class="btn btn-outline-secondary me-2 mb-2 edit-book">Редактировать</button>
+                                    <button class="btn btn-outline-danger delete-book">Удалить</button>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        `;
+
+        return col;
+    }
+
+    renderGenreSelect(genres) {
+        if (!this.genreSelect) {
+            console.error("Элемент выбора жанра не найден");
+            return;
+        }
+
+        this.genreSelect.innerHTML = (genres || [])
+            .map((genre) => `<option value="${genre.id}">${genre.name}</option>`)
+            .join("");
+    }
+
+    renderCart(cartItems) {
+        if (!this.cartItemsContainer || !this.cartTotal) {
+            console.error("Элементы корзины не найдены");
+            return;
+        }
+
+        this.cartItemsContainer.innerHTML = "";
+
+        let total = 0;
+
+        if (!cartItems || cartItems.length === 0) {
+            this.cartItemsContainer.innerHTML = '<p class="text-muted">Корзина пуста</p>';
+            this.cartTotal.textContent = "0 руб.";
+            return;
+        }
+
+        cartItems.forEach((item) => {
+            if (!item.book) return;
+
+            const book = item.book;
+            const itemTotal = (book.price || 0) * (item.quantity || 1);
+            total += itemTotal;
+
+            const cartItem = document.createElement("div");
+            cartItem.className = "card mb-3";
+            cartItem.innerHTML = `
+                <div class="card-body">
+                    <div class="row align-items-center">
+                        <div class="col-md-2">
+                            <img src="${book.image || "images/default-book.jpg"}" 
+                                alt="${book.title || "Без названия"}" 
+                                class="img-fluid rounded"
+                                onerror="this.src='images/default-book.jpg'">
+                        </div>
+                        <div class="col-md-6">
+                            <h5>${book.title || "Без названия"}</h5>
+                            <p class="text-muted">${book.author || "Автор не указан"}</p>
+                            <p>Цена: ${book.price || 0} руб. × ${item.quantity || 1} = ${itemTotal} руб.</p>
+                        </div>
+                        <div class="col-md-2">
+                            <input type="number" min="1" value="${item.quantity || 1}" 
+                                class="form-control cart-item-quantity" 
+                                data-id="${item.id}">
+                        </div>
+                        <div class="col-md-2 text-center">
+                            <button class="btn btn-outline-danger remove-from-cart" data-id="${item.id}">
+                                <i class="bi bi-trash"></i>
+                            </button>
+                        </div>
+                    </div>
+                </div>
+            `;
+            this.cartItemsContainer.appendChild(cartItem);
+        });
+
+        this.cartTotal.textContent = `${total} руб.`;
+    }
+
+    showBookModal(title, bookData = null) {
+        if (!this.bookModal || !this.bookModalTitle || !this.bookForm) {
+            console.error("Элементы модального окна книги не найдены");
+            return;
+        }
+
+        this.bookModalTitle.textContent = title || "Книга";
+
+        if (bookData) {
+            document.getElementById("bookId").value = bookData.id || "";
+            document.getElementById("bookTitle").value = bookData.title || "";
+            document.getElementById("bookAuthor").value = bookData.author || "";
+            document.getElementById("bookPrice").value = bookData.price || "";
+            document.getElementById("bookDescription").value = bookData.description || "";
+            document.getElementById("bookImage").value = (bookData.image || "").replace("images/", "");
+            document.getElementById("bookGenre").value = bookData.genreId || "";
+        } else {
+            this.bookForm.reset();
+            document.getElementById("bookId").value = "";
+        }
+
+        this.bookModal.show();
+    }
+
+    showCartModal() {
+        if (this.cartModal) {
+            this.cartModal.show();
+        } else {
+            console.error("Модальное окно корзины не найдено");
+        }
+    }
+
+    bindAddBook(handler) {
+        document.querySelectorAll(".add-book-btn").forEach((btn) => {
+            btn.addEventListener("click", handler);
+        });
+    }
+
+    bindEditBook(handler) {
+        document.addEventListener("click", (event) => {
+            if (event.target.classList.contains("edit-book")) {
+                const card = event.target.closest(".card");
+                if (card) {
+                    const id = parseInt(card.dataset.id);
+                    if (!isNaN(id)) handler(id);
+                }
+            }
+        });
+    }
+
+    bindDeleteBook(handler) {
+        document.addEventListener("click", (event) => {
+            if (event.target.classList.contains("delete-book")) {
+                const card = event.target.closest(".card");
+                if (card) {
+                    const id = parseInt(card.dataset.id);
+                    if (!isNaN(id) && confirm("Вы уверены, что хотите удалить эту книгу?")) {
+                        handler(id);
+                    }
+                }
+            }
+        });
+    }
+
+    bindAddToCart(handler) {
+        document.addEventListener("click", (event) => {
+            if (event.target.classList.contains("add-to-cart")) {
+                const card = event.target.closest(".card");
+                if (card) {
+                    const id = parseInt(card.dataset.id);
+                    if (!isNaN(id)) handler(id);
+                }
+            }
+        });
+    }
+
+    bindShowCart(handler) {
+        document.querySelectorAll(".show-cart-btn").forEach((btn) => {
+            btn.addEventListener("click", (e) => {
+                e.preventDefault();
+                handler();
+            });
+        });
+    }
+
+    bindRemoveFromCart(handler) {
+        document.addEventListener("click", (event) => {
+            const removeBtn = event.target.closest(".remove-from-cart");
+            if (removeBtn) {
+                const id = parseInt(removeBtn.dataset.id);
+                if (!isNaN(id)) handler(id);
+            }
+        });
+    }
+
+    bindUpdateCartItem(handler) {
+        document.addEventListener("change", (event) => {
+            if (event.target.classList.contains("cart-item-quantity")) {
+                const id = parseInt(event.target.dataset.id);
+                const quantity = parseInt(event.target.value);
+                if (!isNaN(id) && !isNaN(quantity) && quantity > 0) {
+                    handler(id, quantity);
+                } else {
+                    event.target.value = 1;
+                }
+            }
+        });
+    }
+
+    bindClearCart(handler) {
+        const clearBtn = document.getElementById("clearCartBtn");
+        if (clearBtn) {
+            clearBtn.addEventListener("click", async (e) => {
+                e.preventDefault();
+                if (confirm("Вы уверены, что хотите очистить корзину?")) {
+                    await handler();
+                    // После очистки обновляем отображение
+                    const cartItems = await this.model.fetchCartItems();
+                    this.renderCart(cartItems);
+                    await this.controller.updateCartCount();
+                }
+            });
+        }
+    }
+
+    bindCheckout(handler) {
+        const checkoutBtn = document.getElementById("checkoutBtn");
+        if (checkoutBtn) {
+            checkoutBtn.addEventListener("click", handler);
+        }
+    }
+
+    bindSubmitBookForm(handler) {
+        if (this.bookForm) {
+            this.bookForm.addEventListener("submit", (event) => {
+                event.preventDefault();
+
+                const id = document.getElementById("bookId").value;
+                const bookData = {
+                    title: document.getElementById("bookTitle").value,
+                    author: document.getElementById("bookAuthor").value,
+                    price: parseInt(document.getElementById("bookPrice").value) || 0,
+                    description: document.getElementById("bookDescription").value,
+                    image: document.getElementById("bookImage").value.startsWith("http")
+                        ? document.getElementById("bookImage").value
+                        : `images/${document.getElementById("bookImage").value}`,
+                    genreId: parseInt(document.getElementById("bookGenre").value),
+                };
+
+                if (!bookData.title || !bookData.author) {
+                    alert("Пожалуйста, заполните обязательные поля");
+                    return;
+                }
+
+                handler(id, bookData);
+            });
+        }
+    }
+    // Метод для показа модального окна жанра
+    showGenreModal(title) {
+        if (!this.genreModal || !this.genreModalTitle || !this.genreForm) {
+            console.error("Элементы модального окна жанра не найдены");
+            return;
+        }
+
+        this.genreModalTitle.textContent = title || "Жанр";
+        this.genreForm.reset();
+        this.genreModal.show();
+    }
+
+    // Привязка обработчика добавления жанра
+    bindAddGenre(handler) {
+        document.querySelectorAll(".add-genre-btn").forEach((btn) => {
+            btn.addEventListener("click", handler);
+        });
+    }
+
+    // Привязка обработчика отправки формы жанра
+    bindSubmitGenreForm(handler) {
+        if (this.genreForm) {
+            this.genreForm.addEventListener("submit", (event) => {
+                event.preventDefault();
+
+                const genreData = {
+                    name: document.getElementById("genreName").value,
+                };
+
+                if (!genreData.name) {
+                    alert("Пожалуйста, укажите название жанра");
+                    return;
+                }
+
+                handler(genreData);
+            });
+        }
+    }
+}
+
+// Контроллер
+class BookController {
+    constructor(model, view) {
+        this.model = model;
+        this.view = view;
+        this.view.controller = this;
+        this.init();
+    }
+
+    async init() {
+        try {
+            // Инициализация обработчиков событий
+            this.view.bindAddGenre(() => this.handleAddGenre());
+            this.view.bindSubmitGenreForm((genreData) => this.handleSubmitGenreForm(genreData));
+            this.view.bindAddBook(() => this.handleAddBook());
+            this.view.bindEditBook((id) => this.handleEditBook(id));
+            this.view.bindDeleteBook((id) => this.handleDeleteBook(id));
+            this.view.bindAddToCart((id) => this.handleAddToCart(id));
+            this.view.bindShowCart(() => this.handleShowCart());
+            this.view.bindRemoveFromCart((id) => this.handleRemoveFromCart(id));
+            this.view.bindUpdateCartItem((id, quantity) => this.handleUpdateCartItem(id, quantity));
+            this.view.bindClearCart(() => this.handleClearCart());
+            this.view.bindCheckout(() => this.handleCheckout());
+            this.view.bindSubmitBookForm((id, bookData) => this.handleSubmitBookForm(id, bookData));
+
+            // Загрузка данных только если мы на странице каталога
+            if (document.getElementById("fantasy-books")) {
+                await this.loadData();
+            }
+
+            // Обновляем счетчик корзины всегда
+            await this.updateCartCount();
+
+            // Если мы на странице корзины, загружаем ее содержимое
+            if (document.getElementById("cartItemsContainer")) {
+                const cartItems = await this.model.fetchCartItems();
+                this.view.renderCart(cartItems);
+            }
+        } catch (error) {
+            console.error("Ошибка инициализации:", error);
+        }
+    }
+    // Новые методы обработчиков:
+    async handleAddGenre() {
+        this.view.showGenreModal("Добавить новый жанр");
+    }
+
+    async handleSubmitGenreForm(genreData) {
+        try {
+            const newGenre = await this.model.createGenre(genreData);
+            const genres = await this.model.fetchGenres();
+
+            // Обновляем интерфейс
+            this.view.renderGenreSelect(genres);
+            this.view.renderGenresSections(genres);
+
+            // Загружаем книги для ВСЕХ жанров после обновления секций
+            for (const genre of genres) {
+                const books = await this.model.fetchBooksByGenre(genre.id);
+                this.view.renderBooks(books, genre.name);
+            }
+
+            if (this.view.genreModal) {
+                this.view.genreModal.hide();
+            }
+            alert("Жанр успешно добавлен!");
+        } catch (error) {
+            console.error("Ошибка сохранения жанра:", error);
+            alert("Не удалось сохранить жанр");
+        }
+    }
+    async loadData() {
+        try {
+            const genres = await this.model.fetchGenres();
+            this.view.renderGenreSelect(genres);
+            this.view.renderGenresSections(genres);
+
+            for (const genre of genres) {
+                const books = await this.model.fetchBooksByGenre(genre.id);
+                this.view.renderBooks(books, genre.name);
+            }
+        } catch (error) {
+            console.error("Ошибка загрузки данных:", error);
+        }
+    }
+
+    async handleAddBook() {
+        this.view.showBookModal("Добавить новую книгу");
+    }
+
+    async handleEditBook(id) {
+        try {
+            const book = await this.model.fetchBook(id);
+            if (book) {
+                this.view.showBookModal("Редактировать книгу", book);
+            } else {
+                alert("Книга не найдена");
+            }
+        } catch (error) {
+            console.error("Ошибка редактирования книги:", error);
+            alert("Не удалось загрузить данные книги");
+        }
+    }
+
+    async handleDeleteBook(id) {
+        try {
+            await this.model.deleteBook(id);
+            location.reload();
+        } catch (error) {
+            console.error("Ошибка удаления книги:", error);
+            alert("Не удалось удалить книгу");
+        }
+    }
+
+    async handleAddToCart(bookId) {
+        try {
+            await this.model.addToCart(bookId);
+            await this.updateCartCount();
+            alert("Книга добавлена в корзину");
+        } catch (error) {
+            console.error("Ошибка добавления в корзину:", error);
+            alert("Не удалось добавить книгу в корзину");
+        }
+    }
+
+    async handleShowCart() {
+        try {
+            const cartItems = await this.model.fetchCartItems();
+            this.view.renderCart(cartItems);
+            this.view.showCartModal();
+        } catch (error) {
+            console.error("Ошибка загрузки корзины:", error);
+            alert("Не удалось загрузить корзину");
+        }
+    }
+
+    async handleRemoveFromCart(id) {
+        try {
+            await this.model.removeFromCart(id);
+            const cartItems = await this.model.fetchCartItems();
+            this.view.renderCart(cartItems);
+            await this.updateCartCount();
+        } catch (error) {
+            console.error("Ошибка удаления из корзины:", error);
+            alert("Не удалось удалить товар из корзины");
+        }
+    }
+
+    async handleUpdateCartItem(id, quantity) {
+        try {
+            await this.model.updateCartItem(id, { quantity });
+            const cartItems = await this.model.fetchCartItems();
+            this.view.renderCart(cartItems);
+            await this.updateCartCount();
+        } catch (error) {
+            console.error("Ошибка обновления корзины:", error);
+            alert("Не удалось обновить количество товара");
+        }
+    }
+
+    async handleClearCart() {
+        try {
+            await this.model.clearCart();
+            // Обновляем отображение корзины
+            const cartItems = await this.model.fetchCartItems();
+            this.view.renderCart(cartItems);
+            await this.updateCartCount();
+
+            // Показываем сообщение об успехе
+            alert("Корзина успешно очищена");
+        } catch (error) {
+            console.error("Ошибка очистки корзины:", error);
+            alert("Не удалось очистить корзину");
+        }
+    }
+
+    async handleCheckout() {
+        try {
+            alert("Заказ оформлен! Спасибо за покупку!");
+            await this.model.clearCart();
+            this.view.renderCart([]);
+            await this.updateCartCount();
+        } catch (error) {
+            console.error("Ошибка оформления заказа:", error);
+            alert("Не удалось оформить заказ");
+        }
+    }
+
+    async handleSubmitBookForm(id, bookData) {
+        try {
+            if (id) {
+                await this.model.updateBook(id, bookData);
+            } else {
+                await this.model.createBook(bookData);
+            }
+
+            location.reload();
+        } catch (error) {
+            console.error("Ошибка сохранения книги:", error);
+            alert("Не удалось сохранить книгу");
+        }
+    }
+
+    async updateCartCount() {
+        try {
+            const cartItems = await this.model.fetchCartItems();
+            const totalItems = cartItems.reduce((sum, item) => sum + (item.quantity || 0), 0);
+
+            document.querySelectorAll(".cart-count").forEach((el) => {
+                el.textContent = totalItems;
+                el.style.display = totalItems > 0 ? "inline-block" : "none";
+            });
+        } catch (error) {
+            console.error("Ошибка обновления счетчика корзины:", error);
+        }
+    }
+}
+
+// Инициализация приложения
+document.addEventListener("DOMContentLoaded", () => {
+    try {
+        const model = new BookModel();
+        const view = new BookView();
+        new BookController(model, view);
+    } catch (error) {
+        console.error("Ошибка инициализации приложения:", error);
+    }
+});

MyWebSite/components/BookComponent.jsx

@@ -0,0 +1,65 @@
+import { Button, Card } from 'react-bootstrap';
+import { BiCart, BiEdit, BiTrash } from 'react-icons/bi';
+
+const BookComponent = ({ book, onEdit, onDelete, onAddToCart }) => {
+    const displayPrice = book.price === 0 ? "Бесплатно" : `${book.price || 0} руб.`;
+  return (
+    <div className="col-md-6 mb-4">
+      <Card className="h-100 border-0 shadow-sm">
+        <div className="row g-0 h-100">
+          <div className="col-md-4">
+            <Card.Img
+              variant="top"
+              src={book.image || "images/default-book.jpg"}
+              alt={book.title || "Без названия"}
+              className="h-100 rounded-start"
+              style={{ objectFit: 'cover' }}
+              onError={(e) => { e.target.src = 'images/default-book.jpg' }}
+            />
+          </div>
+          <div className="col-md-8">
+            <Card.Body className="d-flex flex-column h-100">
+              <Card.Title>{book.title || "Без названия"}</Card.Title>
+              <Card.Subtitle className="mb-2 text-muted">
+                {book.author || "Автор не указан"}
+              </Card.Subtitle>
+              <Card.Text className="flex-grow-1">
+                {book.description || "Описание отсутствует"}
+              </Card.Text>
+              <div className="d-flex justify-content-between align-items-center">
+                <Card.Text className="h5 me-2 mb-2">
+                    {displayPrice}
+                </Card.Text>
+                <div>
+                  <Button
+                    variant="primary"
+                    className="me-2 mb-2"
+                    onClick={() => onAddToCart(book.id)}
+                  >
+                    <BiCart /> В корзину
+                  </Button>
+                  <Button
+                    variant="outline-secondary"
+                    className="me-2 mb-2"
+                    onClick={() => onEdit(book.id)}
+                  >
+                    <BiEdit /> Редактировать
+                  </Button>
+                  <Button
+                    variant="outline-danger"
+                    className="mb-2"
+                    onClick={() => onDelete(book.id)}
+                  >
+                    <BiTrash /> Удалить
+                  </Button>
+                </div>
+              </div>
+            </Card.Body>
+          </div>
+        </div>
+      </Card>
+    </div>
+  );
+};
+
+export default BookComponent;

MyWebSite/components/BookModal.jsx

@@ -0,0 +1,278 @@
+import React, { useState, useEffect } from 'react';
+import { Modal, Button, Form, Alert } from 'react-bootstrap';
+import api from '../services/api';
+
+const BookModal = ({ show, onHide, bookId, genres, onSave }) => {
+  const [formData, setFormData] = useState({
+    title: '',
+    author: '',
+    price: '',
+    description: '',
+    image: ''
+  });
+  const [selectedGenreIds, setSelectedGenreIds] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState('');
+
+  useEffect(() => {
+    if (bookId && show) {
+      loadBookData();
+    } else {
+      resetForm();
+    }
+  }, [bookId, show]);
+
+  const loadBookData = async () => {
+    if (!bookId) return;
+
+    try {
+      setLoading(true);
+      setError('');
+
+      // Загружаем данные книги
+      const bookResponse = await api.fetchBook(bookId);
+      const book = bookResponse.data;
+
+      setFormData({
+        title: book.title || '',
+        author: book.author || '',
+        price: book.price || '',
+        description: book.description || '',
+        image: book.image || ''
+      });
+
+      // Загружаем жанры книги, если есть ID
+      if (bookId) {
+        try {
+          const genresResponse = await api.fetchBookGenres(bookId);
+          const bookGenres = genresResponse.data || [];
+          setSelectedGenreIds(bookGenres.map(gb => gb.genre.id));
+        } catch (genreError) {
+          console.error('Ошибка загрузки жанров книги:', genreError);
+          setSelectedGenreIds([]);
+        }
+      }
+
+    } catch (error) {
+      console.error('Ошибка загрузки книги:', error);
+      setError('Не удалось загрузить данные книги');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const resetForm = () => {
+    setFormData({
+      title: '',
+      author: '',
+      price: '',
+      description: '',
+      image: ''
+    });
+    setSelectedGenreIds([]);
+    setError('');
+  };
+
+  const handleGenreChange = (genreId) => {
+    setSelectedGenreIds(prev => {
+      if (prev.includes(genreId)) {
+        return prev.filter(id => id !== genreId);
+      } else {
+        return [...prev, genreId];
+      }
+    });
+  };
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setError('');
+
+    try {
+      const bookData = {
+        title: formData.title,
+        author: formData.author,
+        price: Number(formData.price) || 0,
+        description: formData.description,
+        image: formData.image
+      };
+
+      let savedBook;
+      if (bookId) {
+        // Обновляем книгу
+        savedBook = await api.updateBook(bookId, bookData);
+
+        // Обновляем жанры книги
+        const currentGenresResponse = await api.fetchBookGenres(bookId);
+        const currentGenreIds = (currentGenresResponse.data || []).map(gb => gb.genre.id);
+
+        // Удаляем жанры, которые были убраны
+        for (const currentGenreId of currentGenreIds) {
+          if (!selectedGenreIds.includes(currentGenreId)) {
+            await api.deleteBookGenre(bookId, currentGenreId);
+          }
+        }
+
+        // Добавляем новые жанры
+        for (const newGenreId of selectedGenreIds) {
+          if (!currentGenreIds.includes(newGenreId)) {
+            await api.addBookGenre(bookId, {
+              genreId: newGenreId,
+              date: new Date().toISOString().split('T')[0] // Текущая дата в формате YYYY-MM-DD
+            });
+          }
+        }
+      } else {
+        // Создаем новую книгу
+        savedBook = await api.createBook(bookData);
+        const newBookId = savedBook.data.id;
+
+        // Добавляем жанры для новой книги
+        for (const genreId of selectedGenreIds) {
+          await api.addBookGenre(newBookId, {
+            genreId: genreId,
+            date: new Date().toISOString().split('T')[0]
+          });
+        }
+      }
+
+      onSave(bookData);
+    } catch (error) {
+      console.error('Ошибка сохранения книги:', error);
+      setError('Не удалось сохранить книгу');
+    }
+  };
+
+  const handleClose = () => {
+    resetForm();
+    onHide();
+  };
+
+  if (loading) {
+    return (
+      <Modal show={show} onHide={handleClose} size="lg">
+        <Modal.Header closeButton>
+          <Modal.Title>{bookId ? 'Редактировать книгу' : 'Добавить книгу'}</Modal.Title>
+        </Modal.Header>
+        <Modal.Body className="text-center">
+          <div className="py-4">
+            <div className="spinner-border text-primary" role="status">
+              <span className="visually-hidden">Загрузка...</span>
+            </div>
+            <p className="mt-2">Загрузка данных...</p>
+          </div>
+        </Modal.Body>
+      </Modal>
+    );
+  }
+
+  return (
+    <Modal show={show} onHide={handleClose} size="lg">
+      <Modal.Header closeButton>
+        <Modal.Title>{bookId ? 'Редактировать книгу' : 'Добавить книгу'}</Modal.Title>
+      </Modal.Header>
+      <Modal.Body>
+        {error && (
+          <Alert variant="danger" className="mb-3">
+            {error}
+          </Alert>
+        )}
+
+        <Form onSubmit={handleSubmit}>
+          <Form.Group className="mb-3">
+            <Form.Label>Название книги *</Form.Label>
+            <Form.Control
+              type="text"
+              value={formData.title}
+              onChange={(e) => setFormData({...formData, title: e.target.value})}
+              required
+              placeholder="Введите название книги"
+            />
+          </Form.Group>
+
+          <Form.Group className="mb-3">
+            <Form.Label>Автор *</Form.Label>
+            <Form.Control
+              type="text"
+              value={formData.author}
+              onChange={(e) => setFormData({...formData, author: e.target.value})}
+              required
+              placeholder="Введите автора"
+            />
+          </Form.Group>
+
+          <Form.Group className="mb-3">
+            <Form.Label>Жанры</Form.Label>
+            <div className="border rounded p-3" style={{ maxHeight: '200px', overflowY: 'auto' }}>
+              {genres.length === 0 ? (
+                <p className="text-muted mb-0">Нет доступных жанров</p>
+              ) : (
+                genres.map(genre => (
+                  <Form.Check
+                    key={genre.id}
+                    type="checkbox"
+                    id={`genre-${genre.id}`}
+                    label={genre.name}
+                    checked={selectedGenreIds.includes(genre.id)}
+                    onChange={() => handleGenreChange(genre.id)}
+                    className="mb-2"
+                  />
+                ))
+              )}
+            </div>
+            <Form.Text className="text-muted">
+              Можно выбрать несколько жанров
+            </Form.Text>
+          </Form.Group>
+
+          <Form.Group className="mb-3">
+            <Form.Label>Цена *</Form.Label>
+            <Form.Control
+              type="number"
+              value={formData.price}
+              onChange={(e) => setFormData({...formData, price: e.target.value})}
+              required
+              min="0"
+              step="1"
+              placeholder="0"
+            />
+          </Form.Group>
+
+          <Form.Group className="mb-3">
+            <Form.Label>Описание</Form.Label>
+            <Form.Control
+              as="textarea"
+              rows={3}
+              value={formData.description}
+              onChange={(e) => setFormData({...formData, description: e.target.value})}
+              placeholder="Введите описание книги"
+            />
+          </Form.Group>
+
+          <Form.Group className="mb-3">
+            <Form.Label>Изображение</Form.Label>
+            <Form.Control
+              type="text"
+              value={formData.image}
+              onChange={(e) => setFormData({...formData, image: e.target.value})}
+              placeholder="URL изображения или путь к файлу"
+            />
+            <Form.Text className="text-muted">
+              Можно указать полный URL (https://...) или относительный путь (images/book.jpg)
+            </Form.Text>
+          </Form.Group>
+
+          <Modal.Footer>
+            <Button variant="secondary" onClick={handleClose}>
+              Отмена
+            </Button>
+            <Button variant="primary" type="submit">
+              {bookId ? 'Обновить' : 'Добавить'}
+            </Button>
+          </Modal.Footer>
+        </Form>
+      </Modal.Body>
+    </Modal>
+  );
+};
+
+export default BookModal;

MyWebSite/components/CartModal.jsx

@@ -0,0 +1,160 @@
+import React, { useState, useEffect } from 'react';
+import { Modal, Button, Card, Form, Alert } from 'react-bootstrap';
+import { BiTrash } from 'react-icons/bi';
+import api from '../services/api';
+
+const CartModal = ({ show, onHide, onCheckout }) => {
+  const [cartItems, setCartItems] = useState([]);
+  const [total, setTotal] = useState(0);
+  const [loading, setLoading] = useState(false);
+
+  useEffect(() => {
+    if (show) {
+      loadCart();
+    }
+  }, [show]);
+
+  const loadCart = async () => {
+    try {
+      setLoading(true);
+      const response = await api.fetchCartItems();
+      const items = response.data || [];
+      setCartItems(items);
+
+      const newTotal = items.reduce((sum, item) => {
+        return sum + (item.book?.price || 0) * (item.quantity || 1);
+      }, 0);
+      setTotal(newTotal);
+    } catch (error) {
+      console.error('Ошибка загрузки корзины:', error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleQuantityChange = async (id, quantity) => {
+    if (quantity < 1) return;
+
+    try {
+      // Используем правильный метод для обновления количества
+      await api.updateCartItemQuantity(id, quantity);
+      await loadCart(); // Перезагружаем корзину
+    } catch (error) {
+      console.error('Ошибка обновления количества:', error);
+    }
+  };
+
+  const handleRemoveItem = async (id) => {
+    try {
+      await api.removeFromCart(id);
+      await loadCart(); // Перезагружаем корзину
+    } catch (error) {
+      console.error('Ошибка удаления из корзины:', error);
+    }
+  };
+
+  const handleCheckoutClick = async () => {
+    try {
+      await onCheckout();
+      setCartItems([]);
+      setTotal(0);
+    } catch (error) {
+      console.error('Ошибка оформления заказа:', error);
+    }
+  };
+
+  return (
+    <Modal show={show} onHide={onHide} size="lg">
+      <Modal.Header closeButton>
+        <Modal.Title>🛒 Ваша корзина</Modal.Title>
+      </Modal.Header>
+      <Modal.Body>
+        {loading ? (
+          <div className="text-center py-3">
+            <div className="spinner-border text-primary" role="status">
+              <span className="visually-hidden">Загрузка...</span>
+            </div>
+          </div>
+        ) : cartItems.length === 0 ? (
+          <Alert variant="info" className="text-center">
+            Корзина пуста
+          </Alert>
+        ) : (
+          <>
+            <div className="cart-items">
+              {cartItems.map(item => (
+                <Card key={item.id} className="mb-3">
+                  <Card.Body>
+                    <div className="row align-items-center">
+                      <div className="col-3 col-md-2">
+                        <img
+                          src={item.book?.image || "/images/default-book.jpg"}
+                          alt={item.book?.title || "Без названия"}
+                          className="img-fluid rounded"
+                          style={{ maxHeight: '60px', objectFit: 'cover' }}
+                          onError={(e) => {
+                            e.target.src = '/images/default-book.jpg';
+                            e.target.onerror = null;
+                          }}
+                        />
+                      </div>
+                      <div className="col-9 col-md-6">
+                        <h6 className="mb-1">{item.book?.title || "Без названия"}</h6>
+                        <p className="text-muted small mb-1">{item.book?.author || "Автор не указан"}</p>
+                        <p className="small mb-0">
+                          <strong>Цена:</strong> {item.book?.price || 0} руб.
+                        </p>
+                      </div>
+                      <div className="col-6 col-md-2 mt-2 mt-md-0">
+                        <Form.Control
+                          type="number"
+                          min="1"
+                          value={item.quantity || 1}
+                          onChange={(e) => handleQuantityChange(item.id, parseInt(e.target.value) || 1)}
+                          size="sm"
+                        />
+                      </div>
+                      <div className="col-6 col-md-2 text-end mt-2 mt-md-0">
+                        <p className="fw-bold mb-1">
+                          {(item.book?.price || 0) * (item.quantity || 1)} руб.
+                        </p>
+                        <Button
+                          variant="outline-danger"
+                          size="sm"
+                          onClick={() => handleRemoveItem(item.id)}
+                        >
+                          <BiTrash />
+                        </Button>
+                      </div>
+                    </div>
+                  </Card.Body>
+                </Card>
+              ))}
+            </div>
+
+            <div className="border-top pt-3">
+              <div className="d-flex justify-content-between align-items-center">
+                <h5 className="mb-0">Общая стоимость:</h5>
+                <h5 className="mb-0 text-primary">{total} руб.</h5>
+              </div>
+            </div>
+          </>
+        )}
+      </Modal.Body>
+      <Modal.Footer>
+        <Button variant="secondary" onClick={onHide}>
+          Продолжить покупки
+        </Button>
+        <Button
+          variant="success"
+          onClick={handleCheckoutClick}
+          disabled={cartItems.length === 0 || loading}
+        >
+          Оформить заказ
+        </Button>
+      </Modal.Footer>
+    </Modal>
+  );
+};
+
+export default CartModal;

MyWebSite/components/Footer.jsx

@@ -0,0 +1,31 @@
+import React from 'react';
+
+const Footer = () => {
+  return (
+    <footer className="bg-light py-4 mt-5">
+      <div className="container">
+        <div className="row">
+          <div className="col-md-6 mb-4 mb-md-0">
+            <h5 className="mb-3">Контакты</h5>
+            <ul className="list-unstyled">
+              <li><i className="bi bi-envelope me-2"></i> info@toma.ru</li>
+              <li><i className="bi bi-phone me-2"></i> +7 (123) 456-78-90</li>
+              <li><i className="bi bi-clock me-2"></i> Пн-Пт 9:00-18:00</li>
+              <li><i className="bi bi-geo-alt me-2"></i> г. Москва, ул. Литераторов, д. 1</li>
+            </ul>
+          </div>
+          <div className="col-md-6 text-md-end">
+            <h5 className="mb-3">Социальные сети</h5>
+            <div className="social-media">
+              <a href="#" className="text-decoration-none me-3"><i className="bi bi-facebook fs-3"></i></a>
+              <a href="#" className="text-decoration-none me-3"><i className="bi bi-vk fs-3"></i></a>
+              <a href="#" className="text-decoration-none"><i className="bi bi-telegram fs-3"></i></a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </footer>
+  );
+};
+
+export default Footer;

MyWebSite/components/GenreModal.jsx

@@ -0,0 +1,64 @@
+import React, { useState, useEffect } from 'react';
+import { Modal, Button, Form } from 'react-bootstrap';
+
+const GenreModal = ({ show, onHide, onSave }) => {
+  const [genreName, setGenreName] = useState('');
+
+  // Сбрасываем форму при открытии/закрытии
+  useEffect(() => {
+    if (show) {
+      setGenreName('');
+    }
+  }, [show]);
+
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    if (!genreName.trim()) {
+      alert('Введите название жанра');
+      return;
+    }
+    onSave({ name: genreName.trim() });
+    setGenreName('');
+  };
+
+  const handleClose = () => {
+    setGenreName('');
+    onHide();
+  };
+
+  return (
+    <Modal show={show} onHide={handleClose}>
+      <Modal.Header closeButton>
+        <Modal.Title>➕ Добавить жанр</Modal.Title>
+      </Modal.Header>
+      <Modal.Body>
+        <Form onSubmit={handleSubmit}>
+          <Form.Group className="mb-3">
+            <Form.Label>Название жанра *</Form.Label>
+            <Form.Control
+              type="text"
+              value={genreName}
+              onChange={(e) => setGenreName(e.target.value)}
+              placeholder="Например: Фантастика, Детектив, Роман"
+              required
+              autoFocus
+            />
+            <Form.Text className="text-muted">
+              Введите уникальное название для нового жанра
+            </Form.Text>
+          </Form.Group>
+          <Modal.Footer>
+            <Button variant="secondary" onClick={handleClose}>
+              Отмена
+            </Button>
+            <Button variant="primary" type="submit" disabled={!genreName.trim()}>
+              Добавить жанр
+            </Button>
+          </Modal.Footer>
+        </Form>
+      </Modal.Body>
+    </Modal>
+  );
+};
+
+export default GenreModal;

MyWebSite/components/Navbar.jsx

@@ -0,0 +1,71 @@
+import { Link } from 'react-router-dom';
+import logoImage from '../images/logo.png';
+
+const Navbar = ({ cartCount }) => {
+    return (
+        <nav className="navbar navbar-expand-lg navbar-light bg-light fixed-top shadow-sm">
+            <div className="container">
+                <Link className="navbar-brand d-flex align-items-center" to="/">
+                    <img src={logoImage} alt="Логотип" className="logo me-2" />
+                    <span className="d-none d-lg-block">Книжный магазин "Тома"</span>
+                    <span className="d-lg-none">"Тома"</span>
+                </Link>
+                
+                {/* Кнопка для мобильного меню */}
+                <button 
+                    className="navbar-toggler" 
+                    type="button" 
+                    data-bs-toggle="collapse" 
+                    data-bs-target="#navbarContent"
+                    aria-controls="navbarContent" 
+                    aria-expanded="false" 
+                    aria-label="Toggle navigation"
+                >
+                    <span className="navbar-toggler-icon"></span>
+                </button>
+
+                {/* Основное меню */}
+                <div className="collapse navbar-collapse" id="navbarContent">
+                    <ul className="navbar-nav ms-auto mb-2 mb-lg-0">
+                        <li className="nav-item">
+                            <Link className="nav-link" to="/">Главная страница</Link>
+                        </li>
+                        <li className="nav-item">
+                            <Link className="nav-link" to="/catalog">Каталог</Link>
+                        </li>
+                        <li className="nav-item">
+                            <Link className="nav-link" to="/discounts">Скидки</Link>
+                        </li>
+                        <li className="nav-item">
+                            <Link className="nav-link" to="/contact">Связаться с нами</Link>
+                        </li>
+                        <li className="nav-item d-lg-none">
+                            <Link className="nav-link position-relative" to="/basket">
+                                <i className="bi bi-cart3 me-1"></i> Корзина
+                                {cartCount > 0 && (
+                                    <span className="cart-count badge bg-danger rounded-pill position-absolute top-0 start-100 translate-middle">
+                                        {cartCount}
+                                    </span>
+                                )}
+                            </Link>
+                        </li>
+                    </ul>
+
+                    {/* Иконка корзины для десктопной версии */}
+                    <div className="d-none d-lg-block ms-3">
+                        <Link className="nav-link position-relative" to="/basket">
+                            <i className="bi bi-cart3 fs-5"></i>
+                            {cartCount > 0 && (
+                                <span className="cart-count badge bg-danger rounded-pill position-absolute top-0 start-100 translate-middle">
+                                    {cartCount}
+                                </span>
+                            )}
+                        </Link>
+                    </div>
+                </div>
+            </div>
+        </nav>
+    );
+};
+
+export default Navbar;

MyWebSite/components/PageSizeSelector.jsx

@@ -0,0 +1,50 @@
+import React from 'react';
+import { Form } from 'react-bootstrap';
+
+const PageSizeSelector = ({
+    pageSize,
+    onPageSizeChange,
+    // Меняем значения в выпадающем списке
+    options = [5, 10, 20]
+}) => {
+    // Маппинг: что пользователь видит -> что на самом деле запрашиваем
+    const sizeMapping = {
+        3: 5,   // Пользователь видит "3", запрашиваем 5
+        5: 10,  // Пользователь видит "5", запрашиваем 10
+        10: 20, // Пользователь видит "10", запрашиваем 20
+    };
+
+    // Находим отображаемое значение для текущего реального
+    const getDisplayValue = (realValue) => {
+        for (const [display, real] of Object.entries(sizeMapping)) {
+            if (real === realValue) return Number(display);
+        }
+        return realValue;
+    };
+
+    const displayValue = getDisplayValue(pageSize);
+
+    return (
+        <div className="d-flex align-items-center">
+            <span className="me-2">Книг на странице:</span>
+            <Form.Select
+                size="sm"
+                style={{ width: 'auto' }}
+                value={displayValue}
+                onChange={(e) => {
+                    const selectedDisplayValue = Number(e.target.value);
+                    const realValue = sizeMapping[selectedDisplayValue] || selectedDisplayValue;
+                    onPageSizeChange(realValue);
+                }}
+            >
+                {options.map(option => (
+                    <option key={option} value={option}>
+                        {option}
+                    </option>
+                ))}
+            </Form.Select>
+        </div>
+    );
+};
+
+export default PageSizeSelector;

MyWebSite/components/Pagination.jsx

@@ -0,0 +1,93 @@
+import React from 'react';
+import { Pagination as BootstrapPagination } from 'react-bootstrap';
+
+const Pagination = ({
+    currentPage,
+    totalPages,
+    onPageChange,
+    maxVisiblePages = 5
+}) => {
+    if (totalPages <= 1) return null;
+
+    const items = [];
+    let startPage = Math.max(1, currentPage - Math.floor(maxVisiblePages / 2));
+    let endPage = Math.min(totalPages, startPage + maxVisiblePages - 1);
+
+    // Корректируем, если не хватает страниц
+    if (endPage - startPage + 1 < maxVisiblePages) {
+        startPage = Math.max(1, endPage - maxVisiblePages + 1);
+    }
+
+    // Кнопка "Назад"
+    items.push(
+        <BootstrapPagination.Prev
+            key="prev"
+            disabled={currentPage === 1}
+            onClick={() => currentPage > 1 && onPageChange(currentPage - 1)}
+        />
+    );
+
+    // Первая страница
+    if (startPage > 1) {
+        items.push(
+            <BootstrapPagination.Item
+                key={1}
+                active={1 === currentPage}
+                onClick={() => onPageChange(1)}
+            >
+                1
+            </BootstrapPagination.Item>
+        );
+
+        if (startPage > 2) {
+            items.push(<BootstrapPagination.Ellipsis key="start-ellipsis" />);
+        }
+    }
+
+    // Видимые страницы
+    for (let page = startPage; page <= endPage; page++) {
+        items.push(
+            <BootstrapPagination.Item
+                key={page}
+                active={page === currentPage}
+                onClick={() => onPageChange(page)}
+            >
+                {page}
+            </BootstrapPagination.Item>
+        );
+    }
+
+    // Последняя страница
+    if (endPage < totalPages) {
+        if (endPage < totalPages - 1) {
+            items.push(<BootstrapPagination.Ellipsis key="end-ellipsis" />);
+        }
+
+        items.push(
+            <BootstrapPagination.Item
+                key={totalPages}
+                active={totalPages === currentPage}
+                onClick={() => onPageChange(totalPages)}
+            >
+                {totalPages}
+            </BootstrapPagination.Item>
+        );
+    }
+
+    // Кнопка "Вперед"
+    items.push(
+        <BootstrapPagination.Next
+            key="next"
+            disabled={currentPage === totalPages}
+            onClick={() => currentPage < totalPages && onPageChange(currentPage + 1)}
+        />
+    );
+
+    return (
+        <BootstrapPagination className="justify-content-center mt-4">
+            {items}
+        </BootstrapPagination>
+    );
+};
+
+export default Pagination;

MyWebSite/db.json

@@ -0,0 +1,108 @@
+{
+  "genres": [
+    {
+      "id": 1,
+      "name": "ФАНТАСТИКА"
+    },
+    {
+      "id": 2,
+      "name": "ДЕТЕКТИВ"
+    },
+    {
+      "id": 3,
+      "name": "РОМАН"
+    },
+    {
+      "id": 4,
+      "name": "ФЭНТЕЗИ"
+    },
+    {
+      "name": "УЖАС",
+      "id": 5
+    },
+    {
+      "name": "ужас3",
+      "id": 7
+    },
+    {
+      "name": "класс2",
+      "id": 9
+    },
+    {
+      "name": "ввв",
+      "id": 10
+    },
+    {
+      "name": "уу",
+      "id": 11
+    }
+  ],
+  "books": [
+    {
+      "title": "Дюна",
+      "author": "Фрэнк Герберт",
+      "genreId": 1,
+      "price": 0,
+      "description": "Эпическая история о борьбе за контроль над планетой Арракис, источником самого ценного вещества во вселенной.",
+      "image": "images/dune.jpg",
+      "id": 1
+    },
+    {
+      "title": "Основание",
+      "author": "Айзек Азимов",
+      "price": 700,
+      "description": "Сага о падении и возрождении галактической империи, основанная на научных принципах.",
+      "image": "images/foundation.jpg",
+      "genreId": 1,
+      "id": 2
+    },
+    {
+      "id": 3,
+      "title": "Убийство в Восточном экспрессе",
+      "author": "Агата Кристи",
+      "price": 750,
+      "description": "Загадочное убийство на поезде, где каждый пассажир может быть подозреваемым.",
+      "image": "images/murder_on_the_orient_express.jpg",
+      "genreId": 2
+    },
+    {
+      "id": 5,
+      "title": "Гарри Поттер и философский камень",
+      "author": "Дж.К. Роулинг",
+      "price": 800,
+      "description": "Приключения молодого волшебника в школе магии Хогвартс.",
+      "image": "images/harry_potter.webp",
+      "genreId": 4
+    },
+    {
+      "title": "Песнь льда и огня",
+      "author": "Джордж Р. Р. Мартин",
+      "price": 5,
+      "description": "роарапс",
+      "image": "images/asongoficeandfire.jpg",
+      "genreId": 4,
+      "id": 6
+    },
+    {
+      "title": "Песнь льда и огня",
+      "author": "ыыы",
+      "price": 3455,
+      "description": "кцакровчвепп",
+      "image": "images/foundation.jpg",
+      "genreId": 2,
+      "id": 7
+    }
+  ],
+  "cart": [
+    {
+      "bookId": 2,
+      "quantity": 2,
+      "id": 1
+    },
+    {
+      "bookId": 1,
+      "quantity": 4,
+      "id": 2
+    }
+  ]
+}

MyWebSite/dist/index.html

@@ -0,0 +1,21 @@
+<!doctype html>
+<html lang="ru">
+    <head>
+        <meta charset="UTF-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>Книжный интернет-магазин "Тома"</title>
+        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" />
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css" />
+      <script type="module" crossorigin src="./assets/js/index-D_bqwX26.js"></script>
+      <link rel="stylesheet" crossorigin href="./assets/css/index-DvDKDXQB.css">
+    </head>
+    <body>
+        <div id="root"></div>
+
+        <!-- Подключение React и Bootstrap JS -->
+        <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>
+
+        <!-- Подключение скриптов приложения -->
+
+    </body>

MyWebSite/images/Facebook_icon-icons.com_66805.svg

@@ -0,0 +1 @@
+<?xml version="1.0" ?><!DOCTYPE svg  PUBLIC '-//W3C//DTD SVG 1.1//EN'  'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg enable-background="new 0 0 128 128" id="Social_Icons" version="1.1" viewBox="0 0 128 128" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="_x31__stroke"><g id="Facebook_1_"><rect fill="none" height="128" width="128"/><path clip-rule="evenodd" d="M68.369,128H7.065C3.162,128,0,124.836,0,120.935    V7.065C0,3.162,3.162,0,7.065,0h113.871C124.837,0,128,3.162,128,7.065v113.87c0,3.902-3.163,7.065-7.064,7.065H88.318V78.431    h16.638l2.491-19.318H88.318V46.78c0-5.593,1.553-9.404,9.573-9.404l10.229-0.004V20.094c-1.769-0.235-7.841-0.761-14.906-0.761    c-14.749,0-24.846,9.003-24.846,25.535v14.246H51.688v19.318h16.681V128z" fill="#4460A0" fill-rule="evenodd" id="Facebook"/></g></g></svg>

MyWebSite/images/telegram-svgrepo-com.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg xmlns="http://www.w3.org/2000/svg"
+aria-label="Telegram" role="img"
+viewBox="0 0 512 512"><rect
+width="512" height="512"
+rx="15%"
+fill="#37aee2"/><path fill="#c8daea" d="M199 404c-11 0-10-4-13-14l-32-105 245-144"/><path fill="#a9c9dd" d="M199 404c7 0 11-4 16-8l45-43-56-34"/><path fill="#f6fbfe" d="M204 319l135 99c14 9 26 4 30-14l55-258c5-22-9-32-24-25L79 245c-21 8-21 21-4 26l83 26 190-121c9-5 17-3 11 4"/></svg>

MyWebSite/images/vk-svgrepo-com.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg xmlns="http://www.w3.org/2000/svg"
+aria-label="VK" role="img"
+viewBox="0 0 512 512"><rect
+width="512" height="512"
+rx="15%"
+fill="#5281b8"/><path fill="#ffffff" d="M274 363c5-1 14-3 14-15 0 0-1-30 13-34s32 29 51 42c14 9 25 8 25 8l51-1s26-2 14-23c-1-2-9-15-39-42-31-30-26-25 11-76 23-31 33-50 30-57-4-7-20-6-20-6h-57c-6 0-9 1-12 6 0 0-9 25-21 45-25 43-35 45-40 42-9-5-7-24-7-37 0-45 7-61-13-65-13-2-59-4-73 3-7 4-11 11-8 12 3 0 12 1 17 7 8 13 9 75-2 81-15 11-53-62-62-86-2-6-5-7-12-9H79c-6 0-15 1-11 13 27 56 83 193 184 192z"/></svg>

MyWebSite/index.html

@@ -0,0 +1,20 @@
+<!doctype html>
+<html lang="ru">
+    <head>
+        <meta charset="UTF-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>Книжный интернет-магазин "Тома"</title>
+        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" />
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css" />
+    </head>
+    <body>
+        <div id="root"></div>
+
+        <!-- Подключение React и Bootstrap JS -->
+        <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>
+
+        <!-- Подключение скриптов приложения -->
+        <script type="module" src="main.jsx"></script>
+    </body>
+</html>

MyWebSite/main.jsx

@@ -0,0 +1,10 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import App from './App';
+import './style.css';
+
+ReactDOM.createRoot(document.getElementById('root')).render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);

MyWebSite/node_modules/.bin/acorn

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../acorn/bin/acorn" "$@"
+else 
+  exec node  "$basedir/../acorn/bin/acorn" "$@"
+fi

MyWebSite/node_modules/.bin/acorn.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\acorn\bin\acorn" %*

MyWebSite/node_modules/.bin/acorn.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../acorn/bin/acorn" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../acorn/bin/acorn" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../acorn/bin/acorn" $args
+  } else {
+    & "node$exe"  "$basedir/../acorn/bin/acorn" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/browserslist

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../browserslist/cli.js" "$@"
+else 
+  exec node  "$basedir/../browserslist/cli.js" "$@"
+fi

MyWebSite/node_modules/.bin/browserslist.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\browserslist\cli.js" %*

MyWebSite/node_modules/.bin/browserslist.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../browserslist/cli.js" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../browserslist/cli.js" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../browserslist/cli.js" $args
+  } else {
+    & "node$exe"  "$basedir/../browserslist/cli.js" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/esbuild

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../esbuild/bin/esbuild" "$@"
+else 
+  exec node  "$basedir/../esbuild/bin/esbuild" "$@"
+fi

MyWebSite/node_modules/.bin/esbuild.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\esbuild\bin\esbuild" %*

MyWebSite/node_modules/.bin/esbuild.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../esbuild/bin/esbuild" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../esbuild/bin/esbuild" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../esbuild/bin/esbuild" $args
+  } else {
+    & "node$exe"  "$basedir/../esbuild/bin/esbuild" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/eslint

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../eslint/bin/eslint.js" "$@"
+else 
+  exec node  "$basedir/../eslint/bin/eslint.js" "$@"
+fi

MyWebSite/node_modules/.bin/eslint-config-prettier

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../eslint-config-prettier/build/bin/cli.js" "$@"
+else 
+  exec node  "$basedir/../eslint-config-prettier/build/bin/cli.js" "$@"
+fi

MyWebSite/node_modules/.bin/eslint-config-prettier.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\eslint-config-prettier\build\bin\cli.js" %*

MyWebSite/node_modules/.bin/eslint-config-prettier.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../eslint-config-prettier/build/bin/cli.js" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../eslint-config-prettier/build/bin/cli.js" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../eslint-config-prettier/build/bin/cli.js" $args
+  } else {
+    & "node$exe"  "$basedir/../eslint-config-prettier/build/bin/cli.js" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/eslint.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\eslint\bin\eslint.js" %*

MyWebSite/node_modules/.bin/eslint.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../eslint/bin/eslint.js" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../eslint/bin/eslint.js" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../eslint/bin/eslint.js" $args
+  } else {
+    & "node$exe"  "$basedir/../eslint/bin/eslint.js" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/he

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../he/bin/he" "$@"
+else 
+  exec node  "$basedir/../he/bin/he" "$@"
+fi

MyWebSite/node_modules/.bin/he.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\he\bin\he" %*

MyWebSite/node_modules/.bin/he.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../he/bin/he" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../he/bin/he" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../he/bin/he" $args
+  } else {
+    & "node$exe"  "$basedir/../he/bin/he" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/http-server

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../http-server/bin/http-server" "$@"
+else 
+  exec node  "$basedir/../http-server/bin/http-server" "$@"
+fi

MyWebSite/node_modules/.bin/http-server.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\http-server\bin\http-server" %*

MyWebSite/node_modules/.bin/http-server.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../http-server/bin/http-server" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../http-server/bin/http-server" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../http-server/bin/http-server" $args
+  } else {
+    & "node$exe"  "$basedir/../http-server/bin/http-server" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/js-yaml

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../js-yaml/bin/js-yaml.js" "$@"
+else 
+  exec node  "$basedir/../js-yaml/bin/js-yaml.js" "$@"
+fi

MyWebSite/node_modules/.bin/js-yaml.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\js-yaml\bin\js-yaml.js" %*

MyWebSite/node_modules/.bin/js-yaml.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../js-yaml/bin/js-yaml.js" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../js-yaml/bin/js-yaml.js" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../js-yaml/bin/js-yaml.js" $args
+  } else {
+    & "node$exe"  "$basedir/../js-yaml/bin/js-yaml.js" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/jsesc

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../jsesc/bin/jsesc" "$@"
+else 
+  exec node  "$basedir/../jsesc/bin/jsesc" "$@"
+fi

MyWebSite/node_modules/.bin/jsesc.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\jsesc\bin\jsesc" %*

MyWebSite/node_modules/.bin/jsesc.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../jsesc/bin/jsesc" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../jsesc/bin/jsesc" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../jsesc/bin/jsesc" $args
+  } else {
+    & "node$exe"  "$basedir/../jsesc/bin/jsesc" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/json-server

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../json-server/lib/cli/bin.js" "$@"
+else 
+  exec node  "$basedir/../json-server/lib/cli/bin.js" "$@"
+fi

MyWebSite/node_modules/.bin/json-server.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\json-server\lib\cli\bin.js" %*

MyWebSite/node_modules/.bin/json-server.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../json-server/lib/cli/bin.js" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../json-server/lib/cli/bin.js" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../json-server/lib/cli/bin.js" $args
+  } else {
+    & "node$exe"  "$basedir/../json-server/lib/cli/bin.js" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/json5

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../json5/lib/cli.js" "$@"
+else 
+  exec node  "$basedir/../json5/lib/cli.js" "$@"
+fi

MyWebSite/node_modules/.bin/json5.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\json5\lib\cli.js" %*

MyWebSite/node_modules/.bin/json5.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../json5/lib/cli.js" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../json5/lib/cli.js" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../json5/lib/cli.js" $args
+  } else {
+    & "node$exe"  "$basedir/../json5/lib/cli.js" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/loose-envify

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../loose-envify/cli.js" "$@"
+else 
+  exec node  "$basedir/../loose-envify/cli.js" "$@"
+fi

MyWebSite/node_modules/.bin/loose-envify.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\loose-envify\cli.js" %*

MyWebSite/node_modules/.bin/loose-envify.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../loose-envify/cli.js" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../loose-envify/cli.js" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../loose-envify/cli.js" $args
+  } else {
+    & "node$exe"  "$basedir/../loose-envify/cli.js" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/mime

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../mime/cli.js" "$@"
+else 
+  exec node  "$basedir/../mime/cli.js" "$@"
+fi

MyWebSite/node_modules/.bin/mime.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\mime\cli.js" %*

MyWebSite/node_modules/.bin/mime.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../mime/cli.js" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../mime/cli.js" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../mime/cli.js" $args
+  } else {
+    & "node$exe"  "$basedir/../mime/cli.js" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/nanoid

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../nanoid/bin/nanoid.cjs" "$@"
+else 
+  exec node  "$basedir/../nanoid/bin/nanoid.cjs" "$@"
+fi

MyWebSite/node_modules/.bin/nanoid.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\nanoid\bin\nanoid.cjs" %*

MyWebSite/node_modules/.bin/nanoid.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../nanoid/bin/nanoid.cjs" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../nanoid/bin/nanoid.cjs" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../nanoid/bin/nanoid.cjs" $args
+  } else {
+    & "node$exe"  "$basedir/../nanoid/bin/nanoid.cjs" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/node-which

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../which/bin/node-which" "$@"
+else 
+  exec node  "$basedir/../which/bin/node-which" "$@"
+fi

MyWebSite/node_modules/.bin/node-which.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\which\bin\node-which" %*

MyWebSite/node_modules/.bin/node-which.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../which/bin/node-which" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../which/bin/node-which" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../which/bin/node-which" $args
+  } else {
+    & "node$exe"  "$basedir/../which/bin/node-which" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/npm-run-all

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../npm-run-all/bin/npm-run-all/index.js" "$@"
+else 
+  exec node  "$basedir/../npm-run-all/bin/npm-run-all/index.js" "$@"
+fi

MyWebSite/node_modules/.bin/npm-run-all.cmd

@@ -0,0 +1,17 @@
+@ECHO off
+GOTO start
+:find_dp0
+SET dp0=%~dp0
+EXIT /b
+:start
+SETLOCAL
+CALL :find_dp0
+
+IF EXIST "%dp0%\node.exe" (
+  SET "_prog=%dp0%\node.exe"
+) ELSE (
+  SET "_prog=node"
+  SET PATHEXT=%PATHEXT:;.JS;=;%
+)
+
+endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%"  "%dp0%\..\npm-run-all\bin\npm-run-all\index.js" %*

MyWebSite/node_modules/.bin/npm-run-all.ps1

@@ -0,0 +1,28 @@
+#!/usr/bin/env pwsh
+$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
+
+$exe=""
+if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
+  # Fix case when both the Windows and Linux builds of Node
+  # are installed in the same directory
+  $exe=".exe"
+}
+$ret=0
+if (Test-Path "$basedir/node$exe") {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "$basedir/node$exe"  "$basedir/../npm-run-all/bin/npm-run-all/index.js" $args
+  } else {
+    & "$basedir/node$exe"  "$basedir/../npm-run-all/bin/npm-run-all/index.js" $args
+  }
+  $ret=$LASTEXITCODE
+} else {
+  # Support pipeline input
+  if ($MyInvocation.ExpectingInput) {
+    $input | & "node$exe"  "$basedir/../npm-run-all/bin/npm-run-all/index.js" $args
+  } else {
+    & "node$exe"  "$basedir/../npm-run-all/bin/npm-run-all/index.js" $args
+  }
+  $ret=$LASTEXITCODE
+}
+exit $ret

MyWebSite/node_modules/.bin/opener

@@ -0,0 +1,16 @@
+#!/bin/sh
+basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
+
+case `uname` in
+    *CYGWIN*|*MINGW*|*MSYS*)
+        if command -v cygpath > /dev/null 2>&1; then
+            basedir=`cygpath -w "$basedir"`
+        fi
+    ;;
+esac
+
+if [ -x "$basedir/node" ]; then
+  exec "$basedir/node"  "$basedir/../opener/bin/opener-bin.js" "$@"
+else 
+  exec node  "$basedir/../opener/bin/opener-bin.js" "$@"
+fi