Skip to content

Fedeorlandau/contentful-svelte-tailwind

Repository files navigation

Contentful + SvelteKit + Tailwind CSS + GraphQL

Example project using SvelteKit with the Contentful Delivery API along with GraphQL, deployed to Vercel. If you don't want to use GraphQL please refer to the nographql branch which uses Contentful's SDK.

web

Live Example: https://contentful-svelte-tailwind.vercel.app/

Live Example: https://contentful-svelte-tailwind.vercel.app/test

Developing

Env variables

Remember to set up a .env file with your contentful keys

VITE_CONTENTFUL_SPACE_ID=""
VITE_CONTENTFUL_TOKEN=""
VITE_CONTENTFUL_ENVIRONMENT="" // usually "production" or "master"

Once you've created a project and installed dependencies with npm install, start a development server:

npm run dev

# or start the server and open the app in a new browser tab
npm run dev -- --open

Building

This uses the Vercel Adapter for SvelteKit.

npm run build

Content types

This starter kit relies on the following content models.

Page

Page content model

  • Title, short text.
  • Slug, short text
  • Components, References - many.

Hero

Hero content model

  • Title, short text.
  • Description, short text
  • CTA Text, short text
  • CTA Link, short text

Lighthouse score

Lighthouse score

About

Contentful + Svelte + Tailwind + Graphql starter kit

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published