|
| 1 | +# create-jqwidgets-react-app |
| 2 | +Please refer to its documentation: |
| 3 | + - [Getting Started](https://github.com/jqwidgets/create-jqwidgets-react-app/blob/master/README.md#getting-started) |
| 4 | + - [jQWidgets React Documentation](http://www.jqwidgets.com/reactjs-components-documentation/) |
1 | 5 |
|
| 6 | +This project is based on [create-react-app](https://github.com/facebookincubator/create-react-app). |
| 7 | + |
| 8 | +## Quick Overview |
| 9 | +```sh |
| 10 | +npm i -g create-jqwidgets-react-app |
| 11 | + |
| 12 | +create-jqwidgets-react-app my-app |
| 13 | +cd my-app |
| 14 | +npm start |
| 15 | +``` |
| 16 | + |
| 17 | +Then open [http://localhost:3000/](http://localhost:3000/) to see your app.<br> |
| 18 | +When you’re ready to deploy to production, create a minified bundle with `npm run build`. |
| 19 | + |
| 20 | +## Getting Started |
| 21 | + |
| 22 | +### Installation |
| 23 | + |
| 24 | +Install it once globally: |
| 25 | + |
| 26 | +```sh |
| 27 | +npm install -g create-jqwidgets-react-app |
| 28 | +``` |
| 29 | + |
| 30 | +**Make sure you have the latest version of [Node](https://nodejs.org/en/) on your machine**. |
| 31 | + |
| 32 | +### Creating an App |
| 33 | + |
| 34 | +```sh |
| 35 | +create-jqwidgets-react-app my-app |
| 36 | +cd my-app |
| 37 | +``` |
| 38 | + |
| 39 | +It will create a directory called `my-app` inside the current folder.<br> |
| 40 | +Inside that directory, it will generate the initial project structure and install the transitive dependencies: |
| 41 | + |
| 42 | +``` |
| 43 | +my-app |
| 44 | +├── node_modules |
| 45 | +├── public |
| 46 | +├── src |
| 47 | +├── package.json |
| 48 | +├── README.md |
| 49 | +``` |
| 50 | + |
| 51 | +Subfolders are not shown in order to keep it short.<br> |
| 52 | +Once the installation is done, you can run some commands inside the project folder: |
| 53 | + |
| 54 | +### `npm start` |
| 55 | +Builds the app in development mode and starts a web server. <br /> |
| 56 | +Open [http://localhost:3000](http://localhost:3000) to view it in the browser. <br /> |
| 57 | +The page will reload if you make edits. |
| 58 | + |
| 59 | +### `npm run build` |
| 60 | +Builds the app in production mode and stores it in the `build/` directory. |
| 61 | +It correctly bundles React in production mode and optimizes the build for the best performance. |
| 62 | + |
| 63 | +The build is minified and the filenames include the hashes. |
| 64 | +By default, it also includes a service worker so that your app loads from local cache on future visits. |
| 65 | + |
| 66 | +Your app is ready to be deployed. |
| 67 | + |
| 68 | +### Adding other jQWidgets |
| 69 | + |
| 70 | +This project will show you the `React jQWidgets Grid`. But of course you will want to use some other widgets too. <br /> |
| 71 | +For that you need to add their core files first. This is done in the `public` folder. <br /> |
| 72 | + |
| 73 | +## Why Use This? |
| 74 | + |
| 75 | +**If you’re getting started** with `jQWidgets` and `React`, using `create-jqwidgets-react-app` is the easiest way to do this. <br /> |
| 76 | +Just install, run and you will see an React jQWidgets Grid on your page. <br /> |
| 77 | +Then you can customize the project as much as you want, making something great. |
0 commit comments