3 |
4 | TechStack
3 |
4 | TechStack
package.json file and having it generate a beautiful bar of tech logos from your dependancies which you can then use in your README.md file. Logos provided by Logos.
14 |
15 | ## Development server
16 |
17 | Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
18 |
19 | ## Code scaffolding
20 |
21 | 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`.
22 |
23 | ## Build
24 |
25 | Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
26 |
27 | ## Running unit tests
28 |
29 | Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
30 |
31 | ## Running end-to-end tests
32 |
33 | Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
34 |
35 | ## Further help
36 |
37 | To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
38 |
--------------------------------------------------------------------------------
/angular.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3 | "version": 1,
4 | "newProjectRoot": "projects",
5 | "projects": {
6 | "techstack": {
7 | "projectType": "application",
8 | "schematics": {
9 | "@schematics/angular:component": {
10 | "inlineTemplate": true,
11 | "inlineStyle": true,
12 | "style": "sass"
13 | },
14 | "@schematics/angular:application": {
15 | "strict": true
16 | }
17 | },
18 | "root": "",
19 | "sourceRoot": "src",
20 | "prefix": "app",
21 | "architect": {
22 | "build": {
23 | "builder": "@angular-devkit/build-angular:browser",
24 | "options": {
25 | "outputPath": "dist/techstack",
26 | "index": "src/index.html",
27 | "main": "src/main.ts",
28 | "polyfills": "src/polyfills.ts",
29 | "tsConfig": "tsconfig.app.json",
30 | "aot": true,
31 | "assets": [
32 | "src/favicon.ico",
33 | "src/assets"
34 | ],
35 | "styles": [
36 | "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
37 | "src/styles.scss"
38 | ],
39 | "scripts": []
40 | },
41 | "configurations": {
42 | "production": {
43 | "fileReplacements": [
44 | {
45 | "replace": "src/environments/environment.ts",
46 | "with": "src/environments/environment.prod.ts"
47 | }
48 | ],
49 | "optimization": true,
50 | "outputHashing": "all",
51 | "sourceMap": false,
52 | "namedChunks": false,
53 | "extractLicenses": true,
54 | "vendorChunk": false,
55 | "buildOptimizer": true,
56 | "budgets": [
57 | {
58 | "type": "initial",
59 | "maximumWarning": "500kb",
60 | "maximumError": "1mb"
61 | },
62 | {
63 | "type": "anyComponentStyle",
64 | "maximumWarning": "2kb",
65 | "maximumError": "4kb"
66 | }
67 | ]
68 | }
69 | }
70 | },
71 | "serve": {
72 | "builder": "@angular-devkit/build-angular:dev-server",
73 | "options": {
74 | "browserTarget": "techstack:build"
75 | },
76 | "configurations": {
77 | "production": {
78 | "browserTarget": "techstack:build:production"
79 | }
80 | }
81 | },
82 | "extract-i18n": {
83 | "builder": "@angular-devkit/build-angular:extract-i18n",
84 | "options": {
85 | "browserTarget": "techstack:build"
86 | }
87 | },
88 | "test": {
89 | "builder": "@angular-devkit/build-angular:karma",
90 | "options": {
91 | "main": "src/test.ts",
92 | "polyfills": "src/polyfills.ts",
93 | "tsConfig": "tsconfig.spec.json",
94 | "karmaConfig": "karma.conf.js",
95 | "assets": [
96 | "src/favicon.ico",
97 | "src/assets"
98 | ],
99 | "styles": [
100 | "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
101 | "src/styles.sass"
102 | ],
103 | "scripts": []
104 | }
105 | },
106 | "lint": {
107 | "builder": "@angular-devkit/build-angular:tslint",
108 | "options": {
109 | "tsConfig": [
110 | "tsconfig.app.json",
111 | "tsconfig.spec.json",
112 | "e2e/tsconfig.json"
113 | ],
114 | "exclude": [
115 | "**/node_modules/**"
116 | ]
117 | }
118 | },
119 | "e2e": {
120 | "builder": "@angular-devkit/build-angular:protractor",
121 | "options": {
122 | "protractorConfig": "e2e/protractor.conf.js",
123 | "devServerTarget": "techstack:serve"
124 | },
125 | "configurations": {
126 | "production": {
127 | "devServerTarget": "techstack:serve:production"
128 | }
129 | }
130 | }
131 | }
132 | }
133 | },
134 | "defaultProject": "techstack",
135 | "schematics": {
136 | "@schematics/angular:component": {
137 | "styleext": "scss"
138 | }
139 | }
140 | }
--------------------------------------------------------------------------------
/e2e/protractor.conf.js:
--------------------------------------------------------------------------------
1 | // @ts-check
2 | // Protractor configuration file, see link for more information
3 | // https://github.com/angular/protractor/blob/master/lib/config.ts
4 |
5 | const { SpecReporter, StacktraceOption } = require('jasmine-spec-reporter');
6 |
7 | /**
8 | * @type { import("protractor").Config }
9 | */
10 | exports.config = {
11 | allScriptsTimeout: 11000,
12 | specs: [
13 | './src/**/*.e2e-spec.ts'
14 | ],
15 | capabilities: {
16 | browserName: 'chrome'
17 | },
18 | directConnect: true,
19 | SELENIUM_PROMISE_MANAGER: false,
20 | baseUrl: 'http://localhost:4200/',
21 | framework: 'jasmine',
22 | jasmineNodeOpts: {
23 | showColors: true,
24 | defaultTimeoutInterval: 30000,
25 | print: function() {}
26 | },
27 | onPrepare() {
28 | require('ts-node').register({
29 | project: require('path').join(__dirname, './tsconfig.json')
30 | });
31 | jasmine.getEnv().addReporter(new SpecReporter({
32 | spec: {
33 | displayStacktrace: StacktraceOption.PRETTY
34 | }
35 | }));
36 | }
37 | };
--------------------------------------------------------------------------------
/e2e/src/app.e2e-spec.ts:
--------------------------------------------------------------------------------
1 | import { AppPage } from './app.po';
2 | import { browser, logging } from 'protractor';
3 |
4 | describe('workspace-project App', () => {
5 | let page: AppPage;
6 |
7 | beforeEach(() => {
8 | page = new AppPage();
9 | });
10 |
11 | it('should display welcome message', async () => {
12 | await page.navigateTo();
13 | expect(await page.getTitleText()).toEqual('techstack app is running!');
14 | });
15 |
16 | afterEach(async () => {
17 | // Assert that there are no errors emitted from the browser
18 | const logs = await browser.manage().logs().get(logging.Type.BROWSER);
19 | expect(logs).not.toContain(jasmine.objectContaining({
20 | level: logging.Level.SEVERE,
21 | } as logging.Entry));
22 | });
23 | });
24 |
--------------------------------------------------------------------------------
/e2e/src/app.po.ts:
--------------------------------------------------------------------------------
1 | import { browser, by, element } from 'protractor';
2 |
3 | export class AppPage {
4 | async navigateTo(): PromiseREADME.md file. Logos provided by
9 | SVG Logos.
10 | package.json below
14 | Readme.md file
22 | {{ img.name }}
60 |