How to integrate Strapi API and Admin Panel with another node app (that consumes Strapi API)?

Question

I'm trying to develop an app that uses Strapi Admin Panel api generation, and, at the same time, serves as a website that consumes this api.

So, basically, I'm trying to build a website:

• where /api route servers as a Strapi API endpoint

• where /admin route serves as a Strapi Admin Panel for API creation

• where all the other routes are configured to serve my website, i.e.:

  • / route is the landing page of my website

  • /contacts is the contacts page

  • etc.

• And, moreover, the static files of the website (html/css/etc) should be served from the server that, respectively, consumes the generated API (server-side).

---

I hope I'm not expressing myself too vaguely.

Essentially, I need to integrate one node.js app (my website) with another node.js app (Strapi) in such a way that they work seamlessly together as one.

---

Does anybody know how to achieve that?

---

I've read some answers here on Stackoverflow and on Strapi GitHub issues, and some people said that the way to achieve that is to run two separate apps on different ports, but it doesn't feel right to me (or maybe I just don't understand some basic stuff).

What I need is to make a single app that is, basically, a simple multi-page website, but enhanced with api generation tools from Strapi.

---

I have my Strapi app up and running and I thought maybe I should find some place in the app folder structure to put my website (i.e. all the static stuff to the public folder), but where to put the server-side stuff?

And I'll need to use a templating engine, so the question of "where to put the client-side files" arises again. The more I dig into the code, the more I get confused.

---

PS: I'm fine using Koa which is used as a server for Strapi.

PPS: Further, I'm planning to deploy the app to Heroku on a single Dyno (if it is important).

Answer 1

Okay I just played with the routing prefix and that is the solution I suggest you.

So you will have to build you website app. And push the build in the ./public folder of the Strapi application.

Then in your api/.../config/routes.json files you will have to add an option prefix in the config key of each of your routes and for all your APIs

{
  "routes": [
    {
      "method": "POST",
      "path": "/restaurants",
      "handler": "Restaurant.create",
      "config": {
        "policies": [],
        "prefix": "/api"
      }
    }
  ]
}

• So at the end you will have your admin on /admin
• Your APIs endpoints prefixed by /api
• And your website/assets on /