Basic structure with partials

help
1

I don’t understanding of how to structure an app with partials, you know header, footer, and so on. It seems that a very basic and major thing is missing in the tutorials I’ve seen. Or is it just me?

2

Here are a few pointers, and if you’ll need more I’ll write it up more specifically. Basically what you need to look for is:

  • <template name="footer"> will create a “partial” (if you insist on calling it that; around Meteor I believe we don’t, it’s just another template that can be called/included anywhere)
  • use it anywhere in another template as {{>footer}}
  • if you want something like a general layout that is included for every page and uses partials like footer, header etc:
    • use the iron:router package, look for layoutTemplate in their docs and use it accordingly (basically Router.configure({layoutTemplate:'layout'})
    • define a <template name="layout">, put {{>header}}, {{>footer}} etc where you need them, add a {{>yield}} where you need your page-specific content to go

Now you should be good! If you need the partials to be dynamic (at least sometimes), check out iron:routers regions.

3

Thanks. What about structure inside the body; wrapper, content, sidebar, and so on? Do I use one single html file for the structure and the rest are templates? How does Meteor knows what to load and where?

4

There is no layout feature in Meteor core. But there are community packages:

5

Meteor basically doesn’t care about files and file names, for templates it only cares for <template name="XXX"> tags, and you can put them wherever in .html files – 100 templates inside a single file, 1 template per file, or any combination. It simply does not care.

If you want to know what’s currently considered good practice (or one of them):
If you have a very small app you can just put all templates in a single .html file.
As the app grows you’ll want to spread things out, like create a client/templates folder and put each template inside its own XXX.html folder with XXX being the template name.

What Meteor core does is only what you tell it. Without a package such as iron:router Meteor just looks for the first body tag it can find outside of a template definition and renders its content. If it has a call to another template it’ll naturally execute that/include that template as well, but otherwise it won’t.
Now, if you’re using a router package such as iron:router then you’ll define through means of router configuration which templates will get rendered for which URLs etc. Meteor will still render anything it finds in the first body tag outside a template definition and output that first and then afterwards whatever the router is supposed to render & output.

1 Like