DEV Community

Junior Gantin
Junior Gantin

Posted on

5 1

Deploy Angular Apps To Surge

I usually use Heroku for hosting my Angular Apps. It works fine but I want to try anything else: something new, something smart. I heard about two deploying tools dedicated to front-end developers: Netlify and Surge. In this article, I will show you how to deploy Angular apps to Surge.

What’s Surge?

Surge is a simple tool for publishing HTML5 apps without leaving the command line. Surge is powerful. I took 10 or 20 minutes sometimes for publishing Angular Apps on Heroku because you need to create a Procfile, add express and angular-cli on app’s dependencies and so on. But with Surge, you need to build your app and it’s alive!

How to do it?

First install Surge using npm:

$ npm install -g surge
Enter fullscreen mode Exit fullscreen mode

Create a new Angular app:

$ ng new angular-surge
$ cd angular-surge
Enter fullscreen mode Exit fullscreen mode

What you need to do now is to build your application for production environment.

$ ng build --prod
Enter fullscreen mode Exit fullscreen mode

Now angular-cli put the build artifacts into dist folder. You need to deploy this folder with surge. Let’s move into dist folder with command line and start deploying.

$ cd dist
$ surge
Enter fullscreen mode Exit fullscreen mode

Voila! Account creation will happen on your first run. Surge will show you where your application is alive on. Enjoy!

You can do more with Surge. Custom domain, 404 page, SSL and so more. Here is where you can start with these functionalities of Surge.

Never forget that you can deploy your Angular apps in one minute or less with Surge!!!

Happy coding!
Originally published at Medium on January 14, 2018.

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

SurveyJS custom survey software

JavaScript Form Builder UI Component

Generate dynamic JSON-driven forms directly in your JavaScript app (Angular, React, Vue.js, jQuery) with a fully customizable drag-and-drop form builder. Easily integrate with any backend system and retain full ownership over your data, with no user or form submission limits.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay