Deploy Mappa

[agonzalez0515]

Should we deploy what we have so far? It's usually easier to debug deploying issues when there's less features/code.

Hosts we can use for free:

• Netlify
• GitHub Pages
• Heroku
• Now

Out of these, I know Now is very React friendly. I'm sure the rest are too, but we need to do some reading about it. The main thing is we have a lot of API keys, so need to use a host that will make that easiest to use. I've used Netlify and Heroku before for other projects so I'm a little familiar with them.

[khusbuchandra]

Thanks @agonzalez0515 for starting this discussion. We should starting setting it up, so that we have time to troubleshoot issues related it before our deadline. I remember @tanyagupta mentioning we would be using GitHub pages for deployment. I have also heard from other group projects that Heroku is easier with React.

[tanyagupta]

@khusbuchandra that was before the move to react -structure was much simpler then. So not sure github pages is still an option....

[agonzalez0515]

I did a quick read of GitHub pages and it looks like it can be a headache with React. I'll do some more reading on the other hosts.

[tanyagupta]

Google App Engine is another possibility

[digilou]

I love Heroku! But I'm more familiar with deploying Rails apps rather than Node/React apps....

I'm glad this was mentioned because I was wondering the same thing.

[agonzalez0515]

Probably going to give this a try tonight

[khusbuchandra]

@agonzalez0515 , I got some resources from Bryan for Heroku: https://github.com/motosharpley/create-react-app-buildpack https://github.com/motosharpley/heroku-cra-node https://devcenter.heroku.com/articles/nodejs-support Check them out, if that helps. He has also recently done for Navi and we can reach out to him for help.

[agonzalez0515]

Amazing thank you!

[agonzalez0515]

I was able to deploy to heroku! https://mappa-gwg.herokuapp.com/ But cache/offline/service worker not working :( If anyone wants to be added to the heroku admin, let me know!

[tanyagupta]

This is wonderful! Thank you

On Fri, Mar 30, 2018 at 2:04 AM, Angelica Gonzalez <notifications@github.com

wrote:

I was able to deploy to heroku! https://mappa-gwg.herokuapp.com/ But cache/offline/service worker not working :( If anyone wants to be added to the heroku admin, let me know!

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/gwg-women/gwg-women-techmakers/issues/117#issuecomment-377453520, or mute the thread https://github.com/notifications/unsubscribe-auth/AIGoehq80hVKRH4dURjbAI-KMwk5cLleks5tjcrigaJpZM4S_HcF .

[tanyagupta]

Are the service workers not working because we need an https:// ? https://letsencrypt.org/ Let’s Encrypt is a free, automated, and open Certificate Authority and we can get an SLL certificate from there if needed

On Fri, Mar 30, 2018 at 7:27 AM, TG gupta.tanya@gmail.com wrote:

This is wonderful! Thank you

On Fri, Mar 30, 2018 at 2:04 AM, Angelica Gonzalez < notifications@github.com> wrote:

I was able to deploy to heroku! https://mappa-gwg.herokuapp.com/ But cache/offline/service worker not working :( If anyone wants to be added to the heroku admin, let me know!

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/gwg-women/gwg-women-techmakers/issues/117#issuecomment-377453520, or mute the thread https://github.com/notifications/unsubscribe-auth/AIGoehq80hVKRH4dURjbAI-KMwk5cLleks5tjcrigaJpZM4S_HcF .

[agonzalez0515]

The service worker is being registered and it's serving cache first. But the install function is not caching the assets and the basic html page. I suspect I have the paths wrong because of react and heroku. When we run build, it's bundling the files and I'm not 100% sure what the final paths are. I did reading last night but couldn't find an answer yet.

[amr08]

Hi @agonzalez0515 I suspect that the sw not working in offline mode might have had something to do with this, but that will be hard to tell.

Do you have a branch with all this code on? Is it static 2? < I didn't see the server there can I see that code? I believe you'll have to push /build to github for heroku to know to read it. Meaning, your static 2 branch should allow /build to be pushed up.

[agonzalez0515]

All of the sw code is merged to dev now, so that's what I pushed to heroku. I used this buildpack for heroku which runs the build command when you push. https://github.com/mars/create-react-app-buildpack

We're not using a server, do we need one?

[amr08]

Hmm, yea this seems a bit complicated for what it really takes to build up a server for a heroku deploy... I can write one up, but it will come with a few requirements for our branches. Example (we would just need a build branch that will be different from master - used only for deploys.

But before all that...

Let me try this, I'll load something up locally tonight to test it on a server to see if I run into the same issue. If I do, issue #130 should be opened back up because that's probably the source of the problem.

[amr08]

If I don't run into the same issue, then generating our own server might do the trick

[digilou]

@agonzalez0515 When I've set up Rails apps, I've had to configure a server before. I had to find out how in the Heroku docs. Not sure how it works with Node and React though....

[amr08]

@digilou @agonzalez0515 It's super easy in Node! :) Although I want to try it locally to see if that is even the problem. If the SW doesn't work this way either, then we have to turn our heads to the SW and open up #130 :/ I'll keep you posted on what happens tonight!

[agonzalez0515]

Just wondering, can you explain or point me to resources on why we need a server? Aren't we generating a static site when we build and then heroku takes care of the server?

[digilou]

@agonzalez0515 When I looked at Heroku docs, it looks like Node.js stuff is good to go. In Rails apps I have to set up a Procfile to config the puma web server.

[agonzalez0515]

Just to summarize what I did:

1. created new heroku app
2. added buildpack
3. git push heroku dev:master which runs the buildpack and then runs the CRA build command and pushes the build folder to heroku
4. Add environment variables
5. Rebuilt again so the env variables work

I can share a screenshot of my command line later tonight of when the buildpack runs because I feel like there's something important in there.

[amr08]

Hi All - ok so I've debugged a bit. The good news is I have it running locally on the server with what would be served up to heroku barebones. The offline mode still doesn't work which really concerns me because I feel the s/w is not totally functional. Example if a website (server) went down - not wifi, it wouldn't show anything. <I've tried to debug that and was unsuccessful.

@agonzalez0515 I can't really explain it well in a technical sense - but helpful to think of it more as the files are being "served up". CRA in order to deploy has to run on a proxy server, or within it's own server (What we had to do in the days before CRA... We've come a long way since then. haha). It looks like this build pack uses a proxy server. I just created a custom one as preference to reduce bulk and in this case, simply for debugging purposes.

So anyway, I still think the app can work with this buildpack if you try with these changes and if it doesn't, at least there's a potential fallback. First can you try taking everything out that says doCache as pictured here?

I did something else after this, but let me know how the deploy goes with this first.

[agonzalez0515]

@amr08 I've been working with @khusbuchandra and @sonalikatara but didn't make much progress. I removed the doCache and some other things (I don't even remember anymore because it's been 5 hours) and we're getting some new errors about http vs https. So that's something. You should be able to see it in the console here https://mappa-gwg.herokuapp.com/.

I do think it's something to do with the buildpack and cra-append but not sure why or how.

[amr08]

@agonzalez0515 @khusbuchandra @sonalikatara All heroku websites are https out-of-the-box so I wonder where the http is coming from.

Took a closer look at the error message and it looks like the proxy server (nginx) the buildpack is using is not happy. No idea what is going on under the hood.

^In sw.js try changing the cache to the exact file names rather than directory in the sw - so whatever the name of the file is in static ex: static/css/jdfhakjdhf.css and static/js/sldjfsdkjf.js

What branch are you guys working from? I'll pull it down and try to mess with it a little, also if you can add me to the heroku admin that would be great!

[sonalikatara]

@agonzalez0515 try installing and running npm packages though package.json So add this in the end root package.json "heroku-postbuild": "cd client/ && npm install && npm install --only=dev --no-shrinkwrap && npm run build"

On Sat, Mar 31, 2018 at 6:24 AM Andrea Roche notifications@github.com wrote:

@agonzalez0515 https://github.com/agonzalez0515 @khusbuchandra https://github.com/khusbuchandra @sonalikatara https://github.com/sonalikatara All heroku websites are https out-of-the-box so I wonder where the http is coming from.

Took a closer look at the error message and it looks like the proxy server (nginx) the buildpack is using is not happy. No idea what is going on under the hood. [image: screen shot 2018-03-31 at 9 07 28 am] https://user-images.githubusercontent.com/17239196/38163486-121d38de-34c3-11e8-92d7-7deebdbbc63f.png

^In sw.js try changing the cache to the exact file names rather than directory in the sw - so whatever the name of the file is in static ex: static/css/jdfhakjdhf.css and static/js/sldjfsdkjf.js

What branch are you guys working from? I'll pull it down and try to mess with it a little, also if you can add me to the heroku admin that would be great!

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/gwg-women/gwg-women-techmakers/issues/117#issuecomment-377692804, or mute the thread https://github.com/notifications/unsubscribe-auth/AD-IVyIU55gf-O4bPmTM-RF1XFvhS1kHks5tj4OOgaJpZM4S_HcF .

[amr08]

Hi all - i've done a ton of debugging for a few hours. I made a lot of changes and was able to get offline mode to work locally, but am still seeing the same issue (even deployed to heroku from my own server). That means there's other issues happening here with SW and CRA. I found an issue that was resolved on feb 8th (after we created this app) I think this could be a source of the problem or at least one of them (I found a few others, but this should be fixed first).
process.env.NODE_ENV in registerServiceWorker.js returns as "development" instead of "production".

Deleted this link because it commented in their repo < oops

Can someone else pick it from here and look into this?

[agonzalez0515]

Thanks @amr08! I've been working on it all night and this morning and I'm 75% sure it's cra-append package.

Do you have a branch I can work off?

[sonalikatara]

@amr08 was the offline mode not working for you when you checked out the latest Dev branch? Also, were you getting any error on running it?

On Sat, Mar 31, 2018 at 12:07 PM Angelica Gonzalez notifications@github.com wrote:

Thanks @amr08 https://github.com/amr08! I've been working on it all night and this morning and I'm 75% sure it's cra-append package.

Do you have a branch I can work off?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/gwg-women/gwg-women-techmakers/issues/117#issuecomment-377715955, or mute the thread https://github.com/notifications/unsubscribe-auth/AD-IVzsagZLOHLIvexfIIYcWpOI2GEpaks5tj9P1gaJpZM4S_HcF .

[amr08]

^ I created a small PR with a few fixes so that it at least works in offline mode when you guys are developing/debugging.

One problem with buildpack, is that you have no control over the build files (after they are deployed) so you cant edit the sw.js file to read the new .js and .css files.

[amr08]

Sorry I didn't get to answer all your questions - I'll have move time to hop back on after my son goes to sleep tonight 8pm EST - ish

[amr08]

Finally getting something on my end!!! It's been a long road. I have a branch test-server that you can review, but I ⚠️ wouldn't recommend working with (it's quite volatile and not in a healthy place), but I did get a service worker running in production. There's a lot more tweaking to do before anything would be ready to launch to the greater group.

Notes: The reason there's so many commits is that heroku needs to read the build files from github, so I have to push every little change that goes through.

Problem: Heroku was reading the CRA script and running in development mode in the server after deploy - I've never seen anything like it. I had to create my branch as a build branch instead. If we want to use this after I fix it up, we will essentially copy the build file over to this build branch (which would have to be renamed)

I have to sign off for tonight - my husband is literally staring at me with the "What the heck?" eyes!

[khusbuchandra]

Thanks @amr08 , enjoy the weekend

[amr08]

Thanks @khusbuchandra Will be back tomorrow night to do the code review: Also forgot to post the working deploy: https://testmappa.herokuapp.com/

[amr08]

Just to update the group. It looks like @agonzalez0515 pulled my branch and did some work on it last night to touch things up on her end so I will step off this issue. Happy to have contributed to the troubleshooting process.

[agonzalez0515]

Deployed here - https://mappa-gwg.herokuapp.com/ Will open up new issues for perfomance problems.