How to deploy ionic-react as a webapp?

Hi,

I developed an app using ionic-react and now I want to deploy it as a webapp. Specifically, I want to deploy my ionic-react app to Microsoft Azure.

The ionic frameowkr is great especially with the react snytax. However, there is not enough deployment examples in the docs. There is one example on how to deploy it with firebase but I want to use MS Azure instead. Is this possible?

Have you guys done this before?

Since it’s really just a react App with Ionic UI, it shouldn’t be any different than how you would deploy a react app to azure. If you want to host on azure, look at their static web apps hosting offer.

Thanks for the response, you said: “it should be any” different than how you would deploy a react app to azure. You mean “it should not be any” right?

Correct! It’s early for my, still waking up it seems :smile:

Thanks. I already tried that but It didn’t work. I mean I deployed the files on azure but I see nothing when I access the website url. Is there some configuration or build process before deployment? Should I use this command that they used in the firebase example before deploying the files to azure? ionic build --prod

No, just run ionic build and deploy the dist folder to the service.

1 Like

@mhartington wow man thanks. That was pretty easy actually. It worked! I hope this question can help other people who are new to ionic. The framework is really solid and great.

However, I think the docs should be updated or at least the community should write docs for ionic-react and ionic-vue too because I noticed there are many example only with ionic-angular

Docs are open source, so if you’re up to it, we’d gladly accept a pull request to improve them :smile:

2 Likes

I have the same issue and just for clarification:
“ionic build” cmd create “./build” directory (not dist).
so we must manually put all the content to the azure service folder ?
Actually, my static web service is linked to my github repo (ionic-react-app)

And i have a running (empty) static web app who shows:
" Your Azure Static Web App is live and waiting for your content"

Do you have the step by step actions ?