directory structure
This is where you place your code relative to the website root.
standard structure
app/
assets/ # Built CSS, images, and fonts
components/ # Cake20 View components
composables/ # Optional function-composition state
middleware/ # Client Route Hook: *.hook.ts
layouts/ # common layout
lib/ # Browser-specific library/function module
pages/ # page
preview/ # Design Preview sample JSON
stores/ # Global UI state
types/ # UI-only automatic import type
utils/ # UI-only automatic import function
public/ # Static files released as is
privacy-policy.html # Basic English privacy policy document
social.jpg # Optional link sharing featured image
terms-of-service.html # English website terms and conditions basic document
robots.txt # Search engine access rules
sitemap.xml # Search engine page list
server/
api/ # /api path
routes/ # *.ws.ts, *.sse.ts, hello.ts
hooks/ # HTTP Hook: *.hook.ts
db/ # DB model·sql·seed
tasks/ # Background tasks: *.task.ts, *.job.ts
types/ # Server-only automatic import type
utils/ # Server-only automatic import function
shared/
types/ # common type
utils/ # common functions
package.json # Website settings and dependencies
tsconfig.json # TypeScript and editor settings
build/ # Cake20 creation, no editingmanagement area
.cake, .git, build, node_modules, tmp, data, and files are Cake20 system areas and are not exposed in the editor or MCP file tools. package.json, tsconfig.json, and app/index.html remain visible.
package.json is editable and is the single source of website settings and dependencies. Standard files marked as fixed can be edited but cannot be renamed, moved, or deleted.
Select the target folder in the file list and right-click to select multiple local files or You can upload folders at once.
Static resources that exceed the MCP file tool's 2MB per file limit are removed from the editor. Use upload locally. The contents of uploaded large files are stored in MCP. Since it cannot be read or replaced, it is recommended to determine the final path and name first.
Cake20 common folders and standard web files can edit their contents, but It cannot be renamed, moved or deleted. Example file and user Items you add can be moved or deleted freely.
The app's immediate folders are assets, components, composables, middleware, layouts, lib, pages, preview, stores, types, utils, servers include api, db, hooks, routes, tasks, types, utils, shared become types, utils It is fixed. You cannot create files or other folders directly under the three root, Within permitted folders, feel free to create subfolders of any depth you need.
Place browser-specific libraries and function modules, such as Phaser, in app/lib. Import it explicitly in your page or component. ~/ in screen code app top level, refers to the server top level in server code. for example Used like ~/lib/browser, only shared is automatically imported without a path.
The default template is a small template used in actual screens or APIs in each standard folder. Provides an example. Selected folders and examples not used on regular websites The file can be deleted along with its caller.
In the file tree, you can see user-created folders, not standard folders, and Files that do not meet the name/extension rules are displayed in dark. choose or When you hover over it, it appears at normal brightness and you can still use the editing functions.
Search file contents
- Search file contents under FILES or ⌘⇧F on macOS or ⌘⇧F on Windows/Linux. Open the search box with Ctrl+Shift+F.
- Case sensitivity, word unit, regular expressions and file extensions such as tsx, ts, css You can use filters together.
- The results display the lines, columns and surrounding contents for each file, and when selected, the corresponding file and Go to location. The Clear Search button resets both input and results.
- Search for text sources that appear in FILES and are 2 MB or smaller. system hidden It excludes paths, images and binaries, and also reflects changes made to open files before saving them.
- Up to 300 search results are displayed.