15 comments found.
hi , i want to buy if you answer my question, do you have road map? share if possible? do you have a plan token refresh mechanism implementation? if yes , time frame, i will buy and wait for that …
Hi, your app is great but after adding dependencies “ng2-chartjs2” and start npm I see these errors / warnings, some solutions? thanks
Following previous comments I added ng2-chartjs2 to dependencies.
While I manage to compile it successfully, only SPLASH PAGE IS LOADING: Cloud First Serverless App Template
How do I load the content and set AWS Cognito variables?
Hello. You need to set the Cognito settings in the global-cognito-util.service.ts file
HI,
There is another test I run on WINDOWS 10 using the latest download for Windows 7.10. from nodejs.org
After installing the node-v7.10.0-x64.msi I unzipped your files in filder and run: npm install
subsequently I run:
ng serve
THE FOLLOWING ERRORS OCCUR:
| +—rxjs@5.0.0-beta.12 | +—systemjs@0.19.40 | | `—when@3.7.8 | `—zone.js@0.7.4 +—web-animations-js@2.2.5 `—zone.js@0.7.8
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.0.0 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.1: wanted {os“} (current: {os“})
npm WARN ng-bootstrap/<redpre#7> requires a peer of @angular/core
4.0.3 but none was installed.
npm WARN ng-bootstrap/<redpre#8> requires a peer of @angular/common
4.0.3 but none was installed.
npm WARN ng-bootstrap/<redpre#9> requires a peer of @angular/forms
4.0.3 but none was installed.
npm WARN angular/<redpre#10> requires a peer of typescript
2.1.5 but none was installed.
npm WARN tsickle@0.21.6 requires a peer of typescript@2.1.0 but none was installed.
C:\Users\Robd\Downloads\norb\serverless> C:\Users\Robd\Downloads\norb\serverless> C:\Users\Robd\Downloads\norb\serverless>ng serve Your global Angular CLI version (1.0.2) is greater than your local version (1.0.0-rc.2). The local Angular CLI version is used.
To disable this warning use “ng set—global warnings.versionMismatch=false”.- NG Live Development Server is running on http://localhost:4200 ** Hash: b870e567c22c1209677c Time: 16126ms chunk {0} main.bundle.js, main.bundle.js.map (main) 227 kB {3} initial chunk {1} styles.bundle.js, styles.bundle.js.map (styles) 307 kB {4} initial chunk {2} scripts.bundle.js, scripts.bundle.js.map (scripts) 208 kB {4} initial chunk {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 4.24 MB initial chunk {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes entry
ERROR in Error encountered resolving symbol values statically. Could not resolve ng2-chartjs2 relative to C:/Users/Robd/Downloads/norb/serverless/src/app/features/basic-charts/basic-charts.module.ts., resolving symbol BasicChartsModule in C:/Users/Robd/Downloads/norb/serverless/src/app/features/basic-charts/basic-charts.module.ts, resolving symbol BasicChartsModule in C:/Users/Robd/Downloads/norb/serverless/src/app/features/basic-charts/basic-charts.module.ts
ERROR in C:/Users/Robd/Downloads/norb/serverless/src/app/features/basic-charts/basic-charts.module.ts (3,37): Cannot find module ‘ng2-chartjs2’.)
ERROR in ./src/app/features/basic-charts/basic-charts.module.ts Module not found: Error: Can’t resolve ‘ng2-chartjs2’ in ‘C:\Users\Robd\Downloads\norb\serverless\src\app\features\basic-charts’ @ ./src/app/features/basic-charts/basic-charts.module.ts 12:0-46 @ ./src/app/features/basic-charts/index.ts @ ./src/app/app.module.ts @ ./src/app/index.ts @ ./src/main.ts @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts
ERROR in C:/Users/Robd/Downloads/norb/serverless/src/app/features/basic-charts/basic-bar-chart/basic-bar-chart.component.ts (2,37): Cannot find module ‘ng2-chartjs2’.)
ERROR in C:/Users/Robd/Downloads/norb/serverless/src/app/features/basic-charts/basic-line-chart/basic-line-chart.component.ts (2,37): Cannot find module ‘ng2-chartjs2’.)
ERROR in C:/Users/Robd/Downloads/norb/serverless/src/app/features/basic-charts/basic-bubble-chart/basic-bubble-chart.component.ts (2,37): Cannot find module ‘ng2-chartjs2’.) webpack: Failed to compile.
What is the solution?
Hello. I am glad you were able to compile after adding ng2-chartjs2 to the dependencies
HI,
I’m running into problems, it looks like you are using OLD version of ANGULAR CLI, How can this be resolved? Your global Angular CLI version (1.0.2) is greater than your local version (1.0.0-rc.2). The local Angular CLI version is used.
ng serve --host 0.0.0.0 --port 4201
To disable this warning use “ng set—global warnings.versionMismatch=false”.
- NG Live Development Server is running on http://0.0.0.0:4201 ** Hash: de7f5640497e3258fc03 Time: 20027ms chunk {0} main.bundle.js, main.bundle.js.map (main) 223 kB {3} initial chunk {1} styles.bundle.js, styles.bundle.js.map (styles) 307 kB {4} initial chunk {2} scripts.bundle.js, scripts.bundle.js.map (scripts) 208 kB {4} initial chunk {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 4.23 MB initial chunk {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes entry
ERROR in Error encountered resolving symbol values statically. Could not resolve ng2-chartjs2 relative to /var/www/html/cognitorangular/src/app/features/basic-charts/basic-charts.module.ts., resolving symbol BasicChartsModule in /var/www/html/cognitorangular/src/app/features/basic-charts/basic-charts.module.ts, resolving symbol BasicChartsModule in /var/www/html/cognitorangular/src/app/features/basic-charts/basic-charts.module.ts
ERROR in /var/www/html/cognitorangular/src/app/features/basic-charts/basic-charts.module.ts (3,37): Cannot find module ‘ng2-chartjs2’.)
ERROR in ./src/app/features/basic-charts/basic-charts.module.ts Module not found: Error: Can’t resolve ‘ng2-chartjs2’ in ’/var/www/html/cognitorangular/src/app/features/basic-charts’ @ ./src/app/features/basic-charts/basic-charts.module.ts 12:0-46 @ ./src/app/features/basic-charts/index.ts @ ./src/app/app.module.ts @ ./src/app/index.ts @ ./src/main.ts @ multi webpack-dev-server/client?http://0.0.0.0:4201 ./src/main.ts
ERROR in /var/www/html/cognitorangular/src/app/features/basic-charts/basic-bar-chart/basic-bar-chart.component.ts (2,37): Cannot find module ‘ng2-chartjs2’.)
ERROR in /var/www/html/cognitorangular/src/app/features/basic-charts/basic-line-chart/basic-line-chart.component.ts (2,37): Cannot find module ‘ng2-chartjs2’.)
ERROR in /var/www/html/cognitorangular/src/app/features/basic-charts/basic-bubble-chart/basic-bubble-chart.component.ts (2,37): Cannot find module ‘ng2-chartjs2’.) webpack: Failed to compile.
Hi, you should update the Angular CLI version from in the package.json. Follow the steps outline on the Angular CLI Github https://github.com/angular/angular-cli#updating-angular-cli
This template is great. The question I have is, If I purchase this would it be possible to integrate this with firebase instead of AWS? I have good knowledge of AngularJS2 and Firebase.
The membership module uses AWS, and its tightly integrated with the template. The idea is that you would seamlessly use other AWS services by using the integrated membership module as the foundation.
For this template, I would recommend using AWS services, instead of Firebase
For example:- Map the authenticated user’s ID to a hash key in DynamoDB to retrieve, update, delete items on behalf of that user
- Create an S3 bucket for a specific user based on their authenticated credentials
- Restrict access to API Gateway based on the authenticated user by using your User Pool as a custom authorizer
- etc.
THANK YOU FOR QUICK SUPPORT, I just needed to add “ng2-chartjs2”: “^1.0.3”, to package.json to get webpack to compile. AWESOME SUPPORT, Thanks!!!
It looks like the package.json was missing some dependencies after the Angular CLI update. An update is pending with the fixes, but private message me and I can send you a link to the updated files. Get yours working correctly by:
- Cleaning out your node_modules cache as described here: https://github.com/angular/angular-cli#updating-angular-cli
- Replace your package.json with the following:
{ "name": "cloud-first-serverless-app-kit", "version": "1.0.0", "license": "None", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/common": "^2.4.0", "@angular/compiler": "^2.4.0", "@angular/core": "^2.4.0", "@angular/forms": "^2.4.0", "@angular/http": "^2.4.0", "@angular/platform-browser": "^2.4.0", "@angular/platform-browser-dynamic": "^2.4.0", "@angular/router": "^3.4.0", "@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.18", "angular-calendar": "^0.6.2", "angular-sortablejs": "^1.3.1", "angular2-infinite-scroll": "^0.2.8", "angular2-masonry": "^0.4.0", "angular2-signaturepad": "^2.2.0", "angular2-simple-countdown": "0.0.6", "aws-sdk": "^2.7.19", "bootstrap": "^4.0.0-alpha.6", "chart.js": "^2.4.0", "core-js": "^2.4.1", "font-awesome": "^4.7.0", "hammerjs": "^2.0.8", "localforage": "^1.4.3", "lodash": "^4.17.3", "moment": "^2.16.0", "ng2-img-cropper": "^0.7.7", "reflect-metadata": "^0.1.9", "rxjs": "^5.2.0", "uuid": "^3.0.1", "videogular2": "^3.2.1", "web-animations-js": "^2.2.2", "zone.js": "^0.7.6" }, "devDependencies": { "@angular/cli": "1.0.0-rc.2", "@angular/compiler-cli": "^2.4.0", "@types/jasmine": "2.5.38", "@types/node": "~6.0.60", "codelyzer": "~2.0.0", "jasmine-core": "~2.5.2", "jasmine-spec-reporter": "~3.2.0", "karma": "~1.4.1", "karma-chrome-launcher": "~2.0.0", "karma-cli": "~1.0.1", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "karma-coverage-istanbul-reporter": "^0.2.0", "protractor": "~5.1.0", "ts-node": "~2.0.0", "tslint": "~4.5.0", "typescript": "~2.0.0" } }
Let me know if you have any other issues with setting up your environment. I do recommend Visual Studio code, as it handles Typescript (used by Angular 2+) well.
You might see peer dependency warnings during the setup: You can either 1. ignore those warnings because the dependencies are being installed 2. or install the dependencies first, separately
The update has been approved and you should have received the updated package.
I had following installation problems: > node -v v7.7.4
> npm -v 4.1.2
> npm install -g @angular/cli This was OK, no errors
> npm install
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\ch
okidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@
1.1.1: wanted {os“} (current: {os“}
)
npm WARN codelyzer@1.0.0-beta.4 requires a peer of angular/compiler
2.2.0 but
none was installed.
npm WARN codelyzer@1.0.0-beta.4 requires a peer of angular/core
2.2.0 but none
was installed.
> ng serve ... C:/Users/me/WebstormProjects/angular2envato/node_modules/@types/lodash/index.d.t s (19339,21): Cannot find namespace ’_’. C:/Users/me/WebstormProjects/angular2envato/node_modules/@types/lodash/index.d.t s (19507,15): All declarations of ‘WeakMap’ must have identical type parameters.
C:/Users/me/WebstormProjects/angular2envato/node_modules/@types/lodash/index.d.t s (19507,33): Cannot find name ‘object’. webpack: Failed to compile.
Firefox browser localhosst 4200 cannot GET /
This looks like it might be a problem with your IDE configuration and how it is handling typings. Have you tried building in a different IDE, such as VS Code?
I suggest you try that and see if you still experience issues.
Looking into this…
HI,
I’ve installed your script with node 6.10.0 and npm 3.10.10 as per latest Windows 10 installation.
However there are errors in your script as described below. Please advise:
I installed on my Windows 10 machine the current NODE:
1) downloaded and installed NODE:
https://nodejs.org/dist/v6.10.0/node-v6.10.0-x64.msinode -v v6.10.0
npm -v 3.10.10
========
2) opened CMD and installed angular/cli as per https://cli.angular.io/:
npm install -g @angular/cli
===========
3) in your folder, on my server: C:\Users\Robd\Desktop\serverless\cloud-first-serverless-app-kit
npm install
all looked OK, but at the bottom was: npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\@angular\cli\node_modules\chokidar\node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.1: wanted {os“} (current: {os“})
4) ng serve
C:\Users\Robd\Desktop\serverless\cloud-first-serverless-app-kit>ng serve The package “angular-cli” has been renamed to ”@angular/cli”. The old package will be deprecated soon.
Please take the following steps to avoid issues: “npm uninstall—save angular-cli” “npm uninstall—save-dev angular-cli” “npm install—save-dev @angular/cli@latest”
Environment configuration does not contain “environmentSource” entry.
A new environmentSource entry replaces the previous source entry inside environments.
To migrate angular-cli.json follow the example below:
Before:
“environments”: { “source”: “environments/environment.ts”, “dev”: “environments/environment.ts”, “prod”: “environments/environment.prod.ts” }
After:
“environmentSource”: “environments/environment.ts”, “environments”: { “dev”: “environments/environment.ts”, “prod”: “environments/environment.prod.ts” }
FOLLOWING THE SUGGESTION ABOVE I CHANGED:
Before:
“environments”: { “source”: “environments/environment.ts”, “dev”: “environments/environment.ts”, “prod”: “environments/environment.prod.ts” }
After:
“environmentSource”: “environments/environment.ts”, “environments”: { “dev”: “environments/environment.ts”, “prod”: “environments/environment.prod.ts” }
5) than results for : npm install
| | | `—tmp@0.0.24 | | `—source-map-support@0.4.14 | | `—source-map@0.5.6 | +—tslint@3.15.1 | | `—underscore.string@3.3.4 | `—UNMET PEER DEPENDENCY webpack@2.1.0-beta.25 +—UNMET PEER DEPENDENCY rxjs@5.0.1 `—UNMET PEER DEPENDENCY zone.js@0.6.26
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.0.0 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.1: wanted {os“} (current: {os“})
npm WARN angular/<redpre#8> requires a peer of rxjs
5.0.1 but none was installed.
npm WARN angular/<redpre#9> requires a peer of zone.js
0.7.2 but none was installed.
npm WARN angular/<redpre#10> requires a peer of rxjs
5.0.1 but none was installed.
npm WARN angular/<redpre#11> requires a peer of rxjs
5.0.1 but none was installed.
npm WARN ngtools/<redpre#12> requires a peer of webpack
2.2.0 but none was installed.
npm WARN codelyzer@1.0.0-beta.4 requires a peer of angular/compiler
2.2.0 but none was installed.
npm WARN codelyzer@1.0.0-beta.4 requires a peer of angular/core
2.2.0 but none was installed.
npm WARN extract-text-webpack-plugin@2.1.0 requires a peer of webpack@2.2.0 but none was installed.
6) ng serve
C:\Users\Robd\Desktop\serverless\cloud-first-serverless-app-kit>ng serve The package “angular-cli” has been renamed to ”@angular/cli”. The old package will be deprecated soon.
Please take the following steps to avoid issues: “npm uninstall—save angular-cli” “npm uninstall—save-dev angular-cli” “npm install—save-dev @angular/cli@latest”
- NG Live Development Server is running on http://localhost:4200 ** Hash: a628c0b6c9ca0ee7881c Time: 7126ms chunk {0} styles.bundle.js, styles.bundle.js.map (styles) 308 kB {4} initial chunk {1} main.bundle.js, main.bundle.js.map (main) 58.8 kB {3} initial chunk {2} scripts.bundle.js, scripts.bundle.js.map (scripts) 208 kB {4} initial chunk {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 176 kB initial chunk {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes entry
ERROR in ./src/main.ts Module build failed: TypeError: Cannot read property ‘newLine’ of undefined at Object.getNewLineCharacter (C:\Users\Robd\Desktop\serverless\cloud-first-serverless-app-kit\node_modules\typescript\lib\typescript.js:8062:20) at Object.createCompilerHost (C:\Users\Robd\Desktop\serverless\cloud-first-serverless-app-kit\node_modules\typescript\lib\typescript.js:44978:26) at Object.ngcLoader (C:\Users\Robd\Desktop\serverless\cloud-first-serverless-app-kit\node_modules\@ngtools\webpack\src\loader.js:338:33) @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts webpack: Failed to compile.
Could you please update your script to work with the latest versions of node, angular-cli?
npm install -g @angular/cli
node -v v6.10.0
npm -v 3.10.10
What would be the easiest way of using the COGNITO login with pure JavaScript?
I tried to work it out at: http://52.16.112.15/cognito4/
Would you be able to advise the best approach for JavaScript only login with Cognito?
Thank you.
Hello I am glad you were able to get it installed with your current version of Node and NPM. I have updated the tooling to account for the latest version of the angular CLI which is 1.0.0-rc.2. You should upgrade your Node version to the latest 7.4.0, and npm to 3.10.5 to avoid any issues with tooling.
I am submitting the attached update to Code Canyon.
Regarding Cognito, everything you need to setup registration, login, password recovery, etc is already configured in the template code. When you are ready to build out user data operations using the tokens retrieved from Cognito, I recommend looking into the documentation.http://docs.aws.amazon.com/cognito/latest/developerguide/using-amazon-cognito-user-identity-pools-javascript-examples.html
Hi, actually 6.10.0 FAILED TO COMPILE: ERROR in ./src/main.ts Module build failed: TypeError: Cannot read property ‘newLine’ of undefined at Object.getNewLineCharacter (C:\Users\Robd\Desktop\serverless\cloud-first-serverless-app-kit\node_modules\typescript\lib\typescript.js:8062:20) at Object.createCompilerHost (C:\Users\Robd\Desktop\serverless\cloud-first-serverless-app-kit\node_modules\typescript\lib\typescript.js:44978:26) at Object.ngcLoader (C:\Users\Robd\Desktop\serverless\cloud-first-serverless-app-kit\node_modules\@ngtools\webpack\src\loader.js:338:33) @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts webpack: Failed to compile.
Is there any way of using NODE 6.10.0 and NPM 3.10.0 with your script?
I understand your error above, but I don’t believe the issue is the node version. The update is working after updating the config and updating to the latest version of the CLI.
If you cannot wait for the update, try following the steps here to update the angular-cli version to the latest release https://github.com/angular/angular-cli#updating-angular-cli
Regarding the node version, the Angular team recommends using the latest version of node for development. Remember node is only used for design time tooling. If you are using Node as a back-end server, you can use whatever version you like. The node version here is only applicable to properly building and packaging the front end app.
I have everything else up and running and accepting membership, but how can I get the membership to work so that only logged in members can view content?
You should take a look at Angular 2 navigation, specifically the navigation guards on components: https://angular.io/docs/ts/latest/guide/router.html#!#can-activate-guard
Also, have a look at how to retrieve a user with AWS Cognito User pools. Once you have the user, you can verify the session, then show the content.
http://docs.aws.amazon.com/cognito/latest/developerguide/using-amazon-cognito-user-identity-pools-javascript-examples.htmlIs the project build with Angular CLI?
Yes, the latest version of Angular CLI. Also, each feature is standalone with its own ng module and router module.
GLWS!
Thanks!
Dream on and achieve on. DigitalCenturySF
Thanks!