Sapper Markdown Site with Svelte v3 (Netlify + Root Directory Version)

Intro

This modified Sapper template uses Markdown for posts and Svelte 3.

Visit https://kokodokai.com/ to see it in action, building with Netlify configured with a netlify.toml.

To clone it and get started:

git clone https://github.com/rdela/kokodokai.git
cd kokodokai
npm install # or yarn
npm run dev # or yarn dev

Open up localhost:3000 and start clicking around.

Page Transitions

Added fade in/out page transitions after getting annoyed at some jitter when navigating between routes and then feeling inspired revisiting pngwn's svelte-travel-transitions repo/demo based on Sarah Drasner's page-transitions-travelapp.

See src/components/TransitionFadeInOut.svelte and these routes:

• src/routes/index.svelte
• src/routes/about.svelte
• src/routes/[slug].svelte
• src/routes/_error.svelte

To learn more about Svelte transitions visit the Transitions section of the Svelte tutorial.

Feeds

Now with 100% 200% MOAR FEED

That's right ppl, RSS plus JSON Feed. Check out src/routes/rss.xml.js and src/routes/feed.json.js. RSS Modeled after the svelte.dev feed, @brentsimmons' RSS + JSON Feed structure on Inessential, and @gruber's RSS + JSON Feed on Daring Fireball.

GitLab Pages Version

For the GitLab pages version, visit the demo or clone the repo:

git clone https://gitlab.com/rdela/sapper-v3.git
cd sapper-v3
npm install # or yarn
npm run dev # or yarn dev

Open up localhost:3000/sapper-v3 and start clicking around.

Sources

Cobbled together by borrowing liberally from pngwn/sapper-v3 and sveltejs/sapper-template early on. For a non-markdown version of the official template, follow the Using degit for Rollup instructions:

npx degit "sveltejs/sapper-template#rollup" my-app
cd my-app
npm install # or yarn
npm run dev