The best 'hello world' you've ever seen

[Rich-Harris]

The page you're greeted with when you first do npm run dev -- --open on your first npm init svelte project should serve several purposes:

• it should look slick and beautiful and give you confidence that this is a well-built product crafted by people who care about well-designed user and developer experiences
• it should give you very clear 'what now?' instructions, like 'edit src/routes/index.svelte' and 'visit https://svelte.dev to learn how to build Svelte apps'
• it should give you some idea about the project structure (e.g. it could have an additional route, because otherwise you're left asking 'why is my App.svelte now called src/routes/index.svelte?')
• it should demonstrate interactivity, rather than just being something you could have done with static HTML
• it should elicit joy and delight, the way GREAT SUCCESS did, except without a) getting people riled up or b) being something that grates after a while
• it should make other framework authors jealous

At the same time, if you're experienced with SvelteKit, it should be very quick and easy to remove the starter files to get started with your own stuff, so there shouldn't be too many routes/components/static assets.

[antony]

I think in terms of a "slick" experience that incites jealousy:

• An SVG draw animation for the Svelte logo (demoing easing/transitions/svg)
• Dark/Light mode switch (demoing a component file/css variables/reactivity)
• Data fetching example
• A pure SSG page
• robots.txt / sitemap.xml (demoing serving of such files from "server routes")

I do find it (very slightly) annoying deleting the blog + pages + nav when I make a Sapper bug repro or similar, so perhaps a cli flag to create the demo project without the "skeleton app" files for people who have done this before.

[Jayphen]

A flag to spit out just a skeleton directory structure would be great. A --template flag would be even better. Another option may be a CLI command that cleanly removes any cruft.

[dummdidumm]

A flag to spit out just a skeleton directory structure would be great. A --template flag would be even better. Another option may be a CLI command that cleanly removes any cruft.

Since we have create-svelte, I think it should be part of that setup wizard. The first question could be something like "Scaffold example app?".

[vedam]

A template corresponding to the new Renderings. #244
Again figma svelte-template.
As of now and as said above it's a bit hard for me to guess how much boilerplate you'll want to deliver.
So I decided to move on with what I know so far ;-)

[rafaelcamaram]

@Rich-Harris Are you still considering this issue from Dec 2020 in the current roadmap? If it's the case, I would love to help 🙂

[Rich-Harris]

Closing this now that we have https://netlify.demo.svelte.dev (the todos app is a little wonky due to a problem with the API, but there's a separate issue to look into that sveltejs/api.svelte.dev#8)