Saturday, November 17, 2018

Things that are hard: trivial POST request from the browser

I'm trying to make a trivial web app. Why is this so hard?

Glitch is an amazing site for making this, but its "simple node app" example does not POST anything back to the server.

I finally got this working. Here's the result -- it might be useful to you to remix it.

https://send-json-post.glitch.me

Things I figured out:
  • add the json middleware to express
  • some library to post from the client. I used axios because it's what we use in our apps. This is probably not the simplest one
  • browserify middleware to be able to install it from the client
  • the Chrome developer tools, alt-cmd-I on a mac:
  • you can see the request headers in the network tab if you click on the request of interest and then scroll down in the right place.
  • to play with things in the console, like trying to make a POST request: find the script under "sources". put a debug point where you need access (like in my case, I needed axios, so I put it at a place where I used it). Then in the "scope" section of the debugger, find that variable, right-click on it, and save as global. It appears as "temp1" in your console. Don't forget to push play to make the debugger let go. The global variable stays available and you can call "temp1.post(...)" etc to figure out what you're doing.

Then getting anything to update in the front end, that was hard too. I'm definitely going to bring in a front end framework before I try to do anything further.