File Structure

By running through the Getting Started process, the framework will create the basic file structure for your application:

Due to its design goal of easy discoverability, Erstwhile is somewhat opinionated about how developers organize their code. The idea is that a new developer should be able to simply jump into a project and be able to figure out where everything is within 15 minutes.

Here is a little more detail of what goes into each of these directories:

• /app/components: Any application-specific custom components go in this directory. A component is identified by its directory name (which, by convention, is CamelCapped and must contain a file called component.js that defines a subclass of ErstwhileComponent.
• /app/config: This directory contains the configuration files. app.js is required, and (if the application defines its models locally) a description.json file could also be present.
• /app/controllers: This directory contains the controllers, each of which is a subclass of ErstwhileController. Also each filename should end with Controller.js.
• /app/models: This directory contains the models.js file, which defines the API calls the application makes to the backend.
• /app/public: This directory contains all of the files that get copied into the document root of the distributable application. Erstwhile typically uses an /assets directory with separate subdirectories for /css, /fonts, /js and /images.
• /app/views: This directory contains all of the views. There is a subdirectory called /layouts for storing the application’s layouts, and subdirectories named after each controller for storing the views related to their actions and modals. Each of these files is a .ejs file and is named in relation to the action or modal they correspond to.
• /app/App.js: This file contains the application itself, a subclass or ErstwhileApp.

Outside of the application, there is also a /themes directory, which houses the themes to be used with the application. Most likely each application uses a single theme but a developer may have other themes in here that they are either developing or which contain similar-enough components that they can be toggled between. The /app/config/app.js file has a theme specified in it that tells the compiler which theme is currently used.

Finally, applications also have /build and /dist directories. /build is used as working space during the compilation process, and /dist contains the running application.