# patrickjs/angular-webpack-starter

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/patrickjs-angular-webpack-starter).**

10,221 stars · 4,724 forks · JavaScript · MIT

## Links

- GitHub: https://github.com/PatrickJS/angular-webpack-starter
- awesome-repositories: https://awesome-repositories.com/repository/patrickjs-angular-webpack-starter.md

## Topics

`angular` `mfe` `microfrontend` `microfrontends` `typescript` `webpack`

## Description

This project is a pre-configured development boilerplate for building applications using the Angular framework and the Webpack module bundler. It provides a standardized environment that integrates a dockerized development setup to ensure consistent build and execution across different operating systems.

The blueprint includes a production pipeline focused on frontend performance, utilizing ahead-of-time compilation and lazy loading to reduce bundle sizes. It also incorporates a built-in Sass styling integration to process SCSS files into CSS and an automated testing suite with integration for external code quality analysis servers.

The broader capability surface covers local development utilities such as a development server with hot module replacement and a custom Webpack configuration for advanced asset optimization. It also provides a framework for executing unit and end-to-end tests.

## Tags

### Web Development

- [Project Bootstrapping](https://awesome-repositories.com/f/web-development/angular-application-frameworks/project-bootstrapping.md) — Provides a pre-configured boilerplate and scaffolding to accelerate the initialization of new Angular applications. ([source](https://github.com/patrickjs/angular-webpack-starter#readme))
- [Frontend Performance Optimization](https://awesome-repositories.com/f/web-development/frontend-performance-optimization.md) — Implements ahead-of-time compilation and lazy loading to minimize bundle sizes and improve production load speeds.
- [Lazy Loading](https://awesome-repositories.com/f/web-development/lazy-loading.md) — Implements route-level code splitting to defer the loading of application modules until they are specifically requested.
- [Lazy Loading Strategies](https://awesome-repositories.com/f/web-development/performance-optimizations/lazy-loading-strategies.md) — Implements lazy loading strategies to defer the loading of components and reduce initial bundle size. ([source](https://github.com/patrickjs/angular-webpack-starter#readme))

### Development Tools & Productivity

- [Angular Build Runners](https://awesome-repositories.com/f/development-tools-productivity/build-tooling/build-orchestration-logic/build-orchestration-configuration/build-lifecycle-orchestrators/build-task-runners/angular-build-runners.md) — Ships as a pre-configured development environment combining the Angular framework with optimized Webpack build runners.
- [Module Bundling](https://awesome-repositories.com/f/development-tools-productivity/source-bundling/module-bundling.md) — Utilizes Webpack to bundle JavaScript and style assets into optimized files based on a dependency graph.
- [Template Compilation Tools](https://awesome-repositories.com/f/development-tools-productivity/build-tooling/template-compilation-tools/template-compilation-tools.md) — Implements a build-time process that transforms HTML templates into optimized JavaScript render functions to improve browser performance.
- [Sass Compilers](https://awesome-repositories.com/f/development-tools-productivity/build-tooling/template-compilation-tools/template-compilation-tools/sass-compilers.md) — Includes a build pipeline that compiles SCSS files into standard CSS for production use.
- [Stylesheet Compilation](https://awesome-repositories.com/f/development-tools-productivity/build-tooling/template-compilation-tools/template-compilation-tools/sass-compilers/stylesheet-compilation.md) — Compiles styles from dedicated directories into external CSS files to be embedded in production builds. ([source](https://github.com/patrickjs/angular-webpack-starter#readme))
- [Custom Build Configurations](https://awesome-repositories.com/f/development-tools-productivity/webpack-asset-generators/custom-build-configurations.md) — Features a custom Webpack configuration to handle advanced asset optimization and specialized style compilation.

### DevOps & Infrastructure

- [Production Asset Optimizations](https://awesome-repositories.com/f/devops-infrastructure/cicd-pipeline-automation/core-build-engines/build-optimization/production-asset-optimizations.md) — Implements production asset optimizations including unused code removal and AOT compilation to accelerate page loads. ([source](https://github.com/patrickjs/angular-webpack-starter#readme))
- [Frontend Asset Pipelines](https://awesome-repositories.com/f/devops-infrastructure/production-deployment-tools/frontend-asset-pipelines.md) — Provides a production pipeline for optimizing and packaging client-side assets including AOT compilation and bundle size reduction.
- [Automated Quality Assurance Suites](https://awesome-repositories.com/f/devops-infrastructure/continuous-integration/automated-quality-assurance-suites.md) — Integrates unit and end-to-end test suites with external quality monitoring servers to maintain code standards.

### Testing & Quality Assurance

- [TypeScript Static Analysis](https://awesome-repositories.com/f/testing-quality-assurance/code-quality-review/code-quality-tools/formatting-and-linting-pipelines/javascript-and-typescript-toolchains/typescript-linting-plugins/typescript-static-analysis.md) — Integrates a TypeScript compiler to perform static analysis and enforce type safety before bundling assets.
- [End-to-End Testing Suites](https://awesome-repositories.com/f/testing-quality-assurance/software-testing/testing-frameworks/end-to-end-testing-suites.md) — Ships an automated testing system for executing both unit tests and end-to-end test suites. ([source](https://github.com/patrickjs/angular-webpack-starter#readme))
- [Integrated Testing Suites](https://awesome-repositories.com/f/testing-quality-assurance/software-testing/testing-frameworks/end-to-end-testing-suites/integrated-testing-suites.md) — Provides a holistic testing framework that integrates both unit and end-to-end test layers for comprehensive verification.