dark IntroductionQuick StartRealm Mindset 01. Hello world02. Element Attributes03. Element States04. Element Flow05. Global States06. Data Bindings07. Children Rendering08. Custom Script Flow09. Reusability10. Dynamic Styles11. Events12. Conditional Rendering13. List Rendering14. HTTP Request15. The Dot Notation16. State Mutation17. Finale Server-side RenderingShadow DOM StylingASTRA StackPRO Stack
IntroductionQuick StartRealm Mindset 01. Hello world02. Element Attributes03. Element States04. Element Flow05. Global States06. Data Bindings07. Children Rendering08. Custom Script Flow09. Reusability10. Dynamic Styles11. Events12. Conditional Rendering13. List Rendering14. HTTP Request15. The Dot Notation16. State Mutation17. Finale Server-side RenderingShadow DOM StylingASTRA StackPRO Stack

Astro is, so far the best static site generator for the modern web. Realm is a new way to build apps utilizing Native Web Components. Combine them together and you’ll get the ASTRA stack.

If you don’t know what Astro is, you can read their official documentation first.

Why Astro?

Realm allows you to develop apps or websites using only HTML, which provides simplicity and ease of implementation. If you don’t need another framework or tools, it’s really fine.

However, if you are mastering a more complex framework / library, and once your codebase grows and you require additional features such as writing blogs, Markdown support, and other functionalities, a static site generator becomes necessary for codebase maintenance. In this context, Astro emerges as the best choice.

Astro offers a compelling combination of a great developer experience and excellent performance.

With Astro, developers benefit from extensive TypeScript support, enabling a more robust and type-safe development process. Additionally, Astro leverages the latest web technologies such as ES Modules, Web Components, and an Island Architecture, contributing to its excellent performance.

One notable advantage of Astro is its versatility. Whether you want to craft micro frontends or build a full-stack web app, Astro provides the flexibility to suit your needs.

Another benefit is that Astro includes a built-in router, eliminating the need to install a third-party router. This built-in router not only saves development time but also ensures efficient and fast routing within your application.

Take for example this website. It’s built with Astro 🚀 and Realm ✨. You can view the source code here.

Realm’s role

With Realm, you have the ability to handle layouting, theme switching, and various other aspects of your app or website. Realm provides a robust framework for managing these functionalities.

On the other hand, Astro takes care of essential tasks such as routing and Markdown support. It offers a powerful routing system that allows you to define and navigate between different pages or views within your application seamlessly. Additionally, Astro provides built-in support for Markdown, enabling you to write and render Markdown content effortlessly.

By combining the strengths of Realm and Astro, you can create a comprehensive development environment. Realm empowers you to handle layouting and theming, while Astro takes care of important features like routing and Markdown support. This division of responsibilities allows you to build a well-structured and feature-rich app or website efficiently.