Component Development on AI VOID

Chapter 14: Project 2: Developing a Robust Frontend Component with React/Vue and TypeScript

Fri, 05 Dec 2025 00:00:00 +0000

Chapter 14: Project 2: Developing a Robust Frontend Component with React/Vue and TypeScript

Welcome back, future TypeScript master! In our journey so far, we’ve explored the core syntax, advanced types, and even some design patterns. Now, it’s time to put that knowledge into action by building something truly practical and production-ready: a robust frontend component using a popular framework like React (or Vue, the principles are highly transferable!) and, of course, TypeScript.

Component Craft: Angular UI Library Forge - Fast-Track UI Libraries

Tue, 10 Feb 2026 00:00:00 +0000

Component Craft: Angular UI Library Forge - Fast-Track UI Libraries

Angular v18.x, Angular CLI v18.x (as of 2026-02-10)

Workspace & Library Generation

Begin by creating a new Angular monorepo workspace without an initial application, then generate your UI library.

ng new my-ui-workspace --no-create-application --strict --standalone false --routing false --style scss
// Creates a new Angular workspace without a root application.
// --no-create-application: Skips initial app creation.
// --strict: Enables strict type checking.
// --standalone false: Uses NgModules (still common for libraries, though standalone is default for apps).
// --routing false: No routing module.
// --style scss: Preferred stylesheet format.
cd my-ui-workspace
// Navigate into the new workspace directory.
ng generate library my-ui-components --prefix mui --skip-install
// Generates a new library project named 'my-ui-components'.
// --prefix mui: Sets the prefix for generated components (e.g., <mui-button>).
// --skip-install: Skips running npm install after generation (useful for monorepos).

Component Structure & Public API

Organize your library components and expose them through the public-api.ts file, which defines the library’s public interface.

Project Chapter 15.3: Adding New Users with Signal Forms

Wed, 20 Aug 2025 00:00:00 +0000

Project Chapter 15.3: Adding New Users with Signal Forms

Now that we can display our list of users, the next logical step is to allow adding new ones. This is a perfect opportunity to get hands-on with Angular v21’s experimental Signal Forms. We’ll create a UserFormComponent that lets users input details for a new user, validates the input, and then uses our UserService to persist the data.

Remember, Signal Forms are experimental, so the API might evolve, but this will give you valuable experience with this promising feature.