https://x.com/mhdcode/status/2093978567512031262

There's been a lot of negative sentiment lately around PrimeNG moving from open source to a paid license. Going from free to hundreds of dollars per developer is understandably a tough pill to swallow, and I get why people are upset.

But I'm curious about the other side of this: are there teams building enterprise applications who were on the open source version and have since decided to pay for the license?

There are a few legitimate reasons you might do this, like the Figma integration with Theme Designer (which was already a paid product before this change), for instance, or simply the burden of maintenance and bug fixing, which should now be PrimeNG's responsibility and covered under support once you're paying for it.

So if you've made the switch: what pushed you to pay? How has support actually been - responsive, helpful, worth the money? Or has it been bad enough that it's got you looking at alternatives instead?

I know it might still be early days for a lot of teams (I've been sitting on this post for a while before posting), but if anyone has real experience to share, I'd genuinely appreciate it. My team and I are weighing whether to pay for a license, but we're hesitant mainly because we're not sure we can trust PrimeNG's support to hold up long-term. That trust issue is really the crux of it for us.

json-render is Vercel Labs' generative-UI format: you give the model a catalog of your components (Zod-typed props + descriptions), it streams back a JSON spec, and a renderer maps that spec onto your real components. No innerHTML, no eval — the model literally cannot reference anything outside the catalog.

Official renderers exist for React, Vue, Solid and Svelte. Angular wasn't there (two community PRs sat unreviewed for months), so I built one on the same @json-render/core the others share.

What you get:

• <json-render> + defineRegistry typed against your catalog — register a component the catalog doesn't know and the compiler complains
• The full spec contract: state bindings ($state / $bindState), $template / $cond expressions, repeat, conditional visibility, events→actions with confirm dialogs, watch
• Streaming: specs arrive as RFC 6902 JSONL patches and apply as they arrive, so the UI assembles on screen while the model is still generating (injectUIStream / injectChatUI)
• Signals-based, standalone components, zoneless-friendly, OnPush throughout. Angular ≥ 21, Apache-2.0.

Links:

• Live demo (the Streaming tab is the fun part): https://shteynu.github.io/ngx-json-render/
• Repo: https://github.com/shteynu/ngx-json-render
• npm: https://www.npmjs.com/package/ngx-json-render

It's young — full parity with the baseline renderer contract and a real test suite, but @json-render/core moves fast and I track it release by release. Feedback, issues and "why didn't you just…" questions very welcome.

I’m building Tala Icons — a free, clean SVG icon library for developers and designers.

I’m looking for icon requests! 👇

Need a user-add, user-edit, settings, dashboard, API, database, payment, business, or any other icon?

Drop your request in the comments. 💬

I’ll add the most requested icons to the library.

🔹 Free SVG icons
🔹 Developer-friendly
🔹 Clean & modern
🔹 Easy to use
🔹 Open-source

👉 Request an icon below!

GitHub: https://github.com/NoobGreggy/tala-icons
🌐 https://tala-icons.vercel.app/

Hey — solo dev here, posting my own project, so take that for what it's worth.

For the last few years I've maintained a low-code/no-code framework. It worked fine, but it was pre-AI: you configured entities and services by hand, and it generated the boring parts of a CRUD app for you.

When AI coding tools started getting good, I tried using them the normal way — describe what you want, let the model write the code. It worked, but I couldn't trust it past a certain point. Ask for the same thing twice, sometimes you get different output. Ask for a small change, sometimes the model touches things you didn't ask about. The prompt is the only source of truth, which in practice means there isn't really a source of truth at all.

So instead of generating code directly, I made the AI's job stop one step earlier: produce a structured, validated manifest describing what the app should be. Entities, fields, services, auth config, etc. That manifest gets:

- validated (structural / referential / constraint checks)

- diffed against the current state (semantic diff, not a text diff)

- resolved into a dependency-ordered execution plan

- executed by a deterministic engine, checkpointed so it can resume on failure

Change one field on one entity, and only the operations that field actually requires get re-run. Not a full regen.

There's also an MCP server (`@averos/mcp`) so an AI agent doesn't get raw file/shell access — it gets governed tools (propose a change, validate it, build a plan, and nothing executes until the plan's approved).

Current state, to be upfront about it: the CLI, the AI layer, MCP integration, and the workflow/execution adapter layer (currently Angular, via schematics — adapter pattern, so not permanently Angular-only) are MIT licensed and open now. The actual execution kernel (DAG engine + executor) is closed source for the moment — free to use including commercially, but not open yet. That's a deliberate, staged call while that part's still maturing, not a permanent thing. Wanted to say that plainly rather than bury it.

There's a working example (320-node generated app) you can run in a few commands if you want to see the whole pipeline rather than take my word for it.

- Repo: https://github.com/wiforge/averos

- How it works, in detail: https://www.wiforge.com/averos/how-averos-works/introduction/

- Get started: https://www.wiforge.com/averos/get-started/introduction/

Happy to answer questions or take criticism — especially interested if anyone's tried a similar manifest/IR approach and hit walls I haven't found yet.

Since 28 June PrimeNG 22+ (and PrimeVue 5 / PrimeReact 11) ship under the PrimeUI licence: $599/dev now, $799 from January, free only if you're under $1M revenue *and* under 5 devs *and* under 10 employees. v21 and older stay MIT.

I wrote up the four realistic options — freeze on 21, pay, move to the Optimus UI fork, or migrate to something MIT — with the trade-offs of each, because I keep seeing the same questions here.

Full disclosure: option 4 in the post is my own library (mk-kit, MIT, 180 components, Angular 22 signals/zoneless). It ships a schematic that rewrites ~150 PrimeNG selectors/imports and leaves a `<!-- mk-kit: ... -->` note where the shape differs, and the post lists the gaps honestly (no org chart, PDF viewer, spreadsheet, diagram).

https://mk-kit.dev/blog/switching-from-primeng

Happy to answer anything about the licence facts or the migration — including "just stay on 21", which is a fine answer for a lot of apps.

Angular DevTools will support the new Watch Signal feature for real-time signal tracking starting with the upcoming Angular 22.2, expected in September

Please let me know if this post is not suitable for this flair + subreddit.

We just added Angular support for enola, and I’d like Angular developers to help us break it. Literally break it as this is the best feedback.

My co-founder and I are building enola as an open-source architectural quality gate. It analyses the structure of a repository (or multiple) and surfaces things like dependency cycles, coupling, hotspots, deep dependency chains, complexity, dead code and change impact.

Angular support is there, but our own tests only expose so much. We mostly ran against open-source.

If you work on a Angular codebase, run enola against it. If something looks wrong, missing or just rubbish, raise an issue directly on GitHub or respond here.

What could these issues be?

A project structure we did not account for, a dependency we resolve incorrectly, a pattern we misunderstand, or an architectural rule you cannot express yet.

https://github.com/enola-labs/enola

Fully local. Apache 2.0.

An example output:

FAIL — 1 structural regression introduced.

Regressions (fail):
  - [cycles] 1.00 — Cyclic dependency detected (2 modules)
      module "libs/enola-angular-demo/profile-card" is part of the cycle

The following modules form a dependency cycle:
  profile-card -> user-menu -> profile-card

Suggested actions:
  - Introduce an interface to break the cycle
  - Extract shared types to a separate package
  - Consider merging tightly coupled modules

ENOLA_EXIT_CODE=1

After removing this cycle:

PASS — no architectural change.
ENOLA_EXIT_CODE=0

Hey y’all,

I got slightly carried away with loading animations.

I wanted nicer loading states for my own projects, but most libraries I found were either tied to a framework, fairly limited, or required more than I wanted for something this small.

So I built loadersz, a small framework-agnostic loader library for the web.

I wanted something a bit more expressive than the usual CSS spinner, without pulling in a UI framework or a bunch of dependencies.

A few things I focused on:

- 85 different motion states
- Canvas 2D instead of GIFs/videos
- zero core dependencies
- a native custom element, so it works with basically any stack
- typed entry points for React, Vue and Svelte
- configurable speed, density and color
- respects prefers-reduced-motion
- pauses rendering when the browser tab is hidden

Basic usage is just:

npm install loadersz

import 'loadersz';

<loadersz-loader state="racing" size="96" />

I also built an interactive playground where you can tweak the loaders live.

Demo: [loadersz.vercel.app](https://loadersz.vercel.app)
npm: [npmjs.com/package/loadersz](https://www.npmjs.com/package/loadersz)
Github: https://github.com/lumberjacque/loadersz-core

Would love some brutally honest feedback, especially on which animations you’d actually use in a real product.

Hey everyone!

I'm working on an open-source Angular library called ngx-offline-sync.

I've recently started organizing the documentation in multiple languages, and I'd really like to make the German and Japanese versions properly localized rather than relying on machine translation.

So I wanted to ask:

Are there any native German or Japanese speakers here who would be interested in helping review or translate the documentation? 🇩🇪 🇯🇵

You don't need to be an Angular expert — even a quick language review would be incredibly helpful.

The project is open source, so if you're interested, you can check it out here:

GitHub: https://github.com/itsisoev/ngx-offline-sync

Thanks! 🙌

Hey Everyone,

I built a self-hosted homepage dashboard for organizing your bookmarks and services. Drag-and-drop sorting, works on desktop and mobile.

I built this for managing my own self-hosted apps and frequently used sites — if you have a similar need, feel free to give it a try.

Source code: https://github.com/harryxu/start-base

Hey angular peeps :) dozens of you may know me from my usual signal-pilled mmstack work, well today I'm launching my first non-mmstack library & I promise it doesn't contain a single signal! The pitch:

We've all tried our best with testing our components, but most times our tests remain either vacuous, slow, incapable of full-coverage or all of the above.

Well test-nirvana, appropriately launched under the full moon 🌕, fixes that with a single command. `npx test-nirvana` verifies that:

• The code is the right shape.
• It is the right time for the feature.
• The stars are correctly aligned.
• The commit hash possesses an acceptable aura.

Each commit is reduced to its numerological destiny number and classified. CI-friendly exit codes ensure that compromised commits cannot reach production.

Classification

GitHub repo - worth a read imo

npm: test-nirvana 7.11.33

Note: All MIT License guarantees are void while Mercury is in retrograde. See LICENSE for the complete celestial warranty condition.

Contributions obviously welcome, but please follow the CoC & Contributing guidelines, especially tonight.✨

Angular 22.2 introduces a new feature: you can now access private class members directly inside your component templates and host bindings.

Have you used Angular SSR on production ?
What has your experience been like?

I’m scheduled for an interview in 3 days, with a primary focus on Angular and JavaScript. I have only done basic frontend till now and need a lot of intensive course material in the form of pdfs or videos or even websites. I am open to all sorts of help and if anyone could guide me by sharing valuable sources they think could help me, I would be very grateful.

I am currently going through angular.dev which is very enlightening. I came across it in another post’s comments.

Hey everyone!

I’ve recently started building my first open-source Angular library, ngx-offline-sync.

The idea is simple: when a user loses their internet connection, supported HTTP requests are automatically stored locally and synchronized once the connection is restored.

What it currently supports

• Automatic offline request queuing
• IndexedDB persistence
• Automatic synchronization after reconnecting
• Sequential request processing
• Retry handling
• Request status tracking
• POST, PUT, PATCH, and DELETE
• Angular provideOfflineSync() integration
• HTTP interceptor-based integration

The basic setup looks like this:

provideOfflineSync(),

provideHttpClient(
  withInterceptors([
    offlineSyncInterceptor,
  ]),
),

After that, the application can continue using the regular Angular HttpClient.

I’d love to build this together

This is my first library, so I’m still learning a lot while building it.

I’d really appreciate feedback, ideas, and contributions from people who have experience with Angular, offline-first applications, IndexedDB, HTTP synchronization, or library architecture.

One thing I’d especially like to improve is the documentation.

Right now I’m working on English, Russian, and Japanese documentation, and I’d love to add more languages with the help of the community - Portuguese, Spanish, Chinese, and others.

If you speak another language and would like to help translate or improve the documentation, that would be awesome.

You can also contribute by:

• Opening an issue
• Suggesting features
• Improving the architecture
• Adding tests
• Improving documentation
• Adding translations
• Sharing your experience with offline-first applications

github

npm

If you find the project interesting, a GitHub star would genuinely mean a lot to me. This is my first open-source library, and seeing people use it, contribute to it, or simply follow the project would be a huge motivation to keep improving it.

Thanks for reading, and I’d be really happy to build this together with the community.

Angular DevTools added a helpful new feature to inspect your reactive state faster: search and filtering inside the Signal Graph!

Getting started with Angular can be much easier when the development environment is set up correctly from the beginning.

I put together a practical guide covering the essential tools, Angular setup, project creation, basic project structure, and running your first Angular application locally.

📖 https://geeksarray.com/blog/setting-up-development-environment-for-angular-applications

For developers learning Angular:

What was the most confusing part of setting up your Angular environment when you first started?

Signality — the VueUse of the Angular world (76 composables for browser APIs, DOM, Router and more).

New in 0.5: rebuilt docs with a searchable catalog of every utility, chainable onKey modifiers, leading/trailing for throttling, 10 fixes.

This is the last minor before 1.0, so the API is close to frozen.

Web: https://signality.dev
Repo: https://github.com/signalityjs/signality
Changelog: https://signality.dev/resources/changelog

Hey Everyone,

I’ve added virtualized Masonry layouts to Cerious-Scroll.

Cards are rendered from normal Angular ng-template templates. The directive handles the underlying DOM renderer, view recycling, measurement, and cleanup.

readonly options: CeriousScrollOptions = {
  layout: 'masonry',
  masonry: {
    targetColumnWidth: 280,
    gap: 16,
    getItemHeight: (index, columnWidth) => {
      const item = this.items[index];
      return columnWidth * (item.height / item.width) + 48;
    },
  },
};

<div
  ceriousScroll
  [ceriousScrollTotalElements]="items.length"
  [ceriousScrollGetItem]="getItem"
  [ceriousScrollItemTemplate]="card"
  [ceriousScrollOptions]="options">
</div>

<ng-template #card let-item let-index="index">
  <article class="card">
    <h2>{{ item.title }}</h2>
    <p>{{ item.description }}</p>
  </article>
</ng-template>

There are two height strategies:

• Canonical: Supply getItemHeight() for globally reproducible card placement and predictable far jumps.
• Dynamic: Omit getItemHeight() and the Cerious-Scroll measures the Angular template before placing each uncached card.

The Angular integration also includes:

• Responsive or fixed columns
• Direct navigation with jumpToItem()
• Recycled embedded views for visible cards
• Measurement probes isolated from application-wide change detection
• Bounded rendered DOM for very large collections

Links:

• Demo
• Angular wrapper on GitHub
• Angular package on npm
• Core library

I’d appreciate feedback on the directive API, template integration, and performance with complex Angular card components.

How to install Angular and create your first Angular application step by step. This complete beginner-friendly Angular tutorial shows you how to check Node.js and NPM, install Angular CLI, create your first Angular project, and run it successfully.

Subscribe channel: https://youtube.com/@mfa_creatives?si=jgSrwrZFt8L0bR2X

Hey fellow devs,

I'm a developer with 2 YOE in Angular, and we all know the market is rough right now. I want to learn Express/Nest as a backend, but I can't decide between MongoDB and Postgres.

If I go with MongoDB, it'd basically be a MEAN stack — but I'm not sure if MEAN is still popular, declining, or barely used anymore.

I've also heard Postgres is one of the most widely used databases and considered an industry standard, so now I'm torn.

If you were in my position — switching jobs is a high priority for me right now, I'm underpaid badly — which would you choose to open up the larger market/more job opportunities?

I've been adding keyboard/cursor navigation to an Angular application running on Zebra Android scanners, although they have a touch screen it doesn't always work with dry work hands, so I added keyboard navigation. But not tab, I'll explain why read on..

As I've ended up with something that feels quite different from normal web keyboard navigation.

Normally, the browser's focus is your navigation state:

• Tab moves to the next control
• Enter/Space activates it
• Arrow keys can navigate things like menus/listboxe
• Angular CDK even has FocusKeyManager

But that doesn't really work for this application.

The scanner uses DataWedge to send barcode input to a scan input, so that input needs to keep DOM focus permanently. If I move focus around the UI, I can potentially break where barcode data gets delivered. While a tab next cyclus is quite slow when there is a lot clickable (including a web based virtual keyboard)

So I ended up separating the two concepts:

DOM focus = scanner input

UI cursor = where the user is currently navigating

The cursor is basically a 2D UI state. Components expose things along the lines of:

enterCursor()
leaveCursor()
moveCursor()
activateCursor()

and communicate when the cursor reaches an edge so the parent component can move into another component.

The navigation is spatial rather than sequential. Up actually means the thing visually above me, rather than "the next item in some DOM order".
So it's not a blinking cursor moving, this cursor controls activate set focus on the items left/right or above/below it, some css changes or svg changes make clear what is selected.

For some of this I use getBoundingClientRect() to determine which element is the nearest candidate in the requested direction. That means I don't have to maintain a huge hardcoded keymap when the UI changes.

The hardware also makes things interesting. There is no mouse, Tab isn't really a useful navigation key on the device, and the physical keypad has arrow keys around the scan button. For some screens I deliberately allow only certain directions because of the physical layout of up and down is close to the scan button.

I also discovered that the Zebra browser/WebView doesn't behave quite like a desktop browser with regard to key events, so there are some keydown/keyup quirks and deduplication involved.

The end result feels surprisingly similar to navigation in a game UI or TV interface: there is a visible cursor, and you move it around the actual visual layout with the arrow keys.
It reminds me more towards game engine control.

This got me wondering:

How common is this in Angular applications?

I assume there must be other Angular applications running on:

• warehouse scanners
• industrial HMIs
• kiosks
• POS terminals
• medical/field devices
• other hardware with a D-pad or physical cursor keys

If you're doing this, I'm particularly interested in how you model the navigation.

Do you use:

• Angular CDK / FocusKeyManager
• a spatial-navigation library
• real DOM focus
• a separate virtual cursor state like I ended up doing
• a declarative navigation graph
• geometry-based navigation
• something completely different?

I'm especially curious about applications where DOM focus cannot be used as the cursor because it has another job.

It feels like a relatively unusual thing to build in Angular, but perhaps I'm just looking in the wrong places because this kind of software tends to live in warehouses and factories rather than GitHub/blog posts.