Skip to content

kickstartDS/storyblok-starter

Repository files navigation

kickstartDS Storyblok starter

  1. Clone our Starter space by visiting https://app.storyblok.com/#!/build/242426.
  2. Clone energyui-storyblok-starter-Repo by clicking on "Use this template" -> "Create new repository".
  3. Go to Vercel and click on "Add New..." -> "Project". Import your cloned Github Repository. Unfold "Environment Variables" and add the following:
    • NPM_RC with //<your package registry>:_authToken=<your npm token>
    • STORYBLOK_API_TOKEN with a preview token from the cloned Stroyblok Space above.
  4. Click on "Deploy"
  5. Configure your freshly deployt App as the default preview URL in Storyblok ("Settings" -> "Visual Editor"). Type in the base URL of your deployment and add /preview/ as the path, e.g. https://energyui-storyblok-starter.vercel.app/preview/.

See "Local Development"-Section below for the necessary steps to start developing locally with rapid feedback cycles.

You can use this button to deploy the EnergyUI@Storyblok starter repo on Vercel. Feel free to change the repository URL for quicker deployment of the clone repository:

Deploy your own

Deploy with Vercel Deploy to Netlify

Local Development

Dependencies

  • mkcert
  • npm (unless you opt for devcontainer)

Setup

Locally

  1. Copy .env.local.sample to .env.local. Replace all placeholders with your specific configuration and adapt to your needs.
  2. If your design system npm package is published on a protected registry, please configure the auth token in your ~/.npmrc.
  3. Run a Next.js server process locally:
    1. npm i
    2. npm run dev
  4. Setup a local proxy server for ssl: (in a new terminal)
    1. mkcert localhost
    2. npx local-ssl-proxy --source 3010 --target 3000 --cert localhost.pem --key localhost-key.pem
  5. In storyblok change the preview URL to "Dev".
  6. Run storyblok login for being able to use the storyblok-cli.

Working with the content schema

Typescript Support

Generate ts types according to the content schema by running NEXT_STORYBLOK_SPACE_ID=<your-space-id> npm run generate-content-types.

Migrations

When changing the content schema we recommend sticking to Storyblok's Best Practices.

Contributing

Contributions are welcome. Unless you explicitly state otherwise, any contribution intentionally submitted for inclusion in the work by you, as defined in the Apache-2.0 license, shall be dual licensed as below, without any additional terms or conditions.

License

This project is licensed under either of

at your option.

The SPDX license identifier for this project is MIT OR Apache-2.0.


For more information and updates, please visit the project's GitHub repository.

Support

Join our Discord community for support, or leave an issue on this repository!