A modern Angular 19 starter using the standalone API with Tailwind CSS 4.1, DaisyUI 5.x, ngx-translate and Chart.js. The project provides a fully standalone UI/UX structure that follows the SRP approach.
- Angular 19 Standalone API
- Tailwind CSS v4.1
- DaisyUI v5.x (theme customizable via
data-theme
) - ngx-translate with dynamic multi-file loader
- Chart.js & ng2-charts
- Signal / Computed / SRP
Clone the repository and install the dependencies:
git clone https://github.com/coundia/topall-angular.git
cd topall-angular
npm install
npm start
The application will be available at http://localhost:4200
.
Command | Description |
---|---|
npm start |
Launch the application |
npm run build |
Build for production |
npm run test |
Run unit tests |
npm run watch |
Rebuild on each modification |
This starter uses @ngx-translate/core
together with MultiTranslateHttpLoader
to load multiple translation files.
Add your translation files as follows:
export function httpLoaderFactory(http: HttpClient) {
return new MultiTranslateHttpLoader(http, [
'general',
'nav',
'notification',
'security',
'errors',
// add your files here
]);
}
DaisyUI supports dynamic themes:
<html data-theme="light">
<!-- or -->
<html data-theme="dark">
<!-- or your custom theme -->
<html data-theme="tenant-theme">
Integration with ng2-charts
and Chart.js
:
import { NgChartsModule } from 'ng2-charts';
Configured with Karma and Jasmine:
npm run test
- Animations and accessibility improvements
Made with ❤️