Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to host angular 2 website?

How to host angular 2 website?

I am new to angular 2 and I made a simple website with no back-end.

I wondered that when I tried to open directly index.html file, it opens with error.

But after command "npm start" it works fine, which runs a local server on computer.

So, how to host this website on simple hosting sites (Not a Dedicated Server..!)?

I think hosting sites automatically find index.html file, but here is the problem, index.html is don't start without "npm start" command.

can I have to start an process for that on server?

please guide me.

like image 701
Yash Avatar asked Mar 03 '17 08:03

Yash


4 Answers

If you have got a simple hosting package, the answer is You can't.

A hosting package at a normal hosting provider does not offer this.

Either you need a 'special provider' like Google Firebase or you need to have your own (virtual) machine (at a hosting provider).

like image 196
RWC Avatar answered Oct 11 '22 19:10

RWC


you can use http-server :

http-server is a simple, zero-configuration command-line http server. It is powerful enough for production usage, but it's simple and hackable enough to be used for testing, local development, and learning.

npm install http-server -g

build the project by:

ng build -app

then on project directory use:

http-server dist/ -p 3000 // -p is port 

on browser http://localhost:3000 or http://your-ip:3000

like image 44
waris Avatar answered Oct 11 '22 20:10

waris


you can use heroku to deploy your solution :

https://www.heroku.com

like image 41
Ahmed Avatar answered Oct 11 '22 21:10

Ahmed


Host your Angular 2 App on Firebase using these simple steps: Do Create a project with Angular CLI first. Get More info here https://cli.angular.io/

Step 1: Build your App

Run the below cmd to build

ng build --prod

Step 2: Create FireBase project and Install Firebase CLI

Open the Firebase console at https://console.firebase.google.com/ and create a new Firebase project.

To install the Firebase command line tools run:

npm install -g firebase-tools

Step 3: Deploy to FireBase

Run the below firebase cmd to login:

firebase login

It will open the browser and ask you for authentication. Login with your Firebase account. There after you can close the browser window. On the command line you'll receive the message that the login has been performed successfully.

Now run the below cmd:

firebase init

First of all you're being asked which of the Firebase client features you want to use. You should select the option Hosting: Configure and deploy Firebase Hosting site. Next the Firebase client will ask which folder to use for deployment. Type in dist. That is important because that is the location where our production build is stored.

Next the question is ask if this app is a single page app and if it should rewrite all URLs to index.html. In our case we need to answer yes.

Last question is if Firebase should over write file index.html. The answer to that question is no.

Now, Run the below cmd to deploy:

firebase deploy

Firebase will provide a URL which you can use to access your application online.

[Update]

Now after you have successfully deployed your app if you want to make some changes and deploy the code on same URL. Follow the same procedure. But make sure You are pointing to your project.

To list all projects use this command:

firebase list

To make a project as a current project use:

firebase use <project_id>
like image 37
AmanDeepSharma Avatar answered Oct 11 '22 21:10

AmanDeepSharma