Add a sample that uses standalone components (auth0-samples#359)

Author: frederikprijck

.circleci/config.yml

@@ -24,11 +24,16 @@ jobs:
             - project
             - scripts
   sample-01:
+    parameters:
+      app-directory:
+        type: string
+        default: "Sample-01"
+        description: "The root directory of the application to run"
     machine:
       image: << pipeline.parameters.machine_image >>
     environment:
-      - AUTH0_CFG: Sample-01/auth_config.json
-      - AUTH0_EXAMPLE_CFG: Sample-01/auth_config.json.example
+      - AUTH0_CFG: <<parameters.app-directory>>/auth_config.json
+      - AUTH0_EXAMPLE_CFG: <<parameters.app-directory>>/auth_config.json.example
     steps:
       - attach_workspace:
           at: ~/
@@ -42,18 +47,23 @@ jobs:
               $AUTH0_EXAMPLE_CFG > $AUTH0_CFG
       - node/install-packages:
           pkg-manager: npm
-          app-dir: Sample-01
+          app-dir: <<parameters.app-directory>>
       - run:
           name: Run unit tests
-          working_directory: Sample-01
+          working_directory: <<parameters.app-directory>>
           command: npm run test:ci
   login:
+    parameters:
+      app-directory:
+        type: string
+        default: "Sample-01"
+        description: "The root directory of the application to run"
     machine:
       image: << pipeline.parameters.machine_image >>
     environment:
-      - AUTH0_CFG: Sample-01/auth_config.json
-      - AUTH0_EXAMPLE_CFG: Sample-01/auth_config.json.example
-      - SAMPLE_PATH: Sample-01
+      - AUTH0_CFG: <<parameters.app-directory>>/auth_config.json
+      - AUTH0_EXAMPLE_CFG: <<parameters.app-directory>>/auth_config.json.example
+      - SAMPLE_PATH: <<parameters.app-directory>>
     steps:
       - attach_workspace:
           at: ~/
@@ -100,10 +110,23 @@ workflows:
       - checkout:
           context: Quickstart SPA Test
       - sample-01:
+          app-directory: Sample-01
+          requires:
+            - checkout
+      - sample-01:
+          name: standalone
+          app-directory: Standalone
+          requires:
+            - checkout
+      - login:
           context: Quickstart SPA Test
+          app-directory: Sample-01
           requires:
             - checkout
       - login:
+          name: login-standalone
           context: Quickstart SPA Test
+          app-directory: Standalone
           requires:
             - checkout
+            - login

Standalone/.browserslistrc

@@ -0,0 +1,12 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+> 0.5%
+last 2 versions
+Firefox ESR
+not dead
+not IE 9-11 # For IE 9-11 support, remove 'not'.

Standalone/.dockerignore

@@ -0,0 +1,21 @@
+
+dist/
+node_modules/
+exec.*
+npm-debug.log*
+yarn-error.log
+README.md
+
+# testing
+/coverage
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*%

Standalone/.editorconfig

@@ -0,0 +1,13 @@
+# Editor configuration, see https://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

Standalone/.gitignore

@@ -0,0 +1,47 @@
+# See http://help.github.com/ignore-files/ for more about ignoring files.
+auth_config.json
+
+# compiled output
+/dist
+/tmp
+/out-tsc
+# Only exists if Bazel was run
+/bazel-out
+
+# dependencies
+/node_modules
+
+# profiling files
+chrome-profiler-events.json
+speed-measure-plugin.json
+
+# IDEs and editors
+/.idea
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# IDE - VSCode
+.vscode/*
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history/*
+
+# misc
+/.angular/cache
+/.sass-cache
+/connect.lock
+/coverage
+/libpeerconnection.log
+npm-debug.log
+yarn-error.log
+testem.log
+/typings
+
+# System Files
+.DS_Store
+Thumbs.db

Standalone/Dockerfile

@@ -0,0 +1,43 @@
+FROM node:16-alpine AS build
+
+RUN apk update && apk add git
+
+RUN mkdir -p /app
+
+WORKDIR /app
+
+COPY package.json .
+COPY package-lock.json .
+
+RUN npm install --legacy-peer-deps
+
+COPY . .
+
+RUN npm run build
+
+# -----------------
+
+FROM node:16-alpine
+
+RUN mkdir -p /app
+
+WORKDIR /app
+
+COPY package.json .
+COPY package-lock.json .
+
+RUN npm install --production --legacy-peer-deps
+
+COPY --from=build ./app/dist/login-demo ./dist
+COPY ./server.js .
+COPY ./api-server.js .
+COPY ./auth_config.json .
+
+ENV NODE_ENV=production
+ENV SERVER_PORT=4200
+ENV API_SERVER_PORT=3001
+
+EXPOSE 4200
+EXPOSE 3001
+
+CMD ["npm", "run", "prod"]

Standalone/README.md

@@ -0,0 +1,83 @@
+# Auth0 Angular SDK sample
+
+This sample app demonstrates the integration of the [Auth0 Angular SDK](https://github.com/auth0/auth0-angular) into an Angular application created using the Angular CLI. This sample is a companion to the [Auth0 Angular SDK Quickstart](https://auth0.com/docs/quickstart/spa/angular).
+
+This sample demonstrates the following use cases:
+
+- Login
+- Log out
+- Showing the user profile
+- Protecting routes using the authentication guard
+- Calling APIs with automatically-attached bearer tokens
+
+## Configuration
+
+The sample needs to be configured with your Auth0 domain and client ID in order to work. In the root of the sample, copy `auth_config.json.example` and rename it to `auth_config.json`. Open the file and replace the values with those from your Auth0 tenant:
+
+```json
+{
+  "domain": "<YOUR AUTH0 DOMAIN>",
+  "clientId": "<YOUR AUTH0 CLIENT ID>",
+  "audience": "<YOUR AUTH0 API AUDIENCE IDENTIFIER>"
+}
+```
+
+## Development server
+
+Run `npm run dev` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
+
+This will automatically start a Node + Express server as the backend on port `3001`. The Angular application is configured to proxy through to this on any `/api` route.
+
+## Build
+
+Run `npm build` to build the project. The build artifacts will be stored in the `dist/login-demo` directory. Use the `--prod` flag for a production build.
+
+To build and run a production bundle and serve it, run `npm run prod`. The application will run on `http://localhost:3000`.
+
+## Run Using Docker
+
+You can build and run the sample in a Docker container by using the provided scripts:
+
+```bash
+# In Linux / MacOS
+sh exec.sh
+
+# Windows Powershell
+./exec.ps1
+```
+
+## Further help
+
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
+
+## Frequently Asked Questions
+
+We are compiling a list of questions and answers regarding the new JavaScript SDK - if you're having issues running the sample applications, [check the FAQ](https://github.com/auth0/auth0-spa-js/blob/master/FAQ.md)!
+
+# What is Auth0?
+
+Auth0 helps you to:
+
+- Add authentication with [multiple authentication sources](https://auth0.com/docs/identityproviders), either social like **Google, Facebook, Microsoft Account, LinkedIn, GitHub, Twitter, Box, Salesforce, among others**, or enterprise identity systems like **Windows Azure AD, Google Apps, Active Directory, ADFS or any SAML Identity Provider**.
+- Add authentication through more traditional **[username/password databases](https://auth0.com/docs/connections/database/custom-db/create-db-connection)**.
+- Add support for **[linking different user accounts](https://auth0.com/docs/users/user-account-linking)** with the same user.
+- Support for generating signed [Json Web Tokens](https://auth0.com/docs/tokens/json-web-tokens) to call your APIs and **flow the user identity** securely.
+- Analytics of how, when and where users are logging in.
+- Pull data from other sources and add it to the user profile, through [JavaScript rules](https://auth0.com/docs/rules).
+
+## Create a Free Auth0 Account
+
+1. Go to [Auth0](https://auth0.com/signup) and click Sign Up.
+2. Use Google, GitHub or Microsoft Account to login.
+
+## Issue Reporting
+
+If you have found a bug or if you have a feature request, please report them at this repository issues section. Please do not report security vulnerabilities on the public GitHub issue tracker. The [Responsible Disclosure Program](https://auth0.com/whitehat) details the procedure for disclosing security issues.
+
+## Author
+
+[Auth0](https://auth0.com)
+
+## License
+
+This project is licensed under the MIT license. See the [LICENSE](../LICENSE) file for more info.