Fundamental Concepts
Philosophy
You know 4D? You know BWEB.
BWEB is not a framework that requires JavaScript expertise. It is a component purely based on 4D. A 4D developer should be able to create a website without changing worlds.
BWEB targets public portals and CMS with potentially 300,000+ users - not internal dashboards (for that, there is Qodly).
Tailwind can be learned in a day. React takes several months.
Hierarchy: Domain - Page - Block
Everything in BWEB is organized into 3 levels:
| Level | Table | Description | Example |
|---|---|---|---|
| Domain | BSPK_WEB_DOMAIN | A complete website | monsite.fr |
| Page | BSPK_WEB_DOMAIN_MENU | An accessible URL or a reusable component | /suppliers, header, footer |
| Block | BSPK_WEB_CONTENT | A UI element forming a tree via parentUuid | wrapper, text, button, listbox |
The template assembles components (header, footer, sidebars) around each page's content.
Pages vs Components
| Category | Page | Component |
|---|---|---|
| Accessible via URL | Yes (/suppliers, /contact) | No |
| Reusable | No | Yes (header, footer, sidebar) |
| Displayed via | Direct navigation | Domain template |
Responsive Design
BWEB uses Tailwind CSS mobile-first approach. Each block stores its styles per breakpoint in cssProperties.
| Breakpoint | Min. width | Target |
|---|---|---|
| default | 0px | Mobile |
| sm | 640px | Small screen |
| md | 768px | Tablet |
| lg | 1024px | Laptop |
| xl | 1280px | Desktop |
| 2xl | 1536px | Large screen |
Example: a container in column on mobile, in row on desktop:
{bspk: {default: {customClass: flex flex-col gap-2}, md: {customClass: flex-row gap-4}, lg: {customClass: gap-6}}}Conditional Display
3 mechanisms to control block visibility:
| Mechanism | Description | Example |
|---|---|---|
| linked | Links the visibility of one block to another | A detail panel appears when a row is selected |
| effect | Appearance effect | fade, slide |
| conditionalDisplay | Condition based on data | Entity#null, isPublished=true |
Process Variables and Persistence
BWEB manages state server-side, not client-side:
The Entity persists during the session via process variables
No client-side state (no Redux, Zustand, etc.)
The server is the single source of truth
STAMP (optimistic locking) is natively managed by ORDA
4D sessions are scalable and preemptive
Claude does not replace BWEB, it powers it.