sveltekit-motoko-starter Svelte Themes

Sveltekit Motoko Starter

Get started with a high level programming language designed specifically for the Internet Computer

Sveltekit Motoko Starter

Welcome to your new Sveltekit Motoko Starter project and to the Internet Computer development community. By default, creating a new project adds this README and some template files to your project directory. You can edit these template files to customize your project and to include your own code to speed up the development cycle.

To get started, you might want to explore the project directory structure and the default configuration file. Working with this project in your development environment will not affect any production deployment or identity project.

To learn more before you start working with Sveltekit Motoko Starter, see the following documentation available online:

If you want to start working on your project right away, you might want to try the following commands:

cd sveltekit-motoko-starter/

# DFX
dfx  help
dfx  canister  --help

Running the project locally

If you want to test your project locally, you can use the following commands:

# Starts the replica, running in the background
dfx  start  --clean --background

# Sveltekit Static site generation https://kit.svelte.dev/docs/adapter-static
pnpm build

# Deploys your canisters to the replica and generates your candid interface
dfx  deploy

Once the job completes, your application will be available at http://{asset_canister_id}.localhost:4943

If you have made changes to your backend canister, you can generate a new candid interface with

dfx generate

at any time. This is recommended before starting the frontend development server, and will be run automatically any time you run dfx deploy.

If you are making frontend changes, you can start a development server with

pnpm dev

Which will start a server at http://localhost:8080, proxying API requests to the replica at port 4943.

Note on frontend environment variables

If you are hosting frontend code somewhere without using DFX, you may need to make one of the following adjustments to ensure your project does not fetch the root key in production:

  • setDFX_NETWORK to ic if you are using Webpack

  • use your own preferred method to replace process.env.DFX_NETWORK in the autogenerated declarations

  • Setting canisters -> {asset_canister_id} -> declarations -> env_override to a string in dfx.json will replace process.env.DFX_NETWORK with the string in the autogenerated declarations

  • Write your own createActor constructor

Top categories

svelte logo

Need a Svelte website built?

Hire a professional Svelte developer today.
Loading Svelte Themes