Vifernandez/create frontend structure #12
Conversation
vicmator
requested review from
mduqueoviedo,
usersaurus,
danilupion and
aririmia86
.angular-cli.json
Outdated
| { | ||
| "$schema": "./node_modules/@angular/cli/lib/config/schema.json", | ||
| "project": { | ||
| "name": "frontend" |
There was a problem hiding this comment.
How about somethiing more meaningful? ;)
There was a problem hiding this comment.
What do you mean with "more meaningful"? Really is the name of root frontend code
There was a problem hiding this comment.
I mean "horologium-frontend" or something similar
There was a problem hiding this comment.
I'm sorry, I have confused that with:
"root": "frontend"
.angular-cli.json
Outdated
| "apps": [ | ||
| { | ||
| "root": "frontend", | ||
| "outDir": "dist", |
There was a problem hiding this comment.
I think this should be changed to backed/public
There was a problem hiding this comment.
I think you wanted to say "backend/public"...(typo). It is a joke!! xDD
There was a problem hiding this comment.
Do you think it is necessary to put the path "backend/public" in .gitignore?
.gitignore
Outdated
| @@ -30,6 +30,7 @@ | |||
| npm-debug.log | |||
| testem.log | |||
| /typings | |||
| yarn-error.log | |||
There was a problem hiding this comment.
I'm going to remove, I don't know why this are here. (I was using yarn in another project...)
frontend/app/app.component.html
Outdated
| @@ -0,0 +1,20 @@ | |||
| <!--The content below is only a placeholder and can be replaced.--> | |||
There was a problem hiding this comment.
How about changing this to something not tight to angular?
There was a problem hiding this comment.
I've only changed the title (taitel), and I've put our directory github
There was a problem hiding this comment.
As we agreed yesterday, use this PR to include angular material and add a dummy page with a toolbar or something like this ;)
frontend/index.html
Outdated
| <html lang="en"> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>Frontend</title> |
frontend/tsconfig.app.json
Outdated
| { | ||
| "extends": "../tsconfig.json", | ||
| "compilerOptions": { | ||
| "outDir": "../out-tsc/app", |
There was a problem hiding this comment.
I don't know about the angular build process, so just a question... how does this relate to outDir in .angular-cli.json ?
There was a problem hiding this comment.
Maybe this is not necessary, I removed it
package.json
Outdated
| }, | ||
| "devDependencies": { | ||
| "eslint": "^4.9.0", | ||
| "eslint-config-airbnb-base": "^12.1.0", | ||
| "gulp-watch": "^4.3.11", |
There was a problem hiding this comment.
normally dependencies are listed in alphabetical order, this was moved to the wrong place I think
There was a problem hiding this comment.
This was in a conflict merge. I change it
package.json
Outdated
| "eslint-plugin-import": "^2.8.0", | ||
| "gulp": "github:gulpjs/gulp#4.0", | ||
| "gulp-clean": "^0.3.2", | ||
| "gulp-develop-server": "^0.5.2", | ||
| "gulp-eslint": "^4.0.0", | ||
| "gulp-util": "^3.0.8", | ||
| "gulp-watch": "^4.3.11" | ||
| "@angular/cli": "1.5.0", |
There was a problem hiding this comment.
This was also placed wrong I believe. I think that if you do npm install it will fix these automatically ;)
There was a problem hiding this comment.
I have used this package to sort all dependencies https://github.com/kilianc/npm-sort
There was a problem hiding this comment.
Did you try with what I said? (just wondering if I was right)
There was a problem hiding this comment.
I tried it, but didn't work
package.json
Outdated
| "@angular/router": "^5.0.0", | ||
| "core-js": "^2.4.1", | ||
| "rxjs": "^5.4.1", | ||
| "tslint-config-airbnb": "^5.3.0", |
There was a problem hiding this comment.
at least tslint-config-airbnb should be devDependencies (probably all @angular/* too
There was a problem hiding this comment.
In npm's tslint-config-airbnb web say that we should use "npm install tslint-config-airbnb --save" (https://www.npmjs.com/package/tslint-config-airbnb).
Related to @angular/* dependencies, angular-cli installed it on this way.
What do you think about that?
There was a problem hiding this comment.
I think they just gave a dumb example. In my opinion the whole frontend directory is only for development (thus dependencies it might have should be in dev-dependencies) because I think as port of the npm module "compiled" sources should be generated so that when you install the module you are ready to just run the software
tsconfig.json
Outdated
| { | ||
| "compileOnSave": false, | ||
| "compilerOptions": { | ||
| "outDir": "./dist/out-tsc", |
There was a problem hiding this comment.
Again in doubt regarding output directories... should this be changed too or is it just for temporal artifacts?
|
Firstly, I added Material-Angular (https://material.angular.io/guide/getting-started) with all step that are necessary to make it work. Then, I created a simple components (header) to test the material-angular. On the other hand, I have created a new module only to import all material components that we are going to use. I did that because the principal ngModule will be dirty with all these imports. If you want, I could to explain you how attributes modules works in Angular. Maybe you just know how works. Finally, I tried to remove "polyfills" file, but was imposible because Angular need that to run Zone.js (I tried to delete all dependencies to this file to works). Because of this, I just left the reference to Zone dependency in the polyfills.js |
First structure frontend