Blog

As an experienced Angular developer, you might be considering expanding your skill set by learning Java. This transition can be both challenging and rewarding, offering you a broader perspective on software development. In this blog post, we’ll explore how your Angular background can aid your journey into Java, and provide you with a detailed roadmap to get started. Leveraging Your Angular Experience Your background in Angular provides a solid foundation for learning Java. Here’s how your existing skills will help: ...

Migrating from Bootstrap and custom CSS to Tailwind is not just a search-and-replace exercise. The hard part is preserving product intent: spacing, responsive behavior, states, brand colors, shadows, and the little overrides that accumulated while the application was evolving. The companion demo for this post now uses a small CRM dashboard and pricing page instead of a single button or card. That gives us a more realistic migration surface: navigation, hero content, metric cards, status badges, a pipeline list, pricing cards, responsive layout, and custom brand styling. ...

In any software development project, encountering bugs and issues is inevitable. How we approach these problems often distinguishes a junior developer from a senior one. Today, we’ll walk through a more complex and challenging issue in an Angular project and compare how a junior and a senior developer might handle it. Companion resource Companion Project Try the working example in your browser or inspect the full source code behind this article. github.com/omidfarhang/example-projects/examples/angular-dynamic-form-debugging Open live demo View on GitHub The Issue Our Angular application is supposed to display a dynamic form based on metadata fetched from an API. The form structure is defined in the metadata, which includes information about the fields, their types, and validation rules. Despite the metadata being correctly fetched and parsed, the form does not render correctly, and the validation rules are not applied. ...

The senior frontend map is the baseline. You still need that list. This post is the rest of the slice: the names you will meet on the other side of the contract, and what changes when you own both sides of a bug at 2 a.m. I am a frontend-shaped senior who has crossed that line more than once. Years ago that looked like leaving a Laravel API and an AngularJS client for Spring Boot and Angular. The useful lesson was not “learn Java.” It was how much of the job lives in the seam. ...

If you are early in the job, you need names. You cannot aim at a skill you have never heard of. Roadmap.sh is still the best public map of those names. Use it. What it cannot tell you is the altitude. A mid who can list Vite, Playwright, TypeScript generics, and a state library is still a mid if the work they own is a ticket. Senior is the size of the thing you can be handed, and what happens to it. ...

As an Angular developer, staying updated with the latest trends in frontend development is crucial for keeping your skills relevant and your projects modern. The frontend landscape is constantly evolving, and embracing these trends can help you create better-performing, more maintainable, and more engaging applications. Here are some of the latest trends you should be aware of: 1. Micro Frontends Micro Frontends are gaining significant traction as they allow large applications to be divided into smaller, manageable pieces, each developed and deployed independently. This approach enhances scalability and team productivity, especially in large organizations. Micro Frontends. ...

Managing multiple Angular projects can be a daunting task, especially as teams grow and codebases become more complex. In this article, we’ll explore three common approaches for managing multiple Angular projects: Micro Frontends, Monorepo, and Reusable Shared Module. We’ll compare their advantages, disadvantages, and suitability for different scenarios to help you make an informed decision for your Angular projects. Micro Frontends Consider a large e-commerce platform comprising several distinct sections, including product catalog, shopping cart, checkout, and user profile. With micro frontends, each section can be developed and deployed independently as a separate micro frontend. This enables different teams to work autonomously on their respective sections, improving development speed, scalability, and flexibility. ...

In Angular development, creating reusable shared modules is a powerful way to encapsulate common functionality, UI components, services, and styles that can be used across different projects or repositories. In this guide, we’ll walk through the process of creating a reusable shared module from scratch, covering directory structures, component/service/directive creation, shared styles, and both development (npm link) and production (npm publish) use cases. Companion resource Companion Project Try the working example in your browser or inspect the full source code behind this article. github.com/omidfarhang/example-projects/examples/angular-shared-library-workspace Open live demo View on GitHub Step 1: Generate a Library The first step is to generate an Angular library project within your workspace using the Angular CLI: ...

This is the companion for Why and How. It proves one thing: a host page can load separately built Angular and React bundles as custom elements, pass a message attribute down, and take a microfrontend:message event back. It does not prove Module Federation, independent production deploys, or a shared design system. npm run dev builds the remotes, then starts one Qwik server that serves them from public/mfes/. Rust WebAssembly is a shell helper for CPU work, not a fourth micro frontend. ...