Keystone: Create a React App

[MadeByMike]

Create a React App. Basically an express middleware that runs create-react-app in dev and builds in prod.

Question: React uses the webpack-dev-server should we proxy to this or re-create the process with an express middleware?

[jesstelford]

🤔 We can use execa to start a child process which basically just runs npm start in the directory, but you're right we'd have to either proxy requests, or start it on a different port and make that clear to the user (but then the "prod" version would be on the same port which has implications for cookies and CORS, etc).

[jesstelford]

Something like https://github.com/chimurai/http-proxy-middleware might work well 👍

[MadeByMike]

Yes! Maybe a proxy middleware is the right move and it can serve any front-end application framework that comes with it's own dev server. The only challenge with that is finding a sensible way to kick-off the applications within the middleware so that it feels like a single yarn dev command.

[JedWatson]

This would be really nice to have, but not a high priority if it takes much time. Setting as low for now. Would be a great contribution 👍

[GasimGasimzada]

Does it have to be "Create React App"? What about managing a custom webpack configuration?

EDIT: I was able to set up a custom React app configuration that uses webpack dev and hot middleware for development and express static middleware for serving production builds. There are a lot of options missing in webpack configuration.

If you do not require using "Create React App" specifically for webpack configuration, I am willing work on this and provide an extendable interface that allows choosing the source and build directories, as well as extending webpack configuration to add additional features (e.g a user can install svg-loader if necessary).

To get users starting in a fast way, I suggest supporting the following features:

• Typescript
• Standard assets (fonts, images etc)
• CSS Modules, SASS, Styled components (emotion and / or styled-components)
• Importing GraphQL files (.gql / .graphql)
• Markdown / MDX

[stale[bot]]

It looks like there hasn't been any activity here in over 6 months. Sorry about that! We've flagged this issue for special attention. It wil be manually reviewed by maintainers, not automatically closed. If you have any additional information please leave us a comment. It really helps! Thank you for you contribution. :)