Announcing AnalogJS 1.0 🚀

Brandon Roberts - Mar 14 - - Dev Community

After many months of development and testing, we're excited to announce the 1.0 release of AnalogJS! The 1.0 release includes many features that help developers ship websites and applications, faster, with Angular.

This release marks the first major release of Analog, giving developers a more stable starting point to build with Analog. We will continue getting feedback from developers that helps us continue to improve and innovate on the project.

Features ⭐️

Analog is the meta-framework built on top of Angular, powered by Vite, a next generation open-source build tool, and Nitro, an open-source server engine framework. Here are some of its features, including:

Contributions and Community 🤓

AnalogJS would not be where it is without a team of core contributors and collaborators.

Robin Goetz
Marko Stanimirović
Luis Castro
Chau Tran
Joshua Morony
Andrés Villanueva

Also, thanks to the 80+ contributors to the project, whether through code, documentation, tests, or even just trying out the project.

The project already has surpassed 2000 stars on GitHub, 500+ members on Discord, 1000+ followers on Twitter/X, and was accepted into the first GitHub Accelerator Cohort.

If you'd like to take Analog for a spin, check out this blog post on Building a Blog with Analog and Angular. If you want to get involved in the project, check out the GitHub repo.

What's Next

We are continuing to make building fullstack websites and application with Analog and Angular as seamless as possible, and extending the Angular ecosystem through integrations with Astro, Nx, Vitest, Storybook, and more.

We have also introduced a new Single File Component format in Analog for authoring components and directives.

Below is an example of a hello.analog file:

<script lang="ts">
  import { signal } from '@angular/core';

  const count = signal(0);

  function increment() {
    count.update(total => ++total);
  }
</script>

<template>
  <h2>Hello Analog</h2>

  Count: {{ count() }}

  <button (click)="increment()">
    Increment
  </button>
</template>

<style>
  h2 {
    color: red;
  }
</style>
Enter fullscreen mode Exit fullscreen mode

What started as a .ng file extension for components and directives using Angular has evolved into the Analog SFC, along with features including support for auto-imports, inline markdown templates, page routes, and more. We are continuing to iterate on this approach, and exploring options to enable this format in Angular applications as the future of Analog progresses.

We've already received very positive feedback, and even further development on supporting this format, including an IDEA Plugin for the Analog SFC that's available in the EAP version of WebStorm. Thanks to Jan-Niklas Wortmann and Piotr Tomiak from the JetBrains team for the initial development of the plugin. You can also contribute to the plugin on GitHub.

Partner with Analog 🤝

We are looking for companies to partner with on the Analog project to support development of the project. Thanks to Snyder Technologies for being an early adopter and promoter of Analog, Nx for joining us as a sponsor, House of Angular, and many other backers of the project.

Find out more information on our partnership opportunities or reach out directly to sponsor[at]analogjs.org.

Join the Community 🥇

If you enjoyed this post, click the ❤️ so other people will see it. Follow AnalogJS and me on Twitter/X, and subscribe to my YouTube Channel for more content!

. . . . . .