Foundation 6 (with browsersync) on Cloud9 - can't get it working

browsersync
nodejs
gulp

#1

I’m trying to get a simple setup of Zurb Foundation with their implementation of gulp+browsersync going.
I installed foundation and when I run the “foundation watch” command it seems to start gulp fine and says browsersync is running and listening on: (I edited the port in the gulpfile as mentioned in the cloud9 blog post)
" Local: http://localhost:8082
External: http://172.17.24.49:8082"

But I can’t bring this up in the browser. I’ve tried the address given in the blog and I get
"Cannot GET /[username]/[workspace][workspace]-[username].c9.io/dist/index.html?_c9_id=livepreview0&_c9_host=https://ide.c9.io"

Also, the blog says I should start the apache server, but is that necessary? I can’t see why it should be.


#2

if browsersync serves content on 8082 you need to open it as
http://[workspace]-[username].c9.io:8082/dist/index.html

http://[workspace]-[username].c9.io/dist/index.html is for port 8080

maybe the blog post you used was about using apache or another server together with browsersync, but if you do not need apache, just use 8080 for browsersync, something like:

{
   server: 'dist', 
   port: process.env.PORT,
   ui: { port: 8081 }
}

#3

Thanks!
You are right and it works on http://[workspace]-[username].c9.io:8082/index.html
I’m sure I tried it, but I must have either missed the exact combination needed to get it working or possibly got caught out by the “Unable to load http preview - open in a new tab” error message. It woks once it’s in a new tab.


#4

Ok. Oddly, this worked for about 5 days and then hasn’t worked since.
I haven’t changed anything on my configuration, but trying to open the url in a new tab now gives a “not found” error and talks about needing to authorise.