Frontend Architecture


🧑🧔 Between 6 to 10 people

🕜 16 hours (4 blocks of 4 hours)

🎁 A free course at our campus

📊 80% practice - 20% theroy

📍 Remote or In site

👷‍♂️👷‍♀️ Full day of work with the team to apply on real project

¡Sounds good!
💡 This course is for companies: 👉 If you are looking courses for you as developer, please visit our campus


In the world we live in today, where we need to deliver features quickly and with a lot of value to the user, it is essential to have an architecture that helps us deliver value quickly and safely, especially one that allows us to extend our functionality day by day while reducing the error rate.

In this course, we propose to build a React architecture applying Clean Architecture and Hexagonal Architecture following this syllabus 👇

Block 1

  • Architecture fundamentals
  • Layered architecture
  • Advantages of layering
  • Evolution
  • Decoupling
  • Testability
  • Clean architecture
  • Exercises

Block 2

  • Clean architecture in frontend
  • Why we should distance ourselves from frameworks/libraries
  • Thinking in terms of the domain
  • Testability
  • Exercises

Block 3

  • Domain events
  • Dependency injection
  • Reactivity from our domain
  • Exercises

Block 4

  • What if we think at a high level
  • Defining generic architecture components
  • Changing implementations based on platform/url/runtime
  • Domain event exercise

This course uses React as the UI library, but we can adapt the course to another frontend technology


  • Stateless && stateful components
  • Dependency Injection
  • Abstraction & Implementation
  • Inversion of Dependencies
  • DDD concepts (Entities, Value Objects, Domain Services)
  • GOF Design Patterns (only relevant for this course)
  • Functionality change by configuration
  • Global State
  • MVVM (Model-View-ViewModel)
  • Custom Hooks
  • Generic Behavior
  • Resources, Permissions
  • Dynamic Components
  • Unit tests
  • Integration tests for the different layers

Course Value

  • Learn how to build sustainable architectures with React
  • Design reusable components
  • Monorepo
  • Good front-end development practices
  • Test the React components


The hardest part of a course is putting what you’ve learned into practice, which is why in this course, students spend most of their time programming, dedicating 80% to practice and 20% to theory.

The course is divided into modules, each of which consists of a theoretical and practical part.

The practical part is organized by working in pairs, where a communicative environment is encouraged through short exercises. We will do different programming katas so that students can practice each concept we learn.

We will work with mob programming


This is a course for people with a minimum knowledge of programming in JavaScript and Frontend concepts.

We also leave you here a post we have written about the news of the new version of React

Contact us

If you are interested in this course, please fill out the following form and we will get in touch with you.