Skip to content

A boilerplate for modern web apps using Angular 19 with Bootstrap, Angular Material, and NgRx for responsive, stateful UIs. Back-end is powered by Spring Boot with a RESTful JSON API. Features include modular architecture and advanced table handling with ngx-datatable

License

Notifications You must be signed in to change notification settings

hofiorg/angular-boilerplate

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

64 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

angular-boilerplate

Angular Bootstrap NgRx Spring Boot License: MIT node_js workflow maven workflow

πŸ“‹ Overview

πŸ”§ Technologies Used

Technology Purpose Documentation
Angular 19 Base Framework https://angular.dev/
Bootstrap v5.3 Grid System https://getbootstrap.com/docs/5.3/layout/grid/#how-it-works
NgRx State Handling https://ngrx.io/
Angular Material Components https://material.angular.io/components/categories
ngx-datatable Table Component http://swimlane.github.io/ngx-datatable/
Spring Boot
(REST + JSON)
Server https://spring.io/projects/spring-boot

πŸ“– Project Description

A boilerplate for modern web apps using Angular 19 with Bootstrap, Angular Material, and NgRx for responsive, stateful UIs. Back-end is powered by Spring Boot with a RESTful JSON API. Features include modular architecture and advanced table handling with ngx-datatable.

🚦 Getting Started

πŸ› οΈ Prerequisites

  • Node.js / npm (or nvm instructions)
  • Java (JDK)
  • Maven

πŸ“₯ Installation

Install node/npm

nvm install lts/jod
nvm use lts/jod
nvm alias default lts/jod

Install Angular Command Line Interface (CLI)

npm install -g @angular/cli

Install Java

Install Java with Homebrew (MacOS)
brew install openjdk
sudo ln -sfn $HOMEBREW_PREFIX/opt/openjdk/libexec/openjdk.jdk /Library/Java/JavaVirtualMachines/openjdk.jdk

Install Maven

Install Maven with Homebrew (MacOS)
brew install maven

πŸš€ Development

πŸ–₯️ Frontend

Installing the Project Dependencies

Run 01_install_fe.sh to install the frontend dependencies (via npm install).

cd src/main/scripts
01_install_fe.sh

Running the Dev Server

Run 02_start_fe_dev_server.sh for a frontend development server. Navigate to http://localhost:4200/. The application will automatically reload if you change any of the source files.

cd src/main/scripts
02_start_fe_dev_server.sh

Running Unit Tests

Run 03_test_fe.sh to execute the frontend unit tests via Karma.

cd src/main/scripts
03_test_fe.sh

πŸ—„οΈ Backend

Installing the Server

Run 10_install_server.sh to install the server project. This runs mvn clean install.

cd src/main/scripts
10_install_server.sh

Testing the Server

Run 11_test_server.sh to test the server project. This runs mvn test.

cd src/main/scripts
11_test_server.sh

Building the Project

Run 20_build.sh to build the project. The build artifacts will be stored in the target/ directory.

cd src/main/scripts
20_build.sh

Running the Server

Run 30_start_server.sh to start the Spring Boot server with Java.

cd src/main/scripts
30_start_server.sh

πŸ§‘β€πŸ’» Usage

Open in Chrome

Run 40_open_chrome.sh to start Chrome.

cd src/main/scripts
40_open_chrome.sh

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Further help

For more help with the Angular CLI use ng help or go check out the Angular CLI Overview and Command Reference page.

πŸ§ͺ How to create this project

Steps to reproduce

πŸ—’οΈ TODO List

TODO List

About

A boilerplate for modern web apps using Angular 19 with Bootstrap, Angular Material, and NgRx for responsive, stateful UIs. Back-end is powered by Spring Boot with a RESTful JSON API. Features include modular architecture and advanced table handling with ngx-datatable

Topics

Resources

License

Stars

Watchers

Forks