SB Clean Blog Angular is a free and open-sourced Bootstrap themed Angular 9 starter project.
It shares the same project structure and subset of tooling from our professional offering, SB Admin Pro Angular, so much of the SB Admin Pro Angular Documentation is applicable.
In particular the documentation for Structure, and the documentation for SBPro Schematics
SB Clean Blog Angular comes with a base implementation of navigation and layouts.
For professionally designed components (including an advanced SideNav), 100% code coverage, starter cypress tests and more, please consider our professional offering: SB Admin Pro Angular
Click here for the backend. Built with Node.js, Typescript, Fastify, and TypeORM
Click here to view Angular code coverage
Click here to view Node code coverage
git clone [email protected]:startbootstrap/sb-clean-blog-angular.git
cd sb-clean-blog-angular
npm install
npm start
npm start
should open a browser window to http://localhost:4200
By default angular runs on port 4200. To change this port you can run:
# This starts the development server on port 4205,
# but you can use any port you'd like
export PORT=4205 && npm start
Be sure you have sb-clean-blog-node running.
Navigate to http://localhost:4200/auth/login
Use the password you set in the sb-clean-blog-node
.env file for: DB_ROOT_USER_PASSWORD
npm run test
# To keep the test runner going as you devleop tests use:
npm run test:dev
npm run e2e
# To run against currently running server instead of launching a new server
npm run e2e:running
SB Clean Blog Angular comes with a production ready Dockerfile and build scripts.
You can get Docker here
# Be sure to build the app first
npm run build
# Then build the docker image
npm run docker:build
# Then run the image
npm run docker:run
npm run generate:module -- --path src/modules --name Test
npm run generate:component -- --path src/modules/test/containers --name Test
npm run generate:component -- --path src/modules/test/components --name Test
npm run generate:directive -- --path src/modules/test/directives --name Test
npm run generate:service -- --path src/modules/test/services --name Test
Note: Creating a Component and a Container use the same command, the difference is just the paths and how they are used.
Containers and Components are both Angular Components, but used in different ways.
Containers should arrange Components.
Obviously this can become subjective, but MVCC is the paradigm that we subscribe to.
If you receive memory issues adjust
max_old_space_size
in the ng
command of the package.json
:
"ng": "cross-env NODE_OPTIONS=--max_old_space_size=2048 ./node_modules/.bin/ngngu",
You can adjust 2048 to any number you need.
For more information about why you may need --max_old_space_size
see this article.
Keep in mind that this project only uses node to build the angular application. There is no production dependency on node.