• Stars
    star
    180
  • Rank 213,097 (Top 5 %)
  • Language
    CSS
  • License
    MIT License
  • Created over 5 years ago
  • Updated almost 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Markdown-based Blog Built with Sapper

sapper-blog-template

A starter template for building markdown-powered blogs with Sapper and Svelte.

πŸ‘‰ Demo

✨ Getting started

npx degit Charca/sapper-blog-template my-blog
cd my-blog
npm install # or yarn!
npm run dev

Open up localhost:3000 and start clicking around.

Consult sapper.svelte.dev for help getting started.

πŸ— Structure

The base structure of this template is the same as Sapper's default template. These are some of the new things you'll find here:

src/routes/blog

This is the home of your blog. The most important files in here are:

  • _posts.js: this module contains the logic for loading and parsing your markdown posts.
  • [slug].svelte: this is the template of your blog post page.
  • index.svelte: this is the template of your article list page.

src/routes/blog/posts

This is where your markdown posts live in. All .md files in this directory are treated as blog posts and parsed automatically by the _posts.js module.

  • The markdown file name becomes the post slug. For example hello-world.md becomes http://localhost:3000/blog/hello-world.
  • Everything between the start of the post and the <!-- more --> tag becomes the article's "excerpt".
  • Frontmatter properties supported are title and date.

πŸš€ Deploy

Deploy to Netlify

πŸ› Bugs and feedback

Sapper is in early development, and may have the odd rough edge here and there. Please be vocal over on the Sapper issue tracker.

More Repositories

1

bootbot

Facebook Messenger Bot Framework for Node.js
JavaScript
974
star
2

astro-blog-template

Personal Blog Template Powered by Astro
Astro
336
star
3

view-transitions-live

View Transitions API Demo
Astro
276
star
4

astro-movies

Movie DB App built with Astro
Astro
238
star
5

cloudflare-pages-auth

Basic Authentication for Cloudflare Pages
TypeScript
228
star
6

astro-records

Astro SPA Demo
TypeScript
205
star
7

reactjs-conf-2016

React.js Conf 2016 React Native App
JavaScript
133
star
8

astro-photo-gallery

Astro + View Transitions Photo Gallery Demo
TypeScript
99
star
9

astro-3d-view-transitions

Astro + View Transitions + React Three Fiber Demo
Astro
79
star
10

astro-view-transitions

Demo of Astro MPA using the View Transitions API
CSS
67
star
11

astro-music

Demo ssing Astro and the Shared Element Transition API
Astro
38
star
12

frontend-architecture-workshop

Resources and Exercises for the Fundamentals of Frontend Architecture Workshop
31
star
13

astro-blog-view-transitions

Astro Blog + View Transitions Demo
Astro
15
star
14

astro-view-transitions-grid

Astro 3.0 + View Transitions Demo
Astro
13
star
15

astro-remove-bg

AI Background Removal app built with Astro + Replicate
Astro
13
star
16

svelte-match3

Match 3 game with Svelte
Svelte
12
star
17

react-lab

React and Flux Training
12
star
18

gulp-arialinter

Gulp plugin for the accessibility tool AriaLinter
JavaScript
9
star
19

fake-stripe

Very raw prototype of a Docs Site with features inspired by Stripe Docs, powered by Astro and Starlight
Astro
8
star
20

gulp-backbone

Boilerplate for Gulp + Backbone.js apps
JavaScript
7
star
21

pokenum

Guess the PokΓ©mon Game for Facebook Messenger
JavaScript
7
star
22

astro-stable-diffusion

Demo of Astro + Stable Difussion using a Replicate API
Astro
7
star
23

bootbot-cli

BootBot CLI
JavaScript
7
star
24

open-prode

Prode Futbol Argentino built with Flux + React
JavaScript
5
star
25

web-dev-challenge-app

Food Challenge App
TypeScript
5
star
26

dom-depth

Dom Depth Test Page
TypeScript
4
star
27

fullsnack

Demo App for Fundamentals of Frontend Architecture Course
TypeScript
4
star
28

netlify-functions-example

HTML
2
star
29

pacamara-astro

Clone of pacamara-astro template
Astro
2
star
30

sveltekit-wordle

Wordle Clone Built with SvelteKit
TypeScript
1
star
31

react-flux-starter

Simple starter kit for webapps using React + Flux
JavaScript
1
star
32

laravel-starter

Laravel + React + Tailwind CSS Starter
PHP
1
star
33

flux

Example app using Flux + React
JavaScript
1
star
34

bookbone

A Backbone + Marionette SPA to find awesome books
JavaScript
1
star
35

svelte-beerjs

Deck and demos of Svelte BeerJS CBA Talk
JavaScript
1
star
36

charca.dev

Home of https://charca.dev
CSS
1
star
37

nextjs-netlify

JavaScript
1
star
38

talks

Decks and demos for talks I've given.
JavaScript
1
star
39

twimeline-reapp

Twitter client made with Reapp
1
star
40

astroship

Astroship Clone
Astro
1
star