So, the idea is to add create-react-app like functionality to plone-react.This is the new app generator that we may use for initialising plone sites just with a single command like create-plone-react app or so. We may use Pastanaga UI as a boilerplate theme.Also we can extend this by adding PWA functionality to it as CRA is a PWA itself.
Here's the basic approach I have decided to follow so far (correct me if I missed something):
Trigger create-react-app to create a new app with a provided app name.
Configure, download and install a list of additional packages.(Here power of webpack and other tools may come in handy).
Replace the default template files with new files as needed.(May be pastanaga theme will be in use here).
This is listed under GSOC projects list. Any feedback regarding is appreciated.
Have you reviewed Plone CLI and whether it would be better to extend that? Note that Plone CLI is Python (as opposed to Javascript) and serves a similar function for bootstrapping Plone projects.
Not yet, Pastanaga is new stuff. I'm sure it can be extended to support (whatever that means) in the future. That said, a Javascript implementation like create-react-app might make sense also.
This looks like something proper to start with @nileshgulia1
Anyways, it'd be really helpful if we got some ideas on what technologies/packages to use and how to implement all this together as an app.
@ajayns. Create-React-App provides some convenience features, such as: a live development environment, boilerplate code, and standard dependencies pre-installed, we'll implement something like this only.Developers can initiate applications via Create-Plone-react app with confidence that the tools and configurations will allow them to take their application from development to deployment.
we"ll try to adhere to some guidelines for the project:
The generator shouldn’t require create-react-app to be ejected. That way apps generated with the tool can be easily upgraded to new versions of react-scripts.
The template should follow create-react-app's convention:
create-[plone-react] [app-name] to make it feel immediately familiar to people who already use CRA.
And at last it also should require zero configuration.
We'll use pastanaga ui(which I'am currently not much aware of) in reacts-scripts/templates to generate a boilerplate code(ui).
Currently I'am working with insides of CRA, How it is implemented and exploring the folders inside. When the plone-react repo actives I'll start implementing it asap.
Excited to work on it in future
The idea is solid and looks good, thanks for the clarification. But my question was mostly directed at the Plone mentors to know what they had in mind so we both can be in sync and also suggest new ideas if they look promising.
The is the basic idea which probably mentors will have in mind as this is the straightforward approach(for me ) . I'am making a demo app for this which is also a react-app generator implementing this approach, may be mentors may get a clarity after seeing it implemented.
Looking forward to see this app generator which you are talking about then! Do share the link and also mention if you want any assistance in implementing it!
@tkimnguyen@tisto Here's the approach I have decided to follow so far. I have tried to implement a basic app generator out of Create-react-app. It talks to plone.restapi and sends a GET request. Right now the app just replaces the CRA’s templates files with our own and adds additional packages without ejecting the initial configuration. I am struggling with when to use eject feature of CRA and when not to use it. Can anyone help me clearing the doubt please?
Quick Proof of concept : https://github.com/nileshgulia1/App-generator-CRA
@tisto@tkimnguyen How about creating a fork of react-scripts with simple babel/webpack modifications that can toggle extra features and using flags like --scripts version on the cli?Again it will not eject the whole app.
) . I'am making a demo app for this which is also a react-app generator implementing this approach, may be mentors may get a clarity after seeing it implemented.