Dynamic Engine

The Dynamic Engine is the core engine of the platform that allows you to build and customize your web applications. It is a powerful tool that provides you with all the features you need to build and deploy your web applications in a matter of minutes.

Interface Overview

The Dynamic Engine interface is divided into five main areas:

• Canvas — The main area where you build your application. It contains the pages, routes, and navigation of your application.
• Left Sidebar — Contains the components library, pages and routes, theme management, and backend integration.
• Right Sidebar — Contains the properties of the selected component, styling, state and data binding, and events and interactions.
• Bottom Panel — Contains the console, logs, error management, and debugger of the platform.
• Top Navigation — Contains the project name, publish button, preview button, and user profile.

Pages, Routes and Navigation

The platform allows you to create and manage multiple pages and routes for your application.

• Pages — Create multiple pages for your application. Each page can have its own layout, components, and styling.
• Navigation — Create a navigation menu for your application to allow users to navigate between different pages.
• Routing — Define routes for your application to handle different URLs and navigate to the corresponding pages.
• Hosting and Deployment — Host and deploy your application to the platform's hosting service or your own custom domain.
• SEO — Optimize your application for search engines by adding meta tags, descriptions, and keywords to your pages.

Layouts and Responsive Design

The platform provides layouts and responsive design features to help you build a responsive and mobile-friendly application.

• Flexbox and Grid — Use Flexbox and Grid to create complex layouts for your application.
• Responsive Design — Use responsive design features to create an application that works on different devices and screen sizes.
• Breakpoints — Define breakpoints for your application to change the layout and styling based on the screen size.

Grids, Containers, and Sections

• Grid System — Use the platform's grid system to create complex layouts for your application.
• Containers — Group components together and apply styling and layout properties to them.
• Sections — Divide your application into different parts and apply styling and layout properties to them.

Component Library

The platform provides a set of pre-built components that you can use to build your application.

• Basic Components — Buttons, inputs, forms, cards, images, videos, and more.
• Advanced Components — Data tables, charts, maps, calendars, and more.
• Custom Components — Create your own custom components and use them in your application.
• Third-party Components — Use third-party components from libraries like React, Vue, and Angular.

Building UI

• Drag and Drop — Build your UI by dragging and dropping components from the component library onto the canvas.
• Styling and Customization — Customize the look and feel of your application by changing component styling, adding custom CSS, and using theme management features.
• Reusable Components — Create reusable components and use them across different pages of your application.

Styling and Themes

The platform provides theme management so you can customize the look and feel of your application.

• Typography — Customize typography by choosing from pre-defined fonts or adding your own custom fonts.
• Colors — Customize colors by choosing from pre-defined color palettes or creating your own custom palette.
• Spacing and Layout — Customize spacing and layout by changing margins, padding, and other layout properties.

State and Data Binding

• Local State — Manage the state of your components using local state.
• Global State — Manage the state of your application using global state.
• Data Binding — Bind data from your backend or external APIs to your components.
• Events and Interactions — Define events and interactions for your components to handle user actions like clicks, hovers, and form submissions.

Backend Integration

• API Integration — Integrate your application with external APIs to fetch and send data.
• Database Integration — Integrate your application with a database to store and retrieve data.
• Authentication and Authorization — Add authentication and authorization to secure your data and restrict access to certain parts of your application.

Publishing and Exporting

• Publishing — Publish your application to the platform's hosting service or your own custom domain.
• Exporting — Export your application as a standalone project that you can host on your own server.
• Version Control — The platform provides version control features to help you manage different versions of your application.