Moving React classes into separate files

Question

After doing the React tutorial this is my index.html file:

Answer 1

In my opinion ES6 can be a way to write classes and module but not really to manage them. For the purpose of managing modules I would use requirejs, simplest module manager that I know. But maybe other people will advise something else.

IMO you need a module manager and requirejs is a great tool for that.

Update: Basically for requirejs you'll write a main.js file (which is a conf file for require, defining the paths of modules and first thigns to load) In your main html you'll write something like this to load the main.js

Inside your views you'll call the module you need using define('MyModule'...) using the name you previously defined in the main.js (with the path).

Read the doc, don't worry this is not that terrible: http://requirejs.org/docs/start.html#add Here is a simple example: https://github.com/volojs/create-template

The way to break your code is pretty easy you'll return (this how you export a module with define()) your reactclass. Create one file for each class you have. But you can also create module/utils to gather transverse functions (parsing...etc).

Hope it helps!