What Is Makeswift?
Makeswift is a composable visual editor designed to equip marketers to create rich, high-quality web experiences without the friction of steep learning curves or never-ending development cycles.
Building beautiful content experiences often involves trade-offs between clunky editing interfaces, frustrating guesswork about what published content will really look like, or heavy reliance on development teams for small updates. The Makeswift visual editor takes an innovative approach that allows marketers to build sophisticated content presentations and guarantees that what you see is really what you get, without sacrificing the power of developers to customize and integrate for any need.
In contrast with a traditional content management system (CMS) or digital experience platform (DXP), visual building blocks and layouts are front and center in the Makeswift architecture and editing experience. Authors edit these building blocks directly, rather than editing a collection of fields without having control over their visual presentation.
Catalyst, the officially supported composable storefront from BigCommerce, seamlessly integrates Makeswift, offering the power of visual editing for the entire ecommerce user experience out of the box.
Catalyst, BigCommerce’s officially supported composable storefront, seamlessly integrates Makeswift, offering out-of-the-box visual editing for the entire ecommerce user experience.
Key Makeswift Features
What You See Is What You Get
Makeswift’s interactive, drag-and-drop builder allows you to edit your true content presentation in real time. Compose your visual experiences with intuitive component building blocks that interact in a predictable, reliable way.
Makeswift’s component-focused architecture enables developers to effortlessly create custom components that are intuitive and reliable.
Optimized Out of the Box
Makeswift leverages the native tooling of Next.js for exceptional performance and also gives you access to key SEO tools - manage metadata, easily set up redirects, and take advantage of auto-generated sitemaps.
Fully Responsive
The editor is designed with full responsiveness in mind, allowing you to both see an accurate representation of your content at various breakpoints and truly custom-tailor the experience for each.
Use the built-in breakpoints or easily create the ones you need.
Team Collaboration
Makeswift supports real-time collaboration between multiple users in a workspace, never locking out editors because someone else is updating a page.
Varied roles and permissions make it possible to allow wide collaboration without endangering the stability of your content, and enterprise teams can take advantage of Single Sign-on to simplify the security of their workspaces.
Enhanced Localization
Localization features go beyond translation, allowing you to create truly varied content experiences for every locale.
Versioning Features
Edit your content freely while remaining in control of what gets published and when. The editor interface allows you to effortlessly revert to previous versions of your content and to review a history of your changes.
Freedom of Integration
Use the Makeswift editor as your primary content system, or else leverage its visual editing capabilities for content provided by your chosen CMS or DXP. The tools in the Makeswift tech stack make it possible to integrate any backend into the building experience.
The Tech Stack
Makeswift’s unique composable architecture allows for rapid customization, scalability, and maximum freedom to make your frontend application your own.
Makeswift is built on a set of tools that have wide adoption and popularity in enterprise web application development.
- React- A widely used library for rapidly building user interfaces, and the key toolset that powers Makeswift’s visual components
- Next.js - One of the most popular and fully featured full-stack React frameworks
- Typescript - A JavaScript language extension powering the type inference that helps you avoid errors and unpredictable code
- Tailwind - A CSS framework focused on rapid development
The combination of these toolsets and Makeswift’s component concept make for a smooth and flexible developer experience.
Click each row to expand.
Composable
You fully own and control the front-end application that powers the Makeswift editor and your rendered content. This means you have the freedom to integrate Makeswift-powered visual building into your web experience as you see fit.
Start with a default Makeswift implementation within minutes, or integrate the builder into your existing Next.js application incrementally or all at once.
Because Makeswift is built on a headless front-end with universal and widely adopted tools, standardized techniques can be used to integrate data from third-party systems into your custom components.
Component-Based
Rapid customization in Makeswift is easy because the editor is centered not around content schemas, but around the building blocks that actually make up rich experiences - visual components. You’ll spend your time crafting the presentation and interactions of components instead of writing meticulous data models.
Decoupled
Custom components are loosely coupled with Makeswift. Because your component code is simply React code with no builder-specific wiring, you can avoid the learning curve of a proprietary framework. This also gives you the freedom to use your components in code or in the editor.
Catalyst and Makeswift
BigCommerce’s first-class composable framework, Catalyst, comes with built-in support for the Makeswift editor. Catalyst is a fully built Next.js storefront with an opinionated set of tools, designed to jumpstart your composable BigCommerce shopping experience.
With Catalyst as a fully implemented headless storefront and Makeswift as a premier content editing experience, you have a truly powerful enterprise-level composable toolkit.
While a basic Makeswift-enabled content site can be installed as a standalone application, installing the built-in integration with Catalyst is the best approach when your aim is to create an ecommerce storefront.
If you want to dive deeper into Catalyst, see the dedicated Catalyst Core course.
