Layout

Svelte

All the templating is done in "disappearing" JS component framework called Svelte. Svelte offers a simplified syntax and creates a welcoming developer experience for folks coming directly from an HTML/CSS background. It also offers some performance benefits over similar frameworks since it doesn't require a virtual dom and its runtime is rather small. 

layout/global/html.svelte

The layout/global/html.svelte file is important and changing its name will break your app. You could also potentially break your routing if you're not careful with <svelte:component this={route} {...node.fields} {allNodes} />. Once you're aware of those two things, this file shouldn't be too scary and is meant for you to customize. 

layout/content/

Files that live in this folder correspond directly to the Types defined in your content source. For example if you have blog Type (content/blog/post-whatever.json) you would create a corresponding template at layout/content/blog.svelte. One template should be used per Type and it will feed many content files to create individual nodes (endpoints). 

The rest of the structure is really up to you. We try to create logical default folders, such as layout/components/ for reusable widgets and layout/scripts/ for helper functions, but feel free to completely change these and make the structure your own.