catreact-client
This module is the Catavolt React HTML Client
To contribute to development of this module
- clone this repo git clone git@git.catavolt.com:javascript/catavolt-client.git
Alternatively, to use this module in your project
- npm install --save catreact-client
Building the code (for contributors)
-
Install Typescript (or an ide with Typescript support). WebStorm is recommended as an ide, as it has very good Typescript support
-
Install Node.js (5+ recommended) directly or use nvm to easily manage installations
-
From this project's root directory (catreact-client), run 'npm install'. This should install all required packages to the 'node_modules' directory in 'catreact-client', including the catavolt library dependencies.
Configuring WebStorm for Typescript:
- Open the catreact-client project root folder in WebStorm
- Go to WebStorm -> Preferences -> Languages and Frameworks -> Javascript
- Set the Language Level to JSX Harmony
- Go to WebStorm -> Preferences -> Languages and Frameworks -> TypeScript panel
- Choose 'Enable TypeScript Compiler'
- Make sure the path to the Node interpreter is correct
- Choose 'Use tsconfig.json' radio option
- Click 'Apply' and 'Ok'
- Open the TypeScript Compiler panel at the bottom of WebStorm and Choose 'Compile All' from the buttons on the left
To build the web bundle in catavolt-client
-
From the root directory run 'npm start'
-
This will run babel (ES6 transpiler) and a 'web formatter' on the javascript generated by your typescript files. This will generate a single 'bundle' file that can be included on webpages. To see an example of this check the 'npm start' script in the package.json file. This script uses 'watchify' with a babel plugin to acheive both transformations.
To run the client
- Open the index.html in the 'web' directory (or 'launch' it from your ide)