Блог

Я завершил свой первый проект в стеке MERN, но теперь я изо всех сил пытаюсь развернуть его на хироку. До сих пор я запускал как код react, так и код узла на разных портах.

Это файлы

папка клиента-это интерфейс(React). App.js в узле находится

 const express = require("express"); const app = express();  const userRouter = require("./routes/userRoutes"); const cookieParser = require("cookie-parser"); const cors = require("cors"); const compression = require("compression");  app.use(cors());  app.use(cookieParser());  app.use(express.urlencoded({ extended: true, limit: "10kb" })); app.use(compression());  app.use("/api/v1/users", userRouter); module.exports = app;  

App.js в React это

 import React from "react"; import "./App.css"; import Home from "./mainPages/home"; import Register from "./components/authentication/register";  import { Route, Switch } from "react-router-dom";  function App() {  return (  lt;div className="app"gt;    lt;Switchgt;  lt;Route  exact  path="/"  component={() =gt; (lt;Home/gt;)} /gt;  lt;Route  exact  path="/register"  component={() =gt; (lt;Register/gt;)} /gt;    lt;/Switchgt;  lt;/divgt;  ); }  export default App;  

Данные регистрации со стороны клиента отправляются следующим образом

 axios({ method: "POST", url: "http://localhost:3000/api/v1/user/register", data: data, headers: header });   

Как подключить клиент и сервер для развертывания на hiroku?

Идеально, чтобы папка клиента находилась вне папки сервера.

Шаг 1. Создайте свое приложение React и извлеките содержимое из папки вывода (папка dist).

Шаг 2. Разверните свой интерфейс в любых статических службах хостинга, например(AWS S3 или у любых хостинг-провайдеров).

Шаг 3: Разверните свой серверный API в Heroku или у любого поставщика хостинга узлов

Шаг 4: Обновите конечные точки AJAX в интерфейсе.

Шаг 5: Тщательно протестируйте и отпустите