Nordcaft core concepts

Nordcraft is a website builder combined with a powerful AI agent. When building with Nordcraft, you get complete creative control to craft user experiences, and the speed of AI to generate the rest.

Nordcraft is built around several fundamental concepts. Understanding these core concepts will help you work more effectively with Nordcraft before you begin your first project.

Nordcraft is a visual website builder built on modern web standards of HTML, CSS and JavaScript.

• If you already know HTML and CSS, you know how to build websites in Nordcraft
• Design and build visually on a responsive canvas that updates in real-time
• Add custom code when needed for specialized functionality

Nordcraft's website builder bridges the gap between visual design tools and coding environments, eliminating traditional handoffs between designers and developers, and removing the time-consuming setup processes of traditional development environments.

Explore the Nordcraft editor to see how this works in practice.

In Nordcraft you can take advantage of a component-based architecture:

• Components are reusable, self-contained pieces of interface and functionality
• Each component has its own structure, styling and behavior
• Components can be composed together to create more complex interfaces
• Components maintain encapsulation of their internal state and logic

A component-based approach promotes reusability, project maintainability and team collaboration. Learn how to create your own components to build a tidy, modular project.

In Nordcraft you can create two types of project:

• Websites: complete websites with pages and functionality
• Packages: collections of reusable components and functions

You can create and publish packages to share across projects, making them ideal for common functionality across different websites. Learn more about creating and launching packages to share your work.

Nordcraft includes a Git-like version control system:

• The main branch represents the live version of your project
• Create new branches for developing new features or fixes
• Preview changes on a live URL before publishing
• Publish branches to the main branch when work is complete

This workflow enables flexible collaboration and helps maintain the stability of your live websites. For best practices, check out our guide on effective branching strategies.

Pages are the foundation of websites in Nordcraft:

• Each page has a unique URL path
• Use page parameters to power dynamic content
• Your pages can contain components and elements
• Configure SEO metadata including Open Graph image metadata for each page

Learn how to create pages and set up their configuration.

Nordcraft uses a reactive data model built on signals:

• Store state within components and pages using variables
• Transform data using formulas
• Use events and workflows to build interactivity
• Use contexts to share data between components
• Each time any data changes, Nordcraft updates your website's user interface automatically

Learn about working with variables and creating formulas to implement dynamic behavior.

Nordcraft supports both server-side rendering (SSR) and client-side rendering (CSR):

• SSR improves initial page load speed and is essential for search engine optimization (SEO)
• CSR enables rich interactivity after the initial page load
• Nordcraft intelligently handles the transition between these modes

When working with APIs, you can configure which requests are processed during SSR or whether they are processed on the client after the initial page has loaded.

You can connect any external data source by connecting an API:

• Configure endpoints to connect to any back end
• Handle authentication securely
• Transform and use response data anywhere on your websites
• Set up real-time data transfer with streaming connections
• Connect to specialized back-end providers through services