DocsDevelopmentDev Guide

Web Dev Guide

Before you start developing, the Project Architecture and Web Architecture doc should be read to know codebase design and app design.

Preparation

You should read Dev Workflowfirst and installed Git, Node.js and Yarn. Web development has no other requirements, we can just start development.

Dev Server

We need to install dependencies first, and start the dev server.

yarn install
yarn run dev

When executing the dev command, the follow options should be select to start web development:

  • Distribution: browser

  • Mode: development

  • Channel: canary

  • Enable coverage: No

  • Debug blocksuite locally?: No

p9w4aIik3PhzaHatE6H3MpSQcvxoL7Z9wyS3rfvt0XI=

Coding and Debugging

After webpack built successfully, we can open [http://localhost:3010/](http://localhost:3010/) in the browser to debug the web client. When you change the code in packages/frontend/core, or dependencies codes and the web will reload after the change is saved.

mTPzJXCbdfu_vswwY24GtCgsvVasRGoWCQSWxWrBLTE=

Testing and Building

It is optional to run e2e tests and unit tests and build the core after coding, CI will run them always. But if the code changed affects them, run in the local cloud to find out problems early.

Testing GuideQuick Start