Frontend study guide

Your curated roadmap to learning the commercetools Frontend development lifecycle, taking you from core concepts and local setup to building components, managing backend extensions, and finally to deployment and go-live.

Learning objectives
  • Describe the core architecture and key development concepts of commercetools Frontend.

  • Implement a complete development workflow, from local setup to building components and backend extensions.

  • Manage the deployment, go-live, and maintenance processes for a commercetools Frontend project.

This guide is for both frontend and backend developers. A mutual understanding of both domains is essential for effective collaboration and a cohesive view of the platform's architecture.

Prerequisites: You should be familiar with React and Next.js development and have access to a commercetools Frontend project and a Composable Commerce Project before working through these topics.
How to use this guide: Work through the sections in order for a complete development journey, or jump to the section that matches your current task. Each section is self-contained and links to the canonical reference or how-to guide for that topic.
Expected outcome: After working through this guide, you can set up a local development environment, build and configure Frontend components and backend extensions, use the Frontend SDK and APIs, deploy your project, and maintain it through migrations and updates.