@celerik/ionic-react-boilerplate provides a code baseline for creating hybrid mobile applications based on Ionic React framework using Capacitor as it's default core, the set of tools included on this project defines a group of rules, linter conventions and a default tool for creating new components.
- Sass and Scss support
- TypeScript support
- Storybook for components, docs here
- WebStorm/PhpStorm support
- Eslint + Prettier Rules
- NodeJs >= 14.x
- A javascript package manager such as Npm or Yarn (Yarn preferred)
- Download this template here
- Extract it and rename the folder with your project's name
- Modify package.json to match your app name
cd "folder name"
yarn install
ionic serve
In order to standardize components creating generate-react-cli.json contains the information to create Components, Pages and Layouts and their associates
- Creating a component:
npx generate-react-cli component ComponentName
- Creating a page or a layout:
npx generate-react-cli component PageName --type=page
npx generate-react-cli component LayoutName --type=layout
these commands will create the new component in a sub-folder located inside these folders depending on the type:
- ./src/components
- ./src/pages
- ./src/layouts
The root folder can also be manually specified by using --path parameter
npx generate-react-cli component PageName --type=page --path=src/pages/some-inner-folder
npx generate-react-cli component LayoutName --type=layout --path=src/layouts/some-inner-folder
The output will be inside "./src/pages/some-inner-folder/PageName/" for the first case
To add iOS or Android folder you simply have to execute the command
- npx cap add "platform":
npx cap add ios
npx cap add android
- Check out tutorials on Celerik's blog here.
@celerik/ionic-react-boilerplate is licensed under the MIT license.
TODO: Check out the contributing guide here.