Frontend website strategy about responder HOT 18 CLOSED

@metakermit that's exactly the flow that's in place.

from responder.

I like that.

from responder.

I have a prototype available here: #72

from responder.

@metakermit off master, you can now run static from /, but that disables all other routes;

api = responder.API(static_route="/")

from responder.

v0.1.0 released, which includes this.

from responder.

running 'npm build' that is.

from responder.

OK, great! I'll see if I can cook up a nice working example with Parcel + React and then we can talk about an official buildpack / Dockerfile or something that would run npm install / npm run build if there's a package.json and therefore encode this standard 🙂.

from responder.

As a first baby step, I've made a very minimal React + Parcel example featuring:

• ES6 modules
• image importing
• frontend routing (using React-Router)

To deploy it's enough to do npm install & npm run build which packages everything in a dist folder ready for serving.

Here's the code:

https://github.com/metakermit/responder-react

I haven't touched any Responder stuff so far, but I see that there are going to be some challenges:

• it should be possible to serve static files on / instead of static/
• / should serve index.html
• all urls not found in Responder's own routes should be forwarded to index.html (which would be needed for frontend routing)

Starlette has options for some of these things, but I think they aren't all exposed in Responder.

As a side-note, I did solve some of these issues with Django & Whitenoise here, so I have some ideas for how these things could be solved. Not sure what the best approach would be in Responder architecture-wise.

from responder.

Wow, that's a great start. I'll continue working on this tonight and see if I can get the cli to build the frontend if it's there (e.g. a package.json is present) and copy whatever's in dist to the static folder.

from responder.

Now, off master, if you do this:

api.add_route("/", static=True)

static/index.html's content will be the response to /.

from responder.

Now, off master, if you have a static=True route, all routes will be forwarded to static index.html responder.

from responder.

this still leaves

it should be possible to serve static files on / instead of static/

but I think that's a small workaround, for now.

from responder.

@kennethreitz Perfect, that solves most of the SPA requirements, I think 🎉 I'll test it and if it works, we can later see if we want to have some order of precedence in the future, e.g. in the static=True mode:

1. check responder routes first (e.g. for some /api/users/ endpoints etc.)
2. if there aren't any, redirect everything to index.html to handle
3. the frontend then checks its routing and is responsible for the 404 page etc.

from responder.

I don't know much about single-page web apps, but this will always result in a 200 response from the server, even if it appears as though it's 404.

from responder.

unless there's a specific 404 view defined

from responder.

cool, i'll ship it

from responder.

Sure, I think that's fine. I think the way it's done is that if the frontend doesn't find its template, it renders a 404 page. Traditionally this is done by setting nginx to forward everything to index.html, but with Responder we don't need nginx 🙂

Awesome! 🚀

from responder.

Just an update that I've managed to update https://github.com/metakermit/responder-react to seamlessly deploy to Heroku with everything working as expected 🎉

It took some custom Parcel flags, a custom Heroku build step and an app.json that configures multiple buildpacks, but now you can simply hit that "Deploy to Heroku" button and you have a super smooth Responder + React SPA experience 🙂

from responder.