Overview:
The author of this content was dissatisfied with existing tutorials and tools for setting up a Cordova Create React App project. They decided to create a tutorial to help others set up their initial project and provide insight for migrating existing web apps to Cordova. The tutorial is specifically designed for Cordova 8, but it should work with other versions as well.
Features:
- Create React App CLI installation
- Cordova CLI installation
- Editing the Webpack configuration
- Modifying the package.json file
- Creating a Cordova project and copying config files
- Modifying the index.js file
- Building the output to the www directory
- Targeting platforms and installing SDKs
- Testing the app on emulators and connected devices
- Recommended plugins, such as Firebase OAuth Authentication
Installation:
- Install the Create React App CLI by running
npm install -g create-react-app. - Install the Cordova CLI by running
npm install -g cordova. - Create the project by running
create-react-app tutorial. - Go to your Create React App project directory and run
yarn run eject. - Modify the
config/paths.jsfile by changingappBuild: resolveApp('build')toappBuild: resolveApp('www'). - Add
"homepage": "./"to yourpackage.jsonfile. - Create a Cordova project by running
cordova create tutorial com.example.tutorial Tutorial. - Copy the
config.xmlfile from your Cordova project to your Create React App project. - Modify the
index.jsfile to match the provided code. - Add
<script type="text/javascript" src="cordova.js"></script>toindex.html. - Build the output to the
wwwdirectory by runningyarn run build. - Install SDKs for each platform you wish to target.
- Test the app on emulators by running
cordova emulate androidorcordova emulate ios. - Alternatively, test on a connected device by running
cordova run androidorcordova run ios.
Summary:
This product analysis discusses a tutorial for setting up a Cordova Create React App project. The tutorial provides step-by-step instructions for installation, configuration, and testing on both emulators and connected devices. It also suggests recommended plugins, such as Firebase OAuth Authentication. The tutorial is designed for Cordova 8 but is expected to work with other versions as well. Overall, it aims to help users set up their initial Cordova projects and migrate existing web apps to Cordova.