The editor

The sidebar and the editor's pages

Home, My projects, Learn, Parts, Docs and the rest open inside the editor: the sidebar stays put and only the main area changes.

Since 0.5.1 Mokxi is one app. The sidebar down the left of the editor stays on screen on every page, and each row swaps only the main area. Your open project waits behind the pages, and Editor takes you back to it.

The sidebar

From the top:

  • The Mokxi wordmark. Signed in, it opens Home.
  • New project, the button at the top, starts a blank breadboard.
  • Editor goes back to the canvas with the project you had open, from any page.
  • Home, your dashboard (see Home below).
  • My projects: your projects, with Recent, Shared with me and Classes tabs.
  • Import: drop or paste a Wokwi zip or link, a sketch, or a Mokxi file.
  • AI Builder: describe a project and Mokxi AI builds it. See the AI Builder. It shows once Mokxi AI builds for your account.
  • Examples: working projects to open, run and remix.
  • Learn: the courses and your progress. See the Learn page.
  • Classes: join a class with a code, or create and run one.
  • Parts: the parts bin, with search and family chips. A part opens its details, its docs and Add to project.
  • Docs: these articles, searchable, with each article in the main area.

Under them, More from Mokxi holds VS Code, CLI and MCP server, each a setup page with the exact steps to copy. See the MCP server. Your three most recent projects are in the sidebar too, one click away.

At the foot are Customize (see Customize) and Settings, then the card with your usage. Settings shows once you are signed in.

Collapse it to a rail

The panel button in the sidebar collapses it to a narrow rail of icons, each with its name as a tooltip, and expands it again. The editor starts collapsed so the canvas keeps its room. Signed in, your choice is saved to your account and follows you to every device.

On a phone, or any window under 900 pixels wide, the sidebar is a menu: the menu button in the top bar opens it as a drawer. Pick a row, press Escape or tap outside it to close it.

Every page has its own address

Each page has a real address, so Back, Forward and a reload work, and a bookmark or a link opens the same page:

Page Address
Home app.mokxi.com/home
My projects app.mokxi.com/projects
Import app.mokxi.com/import
AI Builder app.mokxi.com/ai-builder
Examples app.mokxi.com/examples
Learn app.mokxi.com/learn
Classes app.mokxi.com/classes
Parts app.mokxi.com/parts
Docs app.mokxi.com/docs
VS Code, CLI, MCP server app.mokxi.com/tools/vscode, /tools/cli, /tools/mcp
Customize app.mokxi.com/customize
Settings app.mokxi.com/settings

A press with Cmd or Ctrl held opens the page in a new tab instead. The old account page addresses still work: /account and its tabs open the matching page here, so a saved link to your projects, your learning or your settings lands in the right place.

Home

Home is a dashboard of your own numbers, never guesses:

  • Today, a slim strip: your projects, your level, your day streak and the Mokxi AI questions you have left today, each shown only once it is known.
  • A greeting and the bar: type to search your projects, parts, boards, docs and examples at once, or press Enter to ask Mokxi AI the sentence. Cmd+K or Ctrl+K puts the cursor in it from anywhere on Home. Where Mokxi AI is off, the bar only searches.
  • Build ideas under the bar, each a build for Mokxi AI in one click.
  • Quick start tiles: New project, Build with Mokxi AI, Import, Open an example and Join a class.
  • Your progress with Next up (your level, streak, next quest and next lesson), and This week's challenge with Start, Check my build and Not now.
  • Continue where you left off: your newest projects, with All projects.
  • What to build next: picks from the parts you already use.

A child's account and a class account get the bar, Next up and their own projects, and none of the challenge or the picks.

Related: the screen, part by part for the canvas itself.