New Plasmic codebase (CLI)
In this tutorial, we’ll use
create-plasmic-app to create a new Plasmic-powered website.
create-plasmic-app is our CLI tool for generating fresh Plasmic codebases.
Currently, Next.js, Gatsby, and Create React App are supported. For other frameworks, see our general quickstart page.
To create a project, run:
npx create-plasmic-app@latest# oryarn create plasmic-appcd <your-new-app-name>
We’ll want a local development server for tight iteration loops.
Let’s start your dev server (make sure you’ve run
cd into your new directory).
npm run dev# oryarn dev
Your dev server will be running at
http://localhost:3000 by default.
Sync updated Plasmic designs
Plasmic is powerful, not because of a one-time export of your design to code, but because Plasmic designs are your source-of-truth that go to production. Your new codebase comes with tools to automatically sync updates from Plasmic Studio.
As part of the dev server, the Plasmic loader plugin will automatically watch for and sync your Plasmic components into your dev environment. This usually happens in the background so you don’t have to worry about it.
Try making some changes in your Plasmic project, and see them show up on your dev server!
Thank you for checking out Plasmic! Here are some recommended next steps:
- Try deploying your new website! Read our documentation about deployments.
- If you’re using the Headless API (Loader), check out framework-specific instructions for Next.js, Gatsby, and Plain React.
- If you’re using Codegen, check out getting started with codegen.
- To learn how to use Plasmic Studio, play Plasmic Levels.
- To interactively explore the API of your generated components, click on the “Code” toolbar button in the project in Plasmic Studio.
- Join our Slack community.