Home

Deployment

heroku deployment

coming soon...

zeit.co deployment

I've successfully deploy to zeit separating the client and the server. Here are my steps:

1. first I attempted to deploy the server

cd server
now

No problems... so after a successful deploy... I did:

now alias https://socket-io-typescript-example-aknmfgiriy.now.sh mapdrops-api

I have a side project called mapdrops about analyzing run data and learning Angular 5. I used the alias 'mapdrops-api' to mark it as my API.

2. update the client to point to this new remote url https://mapdrops-api.now.sh instead of localhost:8080 and use the environment files as configuration.

export const environment = {
  production: true,
  url: 'https://mapdrops-api.now.sh'
};

Find src > app > chat > shared > services > socket.service.ts

import { environment } from '../../../../environments/environment';
import * as socketIo from 'socket.io-client';

//const SERVER_URL = 'http://localhost:8080';
const SERVER_URL = environment.url;

I ran client locally and it connected to the remote url so I felt confident to deploy it

now

After a successful deploy... I did the alias

now https://typescript-chat-client-djuavnsujl.now.sh mapdrops  

This time, when I checked the url https://mapdrops.now.sh in the browser I got:

Invalid host header

I encountered this problem yesterday and, while I don't have a perfect fix for it yet, this does work:

Edit package.json

"start": "ng serve --disable-host-check",

If anyone has a better solution here, I'd like to hear it ;-D

I deployed it again, did the alias, and both the client and server are talking to each other now:

working demo