How to Deploy a React App to IONOS Hosting

How to Deploy a React App to IONOS Hosting

React
Deployment

Last December (2024), a former client reached out to me requesting a single-page application (SPA) website for their company profile. Recently, they encountered a problem: the website couldn’t go live because their Wix subscription was about to expire, and they were unable to proceed with deployment on their own. They asked me to step in and help deploy the project to their IONOS hosting.

That’s where the real challenge began. IONOS, being a German hosting provider, has a workflow and interface that can be quite confusing—especially for those unfamiliar with it. Although the deployment process should have taken less than an hour, I spent about one hour just figuring out how IONOS handles file uploads and configurations. As a result, the total deployment time ended up being around two hours. IONOS Dashboard Preview

In this post, I’ll document the steps I took to successfully deploy the site. Hopefully, this can help others facing similar challenges with IONOS, and also serve as a personal reference for future projects.

Deploying a React app to IONOS (shared hosting) is simple once you understand the static nature of React builds. Here's how to do it:

1. Build the React App

If you're using Vite:

npm run build

This will generate a folder:

  • dist/ for Vite
  • build/ for CRA

2. Prepare the Output for Upload

Open the generated folder and prepare to upload its contents, not the folder itself.

You should see files like:

index.html
assets/ or static/
*.js, *.css

3. Log in to IONOS

Go to https://my.ionos.com/

Navigate to Hosting > Webspace or use File Manager.

4. Log in to IONOS

  • Go to your domain’s root directory (usually /)
  • Delete the existing index.html, if needed
  • Upload all files from build/ or dist/, including index.html, assets/, etc.

5. Test the Site

Once uploaded, go to:

http://yourdomain.com

If everything is correct, your React app should load.

6. Enable HTTPS (SSL)

If https:// doesn’t work:

  • Go to Domain & SSL in IONOS dashboard
  • Activate a free SSL certificate (e.g. Let’s Encrypt)
  • Make sure the domain is assigned to the certificate
  • Optionally, create a .htaccess file to force HTTPS:
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

Done!

Your React app is now live on IONOS 🎉

Let me know if you want the .htaccess file or favicon setup as well.