Serving Ionic app in Cloud9

ionic-v1
1

I’m trying to setup a new ionic project in Cloud9. I’m able to run terminal commands to create new projects, add plugins, etc…

When I try to serve the ionic app (using the terminal command “ionic serve”), I receive a message saying the app is running at this address:

Running dev server at http://172.17.65.208:8100
Running live reload server at http://172.17.65.208:35729

This is, of course, expected. But when I access this address in Cloud9 browser, nothing happens.

After some research I found that Cloud9 has some limitations when setting up web servers. For example, for nodejs servers, we can’t assign an arbitrary port to the server. Instead, we should use process.env.PORT and 0.0.0.0 as the server address. Since ionic creates a local server to serve the app, I believe this limitation might apply as well.

Please advise.

2

I found a solution.

I created a test nodejs server that displayed the process.env.PORT variable. It turns out that Cloud9 uses 8080.

When I serve the app using this port, it works.

3

Hi angelofranco,

I have the same issue: the ionic server is starting on 8080, but if I click on the dev server link I get an empty page.

Running dev server at http://172.17.19.1:8080
Running live reload server at http://172.17.19.1:35729
  changed: www/index.html
  changed: www/index.html
  changed: www/index.html

What URL did you use to preview the app?
My workspace type is custom, did you also created a custom or nodejs workspace for your project?

Thanks,
Radu

4

Radu,

Go to Tools -> Preview -> Preview with Web Server

It will open a browser in your workspace with the appropriate url. You can use this URL anywhere, including your mobile devices.

Regards,
Angelo

5

Thank you, it works!
BTW, I am using ionic serve $PORT to start the server.

1 Like