Gulpfile: JSX to JS

The JSX section in the Gulpfile is delimited by a BEGIN REACT and END APP:JS and consists of 10 tasks. Lets begin by understanding the flow of each task. While describing the following tasks we assume the project name to be app.

Tasks Flow
Task 1 (react:react), Task 2 (uglify:react) and Task 3 (clean:react)

The first task compiles the React core library (react.js). The second task minifies the core library (react.min.js) and finally the third task cleans up any temporary files that were created during this process. All output is written to public/js/common/react

The first and third task is run only on startup. The second task is run only when a --production flag is passed to gulp command.

Task 4 (react:react-l20n) and Task 5 (uglify:react-l20n)

The fourth task is run once during startup and everytime there is a change to respective files. These files should not be modified as any modification might conflict with future updates. It compiles L20n react bindings (react-l20n.js). The fifth task is run only when a --production flag is passed to gulp command. It minifies the compiled file from previous task (react-l20n.min.js). All output is written to public/js/common/react-l20n

Task 6 (react:react-bootstrap) and Task 7 (uglify:react-bootstrap)

The sixth task is run once during startup and everytime there is a change to respective files. These files should not be modified as any modification might conflict with future updates. It compiles Bootstrap react bindings (react-bootstrap.js). The seventh task is run only when a --production flag is passed to gulp command. It minifies the compiled file from previous task (react-bootstrap.min.js). All output is written to public/js/common/react-bootstrap

Task 8 (react:app), Task 9 (react:concat) and Task 10 (uglify:app)

The eighth and ninth tasks look for changes to src/jsx/app directory and compiles the JSX files to JS (app.js). NOTE: The starting point of your project is located at src/jsx/app/main.jsx (assuming app is your project name). All output is written to public/js/app

The final task is run only when a --production flag is passed to gulp command. It minifies the compiled file from previous task (app.min.js). All output is written to public/js/app