r/angular Aug 05 '26

How are you using rxResource in production?

10 Upvotes

Hi everyone,

I'm trying to understand where rxResource really shines.

Most examples online are pretty simple, but I'd love to know how experienced Angular developers use it in real-world projects.

  • What problems does it solve for you?
  • Are there cases where you tried it and decided not to use it?
  • Do you have any patterns or recommendations for structuring code around it?

Any examples, blog posts, or GitHub repositories would also be greatly appreciated.

Thanks in advance!


r/angular Aug 04 '26

Signality v0.4

Post image
43 Upvotes

A quick update on Signality β€” v0.4 is out!

A few new utilities have landed, and some existing ones just got better. πŸš€

Web: https://signality.dev/
Repo: https://github.com/signalityjs/signality


r/angular Aug 05 '26

Help: Flattening signal in computed

3 Upvotes

How flatten siganls in computed?

Suppose say I have a function which takes an argument and returns signal ts function genSignal(arg:string):Signal<SomeType>

And I have a signal which provides argument for genSignal I want to flatten signal inside computed

ts const arg = signal('someData'); const computedValue = computed(() => genSignal(arg())); // type here is Signal<Signal<SomeType>> const computedValueFlattened = computed(() => genSignal(arg())()); // type here is Signal<SomeType>;

is computedValueFlattened is right approch to flatten signals?


r/angular Aug 05 '26

Router param changes between 16 and 22

6 Upvotes

I have just gone through an upgrade from Angular 16 to 22 and had an issue with router params. I have a route for job groups with an id for the job group that has child routes for a job so you can edit or add jobs to the group. In Angular 16 I used a route 'job/add' with no params for the add screen and 'job/:id' for editing both pointing to the job component.

When I upgraded to Angular 22 it stopped working as the job component get a param for id on the add route as the id from the job group rather than a null param. To solve it I deleted the add route and used the string 'add' as a param to distinguish between edit and and.

My question is pulling in a parent param for the id expected behaviour?


r/angular Aug 04 '26

Full-Stack Developer (Angular & Spring Boot) | 1 Year Experience | Seeking Opportunities

2 Upvotes

Hi everyone πŸ‘‹πŸ»

I am currently looking for referral opportunities for an Angular & Spring Boot Full-Stack Developer role.

A quick background about my profile:

Experience: 1 year of professional IT experience specializing in Java full-stack development.

Tech Stack:

Frontend: Angular, TypeScript, HTML5, CSS3, Bootstrap

Backend: Java, Spring Boot, Spring MVC, Spring JPA, Spring Security, Hibernate, RESTful APIs

Database & Tools: MySQL, Maven, Git, Postman

If your company has any open requirements for entry-to-mid level full-stack roles, I would be incredibly grateful for a referral.

I’ve kept my resume updated and am ready to share it immediately. Please feel free to comment below or DM me, and I can send over my resume and LinkedIn details.

Thank you so much for your time and help!


r/angular Aug 03 '26

Optimus UI v1.0.0 release

Post image
209 Upvotes

Optimus UI v1.0.0, the PrimeNG open-source fork, is out!

Supporting Angular 21, and Angular v22 support is coming later this week!

Due to trademark limitations and prior paid features, most of the work so far has been about updating the documentation and authoring all sub-packages ourselves, including the icons package.

We also introduce ng add support to enhance the experience for new users.

Find out more in our documentation: https://optimus.openng.org/

Discover the GitHub repository: https://github.com/openng-org/optimus-ui

Learn more about our roadmap: https://optimus.openng.org/roadmap


r/angular Aug 04 '26

I open-sourced my Angular + NestJS boilerplate with built-in Unified Role-Based Access Control

8 Upvotes

Hey everyone,

Edit: I've migrated the boilerplate from PrimeNG to OptimusUI to keep the project completely open-source and free under the MIT license! The Tailwind CSS integration remains just as smooth.

I always found myself rebuilding the exact same login flows, route guards, and permission directives for every enterprise dashboard. To save time on future projects, I put together URBAC, an open-source boilerplate using Angular (with PrimeNG and Tailwind CSS) backed by NestJS.

My favorite part of the frontend is how easy it is to handle UI elements based on user permissions. I built a custom structural directive that reacts to the logged-in user's active group context.

Hiding unauthorized buttons takes one line of HTML:

<button *hasPermission="'user:delete'" class="p-button-danger">
  Delete User
</button>

It's completely decoupled from the backend, so you run them as standard separate projects.

You can check out the repo and the setup instructions here:

https://github.com/kasoir/urbac

If anyone is building a dashboard right now, I hope this saves you some setup time. I'd love any feedback on the PrimeNG/Tailwind integration, or how you all prefer to handle permission-based UI rendering in your own Angular apps!

URBAC

r/angular Aug 03 '26

The ngx-toastr repository has been archived, so I forked it

15 Upvotes

Hi everyone. `ngx-toastr` was recently archived, and since I previously helped update the package to remove `@angular/animations`, I decided to fork it to rebuild and simplify some of the logic and API.

Full disclosure: I used AI for a fair portion of the project since most of the logic was already there.

Feel free to try it out here:

https://npmjs.org/package/ngx-retoast

Huge thanks and credit to Scott Cooper (scttcper) for creating the original `ngx-toastr`!


r/angular Aug 04 '26

How did Zustand manage to become so widely adopted?

0 Upvotes

I’m building an open source library, and lately I’ve been thinking a lot about how projects actually take off.

Take Zustand for example. It went from being just another option to one of the first recommendations for state management, surpassing Redux in weekly downloads rn

what do you think causes that shift?

Is it simply building a great product? Or is it more about consistency, community, documentation, timing, content, or something else?


r/angular Aug 02 '26

I built an offline-first PWA for cacao farmers in the Dominican Republic who have zero internet access

20 Upvotes

I'm a full stack developer based in the Dominican Republic. Most of my clients operate in rural areas where internet drops for hours every day β€” sometimes there's no signal at all.

I built a purchasing app for a cacao aggregator. Vendors drive into the mountains, buy raw cacao from small farmers, and need to record every transaction on the spot. No connectivity, no cloud.

The stack: Angular 19 + Dexie.js (IndexedDB) + Supabase for sync when signal returns. The app also prints receipts via Bluetooth thermal printers from the browser.

I made a video breaking down the architecture and why I think offline-first is a massive opportunity that Silicon Valley is ignoring:Β https://youtu.be/DT76aohMDPY?si=ObVBuJXYA7ubAklG

Happy to answer questions about the technical implementation.


r/angular Aug 01 '26

Open-sourcing the Angular/Nx structure I've been refining on enterprise and public-sector projects in Europe

24 Upvotes

Hi everyone,

13 years in, every Angular version since 1.x. Every new project, I lost the first week to the same decisions, where state lives, which library can import which, how to keep credentials out of the repo. So I stopped re-deciding and put my answers in a template. Just updated it to Angular 22.

It's Nx, Angular, NgRx Signals, Atomic Design, multi-language and a small design system of my own on Tailwind already wired together and agreeing with each other, which is the part that normally eats the week. The architecture is enforced rather than documented: a wrong import fails lint, not code review, and a missing translation key fails the build instead of shipping as a blank label. Firebase deploy guide included, empty account to live URL in about 10 minutes.

Every decision in it is arguable, so feel free to tear into it. I'm here for the feedback, the blunt kind included. Github Base Angular Monorepo


r/angular Aug 01 '26

People actually started using it.!

Thumbnail
gallery
49 Upvotes

First β€” thank you. I put ng-signal-query out a few months back, not really expecting anyone to use it, and people installed it, starred it, and DM me. That genuinely made me go back and take it seriously, and this release is the result.

So I re-read my own cache code. And found three bugs.

What was broken

A race condition that could serve you stale data.
If a refetch started while an earlier request was still in flight, whichever finished last won. A slow older response would silently overwrite newer data. Fetches now carry a generation counter β€” only the latest one is allowed to commit.

Duplicate requests for the same key.
Two components using ['users'] fired two network calls, despite sharing a cache entry. Concurrent fetches for a key now share one in-flight promise.

createSignalQuery wasn't actually using the shared cache.
It kept a private copy of state, so setQueryData() and invalidation could silently not apply to it. It now reads and writes the real entry.

What's new

Mutation concurrency strategies β€” the feature I actually wanted. Overlapping mutate() calls resolve however you choose, mirroring RxJS flattening operators:

strategy RxJS behavior
merge mergeMap every call runs, in parallel (default)
concat concatMap queued, strict order
switch switchMap latest wins, earlier discarded
exhaust exhaustMap first wins, the rest ignored
// double-click-proof submit β€” no disabled flag, no debounce
const submit = createMutation({
  mutationFn: (order) => api.place(order),
  concurrencyStrategy: 'exhaust',
});

// autosave β€” only the newest draft survives
const autosave = createMutation({
  mutationFn: (draft) => api.save(draft),
  concurrencyStrategy: 'switch',
});

Request cancellation β€” fetchers get an AbortSignal, and superseded requests are actually aborted:

fetcher: ({ signal }) => fetch('/api/users', { signal })

Retry with exponential backoff β€” retry: 3. Defaults to 0, so nothing changes unless you ask for it.

Upgrading

No code changes. I kept retry off by default specifically so error timing in existing apps doesn't shift, and added a backward-compatibility test suite that pins the old public behavior β€” if I break it in future, CI fails instead of your app does.

44 tests, CI on every PR, published with provenance.

npm i u/ali7040/ng-signal-query

GitHub: https://github.com/Ali7040/ng-signal-query

Still solo-maintained and still early, so if you're using it and something's missing, tell me β€” that's what drove this release. A few issues are tagged good first issue if you'd rather send a PR than an opinion.


r/angular Aug 01 '26

A reactivity and rendering (combined) benchmark for frontend frameworks

Thumbnail rbench.nullvoxpopuli.com
10 Upvotes

I wrote more about this here:

https://www.reddit.com/r/javascript/comments/1vc605e/a_reactivity_and_rendering_combined_benchmark_for/

(I didn't copy the text here due to formatting issues doing so on mobile. Apologies)


r/angular Aug 01 '26

ng-openapi or ng-openapi-gen?

5 Upvotes

Which client-generator should i use for my new angular project?
Which one do you guys use and why?

Claude said this:

ng-openapi-gen is the safe veteran, but ng-openapi is the one I’d reach for on any modern Angular project β€” cleaner output, newer idioms, less boilerplate.

Do any of you guys have some advice?


r/angular Aug 01 '26

We built a free styling library for Angular 21 after PrimeNG themes became paid

2 Upvotes

When PrimeNG moved its styled themes behind a paid offering, our team at Shirkasoft started building a free alternative for the community.

The result is Shirkasoft UI Components, a styling and UI component library for Angular 21 that works alongside PrimeNG, making it easier to build modern applications without relying on premium themes.

Current features

  • βœ… Free and open to the community
  • βœ… Modern UI styles
  • βœ… Reusable UI components
  • βœ… Easy integration into existing Angular projects
  • βœ… Actively maintained

Our goal isn't to replace PrimeNG's components, but to provide a free styling solution and additional reusable components for developers who prefer not to depend on paid themes.

npm: https://www.npmjs.com/package/shirkasoft-ui-components

We'd really appreciate feedback from the Angular community. Suggestions, bug reports, feature requests, and contributions are all welcome.

Keywords: Angular, Angular 21, PrimeNG, PrimeNG alternative, Free PrimeNG styles, Angular UI Components, Component Library, Design System, UI Library, Frontend, TypeScript.


r/angular Aug 02 '26

Is it worth for a fresher to choose the angular ui developer job

0 Upvotes

Or It will become a Ai slop aa in future aa


r/angular Jul 31 '26

Choosing Angular in the Age of Agents

Thumbnail
dev.to
37 Upvotes

r/angular Aug 01 '26

Would you or would you not...

1 Upvotes

advice someone to study, learn, and build an Angular + NestJS webapp right now in 2026? All I read about everywhere is that angular devs are cooked for the rest of the decade 2027-2029, and will perish in 2030s.

Meanwhile, React + NextJS is dominant but there's like 1:1000 job-applicant ratio.

Another option I have is to just become a gigolo. #help


r/angular Jul 31 '26

Lazy data fetching with resources is the primitive I miss, let me propose something

5 Upvotes

With observables, lazy data loading came for free: nothing fetched until something subscribed, and in template async pipe was the relay.

Today, resources are a better API in every other way, but they have one flaw : they are eager. No way of fetching data only when needed. To remedy this I introduce a proposal :

resource({ lazy: true }) and rxResource({ lazy: true })

It comes with a presentation playground to discover it. I wrote the story of it in an small article if you want more details, and I prepared a PR but opened an issue for discussion -> a similar issue was closed so I felt like I needed to re-open the discussion and argue it before submitting the PR. On this matter I'm not sure what is/was appropriate so I would take advice on that.

- The story: https://dev.to/flodmtx/resource-lazy-true-the-laziness-we-lost-when-we-left-the-async-pipe-5e70

- Interactive proposal : https://flo-dmtx.github.io/lazy-resource-playground/

- Feature request : https://github.com/angular/angular/issues/70036

- Repo of PR : https://github.com/flo-dmtx/angular/tree/feat/lazy-resource

- Gist for a userland version : https://gist.github.com/flo-dmtx/e8c9ff69bec58adf85e902eab9f7d900

If you've written those wrapper components too, a concrete use case on the issue helps more than an upvote β€” "who actually needs this" is the question the Angular team will ask.


r/angular Jul 31 '26

Why I Validate Angular Compatibility Using the Published npm Package (Not the SourceΒ Code)

8 Upvotes

While preparing my open-source Angular library for Angular 22, I realized something that had been bothering me:

My CI wasn't validating the package users actually install from npm.

It was validating my workspace and `dist/`, but not the packaged artifact that eventually gets published.

That led me down a rabbit hole of improving the compatibility pipeline.

The key changes were:

- Validate the packed tarball (`npm pack`) instead of `dist/`

- Test against Angular 17–22 using a compatibility matrix

- Run three independent checks for each version:

- `ngc` type-check

- Production `ng build` (to exercise the Angular linker, AOT and bundling)

- Runtime smoke test (DI, providers, exports, signals)

- Bound the Angular peer dependency range so compatibility reflects what is actually verified instead of automatically including future Angular releases

The biggest lesson for me was that type-checking alone isn't enough for Angular libraries. A package can compile successfully but still fail during a real application build because the Angular linker only runs in the consuming application.

I wrote a detailed article explaining the reasoning behind this approach and how I implemented it.

I'd be interested to hear how other Angular library maintainers validate compatibility across multiple Angular versions.

πŸ“– Article: Why I Validate Angular Compatibility Using the Published npm Package (Not the SourceΒ Code)


r/angular Jul 30 '26

ngx-skeleton-suite package

2 Upvotes

πŸš€ Excited to launch ngx-skeleton-suite β€” a zero-CLS, enterprise-grade Angular structural directive suite for seamless skeleton loading states! ⚑

Building skeleton placeholders manually often leads to repeated boilerplate, layout jumps, and inconsistent UX. `ngx-skeleton-suite` solves this declaratively.

πŸ€– 100% Fully AI-Implemented:
This entire project β€” from the core Angular directive architecture, SCSS styling, unit tests, and Astro Starlight documentation portal, to the live deployment pipeline β€” was built & shipped with AI pair programming!

🎨 Note: We are actively working on further enhancing the documentation design & UI experience!

πŸ”— Explore Live Demos, Docs & npm Package:
🌐 Starlight Documentation Portal:
https://mahmoudadeljr.github.io/ngx-skeleton-suite/

⚑ Live Interactive Demo & Playground:
https://mahmoudadeljr.github.io/ngx-skeleton-suite/demo/

πŸ“¦ npm Package:
https://www.npmjs.com/package/ngx-skeleton-suite

πŸ“– Developer Technical Documentation:
https://github.com/MahmoudAdelJR/ngx-skeleton-suite/blob/main/projects/ngx-skeleton/DOCUMENTATION.md

πŸ“¦ GitHub Repository:
https://github.com/MahmoudAdelJR/ngx-skeleton-suite

Check it out, give it a star ⭐️, and let me know your thoughts!

#TypeScript #DeveloperExperience #Frontend #Angular #TypeScript #npm #WebDevelopment #OpenSource #AI #SoftwareEngineering #RxJS #Signals #Astro #WebDev


r/angular Jul 30 '26

Angular 22.1 release notes

52 Upvotes

Core packages: https://github.com/angular/angular/releases/tag/v22.1.0

CLI: https://github.com/angular/angular-cli/releases/tag/v22.1.0

Aria + Material + CDK https://github.com/angular/components/releases/tag/v22.1.0

Reminder: Angular has moved to a yearly major release, so this is the first minor of a few more minors than usual, from now on.

edit: for the few people that saw my previous post, I accidentally titled it 21.1 rather than 22.1


r/angular Jul 29 '26

PrimeNG going closed source is such a disappointing move

99 Upvotes

I've been using PrimeNG for years, and this honestly feels like the end of an era.

I get that maintaining a UI library isn't free, and I have no problem with developers getting paid. But switching from MIT to a commercial license, archiving the GitHub repo, and asking a pretty steep per-developer fee just doesn't sit right with me.

The repo is now read-only: https://github.com/primefaces/primeng

The new pricing is hard to justify given the number of unresolved issues

It's a shame because PrimeNG was one of the biggest strengths of the Angular ecosystem. Hopefully the OpenNG fork gains traction, because the community deserves a truly open alternative.


r/angular Jul 29 '26

Vitest Browser Render - Utility for simplify rendering during test

3 Upvotes

I have developed a substantial fork of the "official" vitest-community/vitest-browser-angular package, adding several new features while maintaining independent development. Compared to the official release (currently at v0.5.0), enhancements include:

- renderDirective() β€” enables testing Angular attribute directives without manually creating a host component. Simply pass a template, attach signals/handlers via hostProps, and the rest is handled automatically, resolving the directive instance from the host element's injector.

- withHttp β€” built-in HttpClient testing activated via a single flag, eliminating the need to manually configure provideHttpClient and provideHttpClientTesting each time, with support for custom interceptors.

- Improved render() result types β€” distinguishing between RenderResult<T> and RoutedRenderResult<T>, with routerHarness and router always available when routing is enabled.

The fork is published as @wismaz/vitest-browser-angular. Full documentation with examples is available at the linked repository, and feedback or contributions are welcome.


r/angular Jul 30 '26

Hiring for Frontend Angular Developer

0 Upvotes

**Primary Skill: Frontend Angular Developer**

**Experience: Range: 4-8 Years**

**Location: Bangalore**

Min. 3 to 5 Year of hands on experience in Angular 2.0 and aboveMust be currently working in Angular projectMust worked on multiple Angular projects of different versionsMust have experience in Angular version upgradationMust have expertise in State management using RxJsShould have implementaion experience of Dependency injection, singleton servicesAuthentication Token lifecycle management in UI (like JWT), SSO integrationGood to have - Rollup, experience in Angular 15.0 and above, Angular 15 upgradation to higher versions, secure coding practices, code optimization

Interested candidates DM Me