Ship it!
NOTE: This post is outdated. The latest deployment instructions can be found here.
You may have spent hours working on a brand new iTwin.js app that is going to revolutionize the infrastructure industry…or you may just be tired of sending zips of your code across the globe. You have decided —
It’s time to deploy your app.
It’s truly incredible when you can copy a link, send it to someone, and finally witness the moment that developers strive to experience:
However, you may be overwhelmed by the myriad of web hosting options and configurations out there.
Good news! We have been deploying lots of iTwin.js apps as static sites on Azure. Since Azure is a professional grade solution, we have decided to share this process with you. Let’s break it down into three simple steps:
- Get URL
- Register App
- Deploy Code
They all come with concise ~ 1-minute video clips :)
1. Get URL
The first thing we need to do is get a URL for our app. This involves creating a new resource on Azure and configuring it as a static website.
Bonus: Azure comes with a 30-day trial so you can start right away for free.
2. Register App
Once we have a URL, we need to register an application on the registration dashboard. As part of the registration, we provide a redirect URI which is based on the URL above. We also need to add this information to the app config.
Note: The config (configuration.ts + config.json) has been moved to .env.local for each app.
3. Deploy Code
What would happen if we deploy the frontend code and give it a test?
Exactly! It will fail without a backend. As mentioned in a previous post…all our interactive samples are configured to use a local backend by default. Local backends cannot be used by a deployed app.
Luckily iTwin.js comes with a general-purpose backend, which is a deployed backend anyone can use. Luckier still, it can be turned on by changing a single variable…
Note: The contents of webresources can now be found under “build” in the root directory.
