The application generated is setup to use typescript.
While typescript is used to validate your
.ts code, Electrode X actually uses Babel to transpile your code.
Your app consists of these essential top level directories and files:
|Files and Dirs||Description|
|The file that loads Electrode X's development tasks for |
|configuration for browserslist|
|static web assets|
|Directory for your app's source code|
src directory is where your app's code is. The sample app we created for you contains these files:
src/serverare source for your app's node.js server.
There are four SubApps defined in the sample app:
A SubApp is just a React Component that can incorporate extra features Electrode X offer, and will be dynamically imported. You can render a page with multiple SubApps on it, each with its own independent behaviors, such as enabling SSR, or using different data models.
To create a SubApp:
- First create your
.tsxfile, say "hello.tsx", and export a
- Next declare your SubApp in another file, say "app.tsx", and use the
declareSubAppAPI and dynamic import your subapp.
After you create a SubApp, you can render it on a page on the node.js server using the
PageRenderer class API, and then send the result back to the browser.
For example, in
src/server/routes.ts, declare a fastify plugin to register a route that render the page with the
Hello SubApp on it.