Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

React project layout and tools assumptions



  • I have browsed through the React guide, and for someone starting a new Cordova/Onsen UI/React project from a clean slate, does the guide assume that the project is setup in any particular way or following certain convention?

    I have looked through other React tutorials or quick start, and observe several possible variants.

    • Build/packaging system: Some recommend Webpack, others using Browserify and some others using other combinations of preferred tools.
    • Project directory/folder structure: some prefer to put their source files in a different directory other than {project-root}/src.
    • JSX Transpiling: Some recommend doing in-browser transpiling of JSX using Babel for development/testing, while others recommend setting up the project to use Node.js transpiling (done within Webpack or Browserify build/bundling process?) for optimal performance in production mode.

    It seems to me that there is no standard React app project layout we can assume since many things are configurable to an individual developer’s personal preferences.

    It would be good if you can state the assumptions or prerequisites (if any exist) on how the React project is laid out for your guide. Thanks!


  • Onsen UI

    @wetfeet I think there are no assumptions or prerequisites in that guide. You can use react-onsenui as you want, with any tools.

    On the other hand, React + Onsen UI templates provided in Monaca comes with a specific Cordova structure and Webpack configurations. However, you can still use most of the Monaca features even if you make your own building system as long as you have a Cordova structure (i.e. www folder and config.xml file).