Sapper: Need examples

[shashkovdanil]

Next.js is very popular in part because it contains examples for all occasions. It would be nice to add a collection of examples for Sapper. I would like to rewrite my website from Next to Sapper, but I can't integrate Sapper with graphql apollo.

[bravecow]

🙏 for examples. and dynamic routing, if it is possible (route is handled by database):

| route | template |
| --- | --- |
| /cat | animal.svelte |
| /dog | animal.svelte |
| /cherry | fruit.svelte |
| /apple | fruit.svelte |

So before you show response, you should make a DB request. It is easy handled by react-router, ember routing as *.

[Conduitry]

If you have two types of URLs that can't be distinguished purely by looking at the URLs, they will have to be the same route. This route though could have a preload that checks a database and sets some props accordingly, and then different components (for example, animals or fruit) can be displayed based on that.

[joshleblanc]

@shashkovdanil

See here for an apollo example: https://github.com/HorizonShadow/sapper-apollo-example

Files you're probably interested in are ./src/apollo.js for your apollo-client instance, ./src/routes/graphql.js for your apollo-server instance, and ./src/routes/index.svelte for the actual usage.

I'm not sure I'm doing this all correctly, as I've never used sapper or svelte, but the idea is there.

[danielquintero]

@shashkovdanil

While casually looking for the same solution I came across https://github.com/timhall/svelte-apollo
You can also look into some example in the repo https://github.com/timhall/svelte-apollo/blob/master/example/server.js which shows how to set up the server :)

[joshleblanc]

@danielquintero That looks really nice.

You could put the graphql right into svelte's server, too: https://github.com/HorizonShadow/sapper-apollo-example/blob/master/src/routes/graphql.js

[antony]

Kit contains a series of example applications, so closing this!

[frederikhors]

@antony any ETA on kit?

[antony]

There is no ETA on Kit, no, sorry!