Skip to content

Add onboarding documentation for new developers#27

Open
iamalexndr wants to merge 2 commits intokoldovsky:mainfrom
iamalexndr:main
Open

Add onboarding documentation for new developers#27
iamalexndr wants to merge 2 commits intokoldovsky:mainfrom
iamalexndr:main

Conversation

@iamalexndr
Copy link
Copy Markdown

@iamalexndr iamalexndr commented Mar 26, 2026

Adds a developer onboarding guide covering project overview, tech stack,
monorepo architecture, key files, conventions, and a step-by-step first
steps section to help new contributors get up and running quickly

Summary by CodeRabbit

  • Documentation
    • Added a comprehensive onboarding guide with development setup instructions, architectural overview, coding conventions, recommended development commands, key files reference, and CI requirements to help new contributors understand the project structure.

@coderabbitai
Copy link
Copy Markdown

coderabbitai bot commented Mar 26, 2026

📝 Walkthrough

Walkthrough

Added a comprehensive ONBOARDING.md document that outlines Excalidraw's purpose, technology stack, monorepo architecture, core concepts (state management with Jotai, two-layer rendering, immutable elements), development setup instructions, key file references, coding conventions, and CI requirements.

Changes

Cohort / File(s) Summary
Documentation
ONBOARDING.md
New onboarding guide covering tech stack, architecture patterns (state management via Jotai, rendering layers, element versioning), development setup with Node/Yarn, recommended commands, key file references, coding conventions (imports, immutability, naming), and CI checks.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~5 minutes

Poem

🐰 A guide now written, clear and bright,
For newcomers to code right!
From setup steps to architecture true,
This path illuminates what's new.

🚥 Pre-merge checks | ✅ 3
✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title 'Add onboarding documentation for new developers' directly and accurately summarizes the main change—a new ONBOARDING.md file providing comprehensive developer guidance.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Copy Markdown

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🧹 Nitpick comments (2)
ONBOARDING.md (2)

32-47: Add language specifications to fenced code blocks.

The directory tree (lines 32-47) and dependency chain diagram (lines 53-60) should specify a language for better rendering and to satisfy markdown linters. Use text for these ASCII-art style diagrams.

📝 Proposed fix for code block language specifications

For the directory tree at line 32:

-```
+```text
 excalidraw/
 ├── packages/

For the dependency chain at line 53:

-```
+```text
 `@excalidraw/excalidraw`        ← main library, depends on everything below
   ├── `@excalidraw/common`      ← foundational constants and utilities

Also applies to: 53-60

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@ONBOARDING.md` around lines 32 - 47, The fenced ASCII diagrams for the
directory tree and dependency chain in the ONBOARDING.md file lack language
tags; update those fenced code blocks (the excalidraw/ directory tree block and
the `@excalidraw` dependency chain block) to use the "text" language specifier
(i.e., change ``` to ```text) so markdown renderers and linters recognize them
as plain text diagrams.

100-106: Add language specification to the data flow diagram.

The data flow diagram should specify a language for the code fence. Use text for this type of ASCII diagram.

📝 Proposed fix
-```
+```text
 User interaction (click, keypress, drag)
   → Action handler  (packages/excalidraw/actions/)
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@ONBOARDING.md` around lines 100 - 106, The fenced ASCII diagram block in
ONBOARDING.md lacks a language tag; update the markdown code fence that contains
the data flow diagram (the block starting with "User interaction (click,
keypress, drag)") to use a language specifier `text` (i.e., change the opening
``` to ```text) so the diagram is explicitly marked as plain text.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@ONBOARDING.md`:
- Around line 68-72: ONBOARDING.md contains relative links that are broken in
this repository; update the doc so every reference to the Excalidraw codebase
uses absolute GitHub URLs (e.g.,
https://github.com/excalidraw/excalidraw/blob/main/...) instead of relative
paths, or move ONBOARDING.md into the Excalidraw repository so the existing
relative paths resolve; specifically search the file for all occurrences of
packages/excalidraw/* and excalidraw-app/* (and referenced filenames like
types.ts, editor-jotai.ts, App.tsx) and replace each with the corresponding
absolute GitHub blob URL (or relocate the file) ensuring links point to the main
branch.

---

Nitpick comments:
In `@ONBOARDING.md`:
- Around line 32-47: The fenced ASCII diagrams for the directory tree and
dependency chain in the ONBOARDING.md file lack language tags; update those
fenced code blocks (the excalidraw/ directory tree block and the `@excalidraw`
dependency chain block) to use the "text" language specifier (i.e., change ```
to ```text) so markdown renderers and linters recognize them as plain text
diagrams.
- Around line 100-106: The fenced ASCII diagram block in ONBOARDING.md lacks a
language tag; update the markdown code fence that contains the data flow diagram
(the block starting with "User interaction (click, keypress, drag)") to use a
language specifier `text` (i.e., change the opening ``` to ```text) so the
diagram is explicitly marked as plain text.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 379579d9-ceb9-4e9d-9490-91a11133347e

📥 Commits

Reviewing files that changed from the base of the PR and between be47f1d and bf624ed.

📒 Files selected for processing (1)
  • ONBOARDING.md

Comment on lines +68 to +72
The editor's entire runtime state — the active tool, zoom level, pan offset, selected elements, current stroke color, whether the grid is on, and dozens of other properties — lives in a single `AppState` object defined in [packages/excalidraw/types.ts](packages/excalidraw/types.ts). This object is exposed as Jotai atoms, not passed through props or stored in a Redux slice.

The two relevant store files are:
- [packages/excalidraw/editor-jotai.ts](packages/excalidraw/editor-jotai.ts) — atoms for the library-level editor state
- [excalidraw-app/app-jotai.ts](excalidraw-app/app-jotai.ts) — atoms for app-specific state like collaboration and theme
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
# Check if the referenced file paths exist in the current repository structure

echo "=== Checking if excalidraw directory structure exists ==="
[ -d "packages/excalidraw" ] && echo "✓ packages/excalidraw exists" || echo "✗ packages/excalidraw NOT found"
[ -d "excalidraw-app" ] && echo "✓ excalidraw-app exists" || echo "✗ excalidraw-app NOT found"

echo -e "\n=== Sampling specific files referenced in the documentation ==="
files=(
  "packages/excalidraw/index.tsx"
  "packages/excalidraw/types.ts"
  "packages/excalidraw/components/App.tsx"
  "packages/excalidraw/editor-jotai.ts"
  "excalidraw-app/App.tsx"
  "packages/element/types.ts"
)

for file in "${files[@]}"; do
  [ -f "$file" ] && echo "$file exists" || echo "$file NOT found"
done

echo -e "\n=== Repository identification ==="
git remote -v 2>/dev/null | head -2 || echo "No git remote found"

Repository: koldovsky/is-01-docs

Length of output: 664


Convert file path references to absolute GitHub URLs or move documentation to Excalidraw repository.

This documentation contains relative file path references throughout (lines 68–72, 78–83, 90–91, 107–108, 152–155, 194–202) that assume the document lives in the Excalidraw repository root. However, it's being added to koldovsky/is-01-docs, a separate repository where none of these paths exist:

  • packages/excalidraw/ — not found
  • excalidraw-app/ — not found
  • All referenced files (types.ts, editor-jotai.ts, App.tsx, etc.) — not found

These links will be broken and unusable. Either:

  1. Convert all relative links to absolute GitHub URLs pointing to the Excalidraw repository (e.g., https://github.com/excalidraw/excalidraw/blob/main/packages/excalidraw/types.ts)
  2. Move this documentation to the Excalidraw repository where relative links will work
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@ONBOARDING.md` around lines 68 - 72, ONBOARDING.md contains relative links
that are broken in this repository; update the doc so every reference to the
Excalidraw codebase uses absolute GitHub URLs (e.g.,
https://github.com/excalidraw/excalidraw/blob/main/...) instead of relative
paths, or move ONBOARDING.md into the Excalidraw repository so the existing
relative paths resolve; specifically search the file for all occurrences of
packages/excalidraw/* and excalidraw-app/* (and referenced filenames like
types.ts, editor-jotai.ts, App.tsx) and replace each with the corresponding
absolute GitHub blob URL (or relocate the file) ensuring links point to the main
branch.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant