Load different template on specific route only

[dqvsra]

Hi everyone,
I’m just planning my next big project. And i’m a little bit confusing how can i make multi-react-application where i can render each app separately and serve specific content only on concrete route without loading everything else. For example:

import App from './app/App.js’
import Site from './app/site/Site.js’
import Admin from './app/admin/Admin.js’
import Screen from './app/screen/Screen.js’
import Entrance from './app/entrance/Entrance.js’
import Dashboard from ‘./app/dashboard/Dashboard.js’

export const Routes = () => (
Router history = { browserHistory } component = { App }>
Route path="/" component = { Site }>
Route path="/admin" component = { Admin }/>
Route path="/screen" component = { Screen }/>
Route path="/entrance" component = { Entrance }/>
Route path="/dashboard" component = { Dashboard }/>
/Router>
);

I would like to make each of this items as a separate React applications (maybe with shared resources and some components). But bundle it as one Meteor build, with the same db and Meteor.server methods.
Is it possible at all for React or Blaze?

[dqvsra]

It’s looks like nobody care about my request.
Hey people, Alo!

[giova.panasiti]

m just planning my next big project. And i’m a little bit confusing how can i make multi-react-application where i can render each app separately and serve specific content only on concrete route without loading everything else. For example:

I think I’m not understanding your request. What’s the point in having “two different react app?” You can just use nested routes to have multiple layers.

The root component will always be the one where you set your router and then you can nest as much as you want.

<Router history={browserHistory}>
        <Route path="/app" component={App}>
            <IndexRoute component={Dashboard} />
            <Route path="/admin" component={Admin}>
              <Route path="/admin/:userId" component={NotesEdit}></Route>
            </Route> 
            <Route path="/projects" component={ProjectsList}>
              <Route path="/project/:projectId" component={SingleProject}></Route>
            </Route> 
        </Route>
        <Route path="/" component={Site}>
            <IndexRoute component={Site} />
            <Route path="/register" component={Register}></Route>
            <Route path="/signin" component={Signin}></Route>
            <Route path="/signout" component={Signout}></Route>
        </Route>
    </Router>

This one could work as an example tell me if I didn’t get the question

[dqvsra]

First, thanks for reply.

The main question was about don’t loading resources that not needed for one page, and load only needed for specific route (app). Is it possible?
For example, for entrance route i don’t need all the fancy css and js code that needed for dashboard. So how can i avoid loading this resource?

[vigorwebsolutions]

Looks like you’re talking about code splitting, which isn’t available out of the box with Meteor, although there is some experimental stuff here:

Experimental Code Splitting

I made a little (and hacky) package that implements basic code splitting for @benjamn’s proposed syntax with async functions and nested imports (see this issue and this explanation). GitHub repo: How it works: If you want a module to be loaded on demand and not when the page is loaded, you import it inside an async function: async function loadAsync() { import stuff from './module.js'; // Do something with `stuff`… } loadAsync(); The compiler in the package recognizes that ./module.j…

If you are concerned only about the landing page, there is a thread here that discusses that:

Landing Page as part of your Meteor app or on a separate server?

What’s the best way to handle landing pages for Meteor apps? Do you host it on a separate server, with the Meteor app under a subdomain? Or is the landing page a part of the app itself? What are the costs and benefits for either method? For example I’ve noticed that Kadira hosts their app separate from their landing page.

[a.com]

server-side rendering?