Skip to content

Instantly share code, notes, and snippets.

@MirzaLeka
Last active March 28, 2024 23:15
Show Gist options
  • Save MirzaLeka/872f357d8e58f627f2596b37f491d444 to your computer and use it in GitHub Desktop.
Save MirzaLeka/872f357d8e58f627f2596b37f491d444 to your computer and use it in GitHub Desktop.

Angular Frontend & SSR Deployment on IIS

Videos

Angular Front

Deploy angular app to IIS - YouTube (Kudvenkat) https://www.youtube.com/watch?v=VkGmaVm6-IQ

Angular 15 deployment in IIS Server | Hosting angular in IIS Server | Nihira Techiees - YouTube https://www.youtube.com/watch?v=yrUCWuPAmS8

Node.js with IISNode

How to install IISNode on Windows - YouTube https://www.youtube.com/watch?v=JUYCDnqR8p0

IISNode GitHub: https://github.com/tjanczuk/iisnode

URL Rewrite for IIS: http://www.iis.net/downloads/microsof...

You can read my blog post on how to install IINode here: http://harveywilliams.net/blog/instal...

The GitHub gist for the IISNode basic setup is here: https://gist.github.com/harvzor/a6078...

How to deploy node application in IIS | Deployment | IIS | Node JS | Tutorial 8 - YouTube https://www.youtube.com/watch?v=WJhpIbUFwo4

Angular SSR Netlify

Converting an Angular SPA to SSR with Deployment - Angular Universal - YouTube https://www.youtube.com/watch?v=juvYWRrLtAg

  • GCP => Angular University SSR course

Blogs

Angular: Deploying Angular 9 Server Side Rendering on an IIS Server using Web.config https://copyprogramming.com/howto/angular-9-universal-9-deployment-on-iis-server-with-web-config-how-to-deploy-angular-9-server-side-rendering-on-iis-server

IIS Hosting Nodejs Application. Prerequisites: | by Adrian Jenkins | Medium https://adrianjnkns.medium.com/iis-hosting-nodejs-application-572d81689f9e

Deploy Node JS application on IIS | by Adarsh Dayanand | Medium https://medium.com/@adarsh-d/deploy-node-js-application-on-iis-9703d5dfcaca

Enable IIS and Host nodejs application on IIS | by Unlikelycreator | Medium https://medium.com/@unlikelycreator/enable-iis-and-host-nodejs-application-on-iis-a27058e1ca79

Remote Debugging Node.Js apps on IIS with IISNode (setup for Express 4) Part 2: NTVS | by Bogac Guven | Medium https://medium.com/@bogac/remote-debugging-node-js-apps-on-iis-with-iisnode-setup-for-express-4-part-2-ntvs-5eabe99d2ae9

@MirzaLeka
Copy link
Author

MirzaLeka commented Feb 25, 2024

To configure URL rewriting and handle 404 redirects in the web.config file for an Angular application deployed on IIS, you'll need to add a section within the <system.webServer> section. Here's how you can do it:

Open or create the web.config file in the root directory of your Angular application.

Add the following XML code inside the element:

<system.webServer>
    <rewrite>
        <rules>
            <rule name="Angular Routes" stopProcessing="true">
                <match url=".*" />
                <conditions logicalGrouping="MatchAll">
                    <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                    <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                </conditions>
                <action type="Rewrite" url="/" />
            </rule>
        </rules>
    </rewrite>
</system.webServer>

This configuration sets up a URL rewrite rule that redirects all requests to the root index.html file of your Angular application, allowing Angular to handle the routing internally.

Save the web.config file.
With this configuration, any requests that do not match an existing file or directory will be rewritten to /index.html, effectively routing all requests to your Angular application. This allows Angular to handle the routing internally, including handling 404 errors.

Make sure to test your application thoroughly after adding or modifying the web.config file to ensure that routing and error handling work as expected on IIS.

@MirzaLeka
Copy link
Author

Azra recommendation - Angular 15 deployment in IIS Server | Hosting angular in IIS Server | Nihira Techiees - YouTube
https://www.youtube.com/watch?v=yrUCWuPAmS8

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment