search

Home  >  Q&A  >  body text

Rendering static folders for React routes

I have some legacy static code (HTML, CSS, jQuery, JS, etc.) in my folder. Now I need to render these on a specific route in my react app. Due to some policy reasons, I cannot use iFrame. I don't want to rewrite it in React for two reasons:

So, if I rewrite it in React, then I end up with two versions: one is the React version of the page, and the other is the non-React version of the page. If I want to change then I need to update twice.

What are my options? What's the easiest and less confusing way to render static files within a folder in my React app without using iFrames?

P粉107772015P粉107772015301 days ago476

reply all(1)I'll reply

  • P粉194919082

    P粉1949190822024-01-17 12:34:40

    You can add static files in the public directory and copy the required paths using folder copy and then serve these files statically. If the route is /display, you can add a folder called display. Assuming your file is named contact.html, your file will be located under /display/contact.html.

    Link to file via react

    // ...
    return (
      <a 
        href="/display/contact.html" 
        // if you want to open it in a new tab
        target="_blank" 
      />
    );

    reply
    0
  • Cancelreply