a-trost / repeat-ai

https://repeat-ai.vercel.app
27 stars 12 forks source link

Prismic + SvelteKit Minimal Starter

Want to quickly get started building your own project with Prismic and SvelteKit? This project includes basic configurations and nothing else. The project includes one Rich Text Slice, a homepage, and a dynamic page.

 

Starter screenshot

 

🚀 Quick Start

To start a new project using this starter, run the following commands in your terminal:

npx @slicemachine/init@latest --starter sveltekit-starter-prismic-minimal

The commands will do the following:

  1. Start a new SvelteKit project using this starter.
  2. Ask you to log in to Prismic or create an account.
  3. Create a new Prismic content repository with sample content.

When you're ready to start your project, run the following command:

npm run dev

How to use your project

To edit the content of this project, go to prismic.io/dashboard, click on the repository for this website, and start editing.

Create a page

To create a page, click on the green pencil icon, then select Page.

Pages are made of Slices. You can add and rearrange Slices to your pages.

Your new page will be accessible by its URL, but it won't appear on the website automatically. To let users discover it, add it to the navigation.

Customize this website

This website is preconfigured with Prismic. It has three Prismic packages installed:

These packages are already integrated and employed in this app. Take a look at the code to see how they're used.

Edit the code

There are two steps to rendering content from Prismic in your SvelteKit project:

  1. Fetch content from the Prismic API using @prismicio/client.
  2. Template the content using components from @prismicio/svelte.

Here are some of the files in your project that you can edit:

These are important files that you should leave as-is:

Learn more about how to edit your components with Fetch Data in SvelteKit and Template Content in SvelteKit.

Deploy to the web

To put your project online, see Deploy your SvelteKit App.

Edit content models with Slice Machine

This project includes an application called Slice Machine, which generates models for your Custom Types and Slices. Slice Machine stores the models locally in your codebase, so you can save and version them. It also syncs your models to Prismic. To learn how to use Slice Machine, read Model Content in SvelteKit.

If you change or add to your Custom Types, you'll need to update your route handling to match. To learn how to do that, read Define Paths in SvelteKit.

Documentation

For the official Prismic documentation, see Prismic's guide for SvelteKit or the technical references for the installed Prismic packages.

License

Copyright 2013-2023 Prismic <contact@prismic.io> (https://prismic.io)

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.