{"id":22148111,"url":"https://github.com/auth0-developer-hub/web-app_express_javascript_hello-world","last_synced_at":"2025-08-01T04:43:34.576Z","repository":{"id":128856625,"uuid":"369945766","full_name":"auth0-developer-hub/web-app_express_javascript_hello-world","owner":"auth0-developer-hub","description":null,"archived":false,"fork":false,"pushed_at":"2021-12-13T21:05:27.000Z","size":65,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-01-29T17:44:48.855Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/auth0-developer-hub.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-05-23T02:36:31.000Z","updated_at":"2023-05-03T00:36:14.000Z","dependencies_parsed_at":"2023-08-26T05:16:42.001Z","dependency_job_id":null,"html_url":"https://github.com/auth0-developer-hub/web-app_express_javascript_hello-world","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/auth0-developer-hub%2Fweb-app_express_javascript_hello-world","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/auth0-developer-hub%2Fweb-app_express_javascript_hello-world/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/auth0-developer-hub%2Fweb-app_express_javascript_hello-world/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/auth0-developer-hub%2Fweb-app_express_javascript_hello-world/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/auth0-developer-hub","download_url":"https://codeload.github.com/auth0-developer-hub/web-app_express_javascript_hello-world/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245273921,"owners_count":20588692,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-12-01T23:26:00.982Z","updated_at":"2025-03-24T12:41:44.045Z","avatar_url":"https://github.com/auth0-developer-hub.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Hello, Express.js World!\n\nThis sample uses the [Express OpenID Connect SDK](https://github.com/auth0/express-openid-connect) to implement the following security tasks:\n\n- Add user login and logout.\n- Retrieve user profile information.\n- Protect application routes.\n- Make secure calls to an API.\n\n![Hello, Express.js World!](https://images.ctfassets.net/23aumh6u8s0i/4Vm7S2OxumaJQOAFW3LYBB/e5fa555d237da66d7917bf335b0baaed/hello-express-pug.png)\n\nThe `add-authentication` branch offers a functional application that uses Express.js middleware to hydrate the user profile information present in the `/profile` page. It also makes secure calls to an external API to hydrate the messages present in the `/external-api` page.\n\n## Quick Auth0 Set Up\n\n### Set up the project\n\nInstall the project dependencies:\n\n```bash\nnpm install\n```\n\n### Register a Express.js application with Auth0\n\n- Open the [Applications](https://manage.auth0.com/#/applications) section of the Auth0 Dashboard.\n\n- Click on the **Create Application** button.\n\n- Provide a **Name** value such as _Hello World Web App_.\n\n- Choose \"Regular Web Applications\" as the **application type**.\n\n- Click on the **Create** button.\n\n\u003e View [\"Register Applications\" document](https://auth0.com/docs/applications/set-up-an-application) for more details.\n\nYour Auth0 application page loads up.\n\nYour Express.js application will redirect users to Auth0 whenever they trigger an authentication request. Auth0 will present them with a login page. Once they log in, Auth0 will redirect them back to your Express.js application. For that redirecting to happen securely, you must specify in your **Auth0 Application Settings** the URLs to which Auth0 can redirect users once it authenticates them.\n\nAs such, click on the \"Settings\" tab of your Auth0 Application page and fill in the following values:\n\n**Allowed Callback URLs**\n\n```bash\nhttp://localhost:4040/callback\n```\n\n**Allowed Logout URLs**\n\n```bash\nhttp://localhost:4040\n```\n\n**Scroll down and click the \"Save Changes\" button.**\n\n### Connect Express.js with Auth0\n\nCreate a `.env` file under the project directory and populate it as follows:\n\n```bash\nPORT=4040\nAUTH0_ISSUER_BASE_URL=\nAUTH0_CLIENT_ID=\nAUTH0_CLIENT_SECRET=\nAUTH0_AUDIENCE=https://hello-world.example.com\nBASE_URL=http://localhost:4040\nSESSION_SECRET=\nAPI_SERVER_URL=http://localhost:6060\n```\n\nHead back to your Auth0 application page. Follow these steps to get the missing values from `.env`:\n\n![Auth0 application settings to enable user authentication](https://images.ctfassets.net/23aumh6u8s0i/7wXiFoatkdr7hrDxLUQjzs/3c3d7938936b09e46c5336be22c5638f/hello-world-web-app-settings.png)\n\n1. Click on the \"Settings\" tab, if you haven't already.\n\n2. Use the \"Domain\" value from the \"Settings\" to create the value of `AUTH0_ISSUER_BASE_URL` in `.env` as follows: `https://` + Domain value.\n\n3. Use the \"Client ID\" value from the \"Settings\" as the value of `AUTH0_CLIENT_ID` in `.env`.\n\n4. Use the \"Client Secret\" value from the \"Settings\" as the value of `AUTH0_CLIENT_SECRET` in `.env`.\n\n5. Finally, execute the following command in your terminal:\n\n```bash\n node -e \"console.log(crypto.randomBytes(32).toString('hex'))\"\n```\n\n6. Copy and paste the output of the above command as the value of `SESSION_SECRET` in `.env`.\n\n### Run the project\n\nWith the Auth0 configuration set, run the Express.js application by issuing the following command:\n\n```bash\nnpm run dev\n```\n\nVisit [`http://localhost:4040/`](http://localhost:4040/) to access the application.\n\n## Advanced Auth0 Set Up\n\n### Connecting to an external API\n\nThe external API used in this Vue sample is the [\"Hello World API: Express.js Sample\"](https://github.com/auth0-sample-gallery/api_express_javascript_hello-world).\n\nFollow the instructions on that `README` of that repository to set up and run the API.\n\nOnce set up, you can see the different server responses by interacting with the message box present in [`http://localhost:4040/external-api`](http://localhost:4040/external-api).\n\n### Admin access\n\nWhen you log in to the application and visit the `/external-api` page, you have different options to test to connection between your Express.js application and a remote API server. You can retrieve a public, protected or admin message.\n\nRequesting the protected message requires Express.js to send an access token with the server request. On the other hand, requesting the admin message requires Express.js to send an access token with the server request that also has the `read:admin-messages` permission.\n\nYou can use the Auth0 Dashboard to create an `admin` role and assign it the`read:admin-messages` permission. Then, you can assign the `admin` role to any user that you want to access the `/admin` endpoint.\n\nIf you need help doing so, check out the following resources:\n\n- [Create roles](https://auth0.com/docs/authorization/rbac/roles/create-roles)\n\n- [Create permissions](https://auth0.com/docs/get-started/dashboard/add-api-permissions)\n\n- [Add permissions to roles](https://auth0.com/docs/authorization/rbac/roles/add-permissions-to-roles)\n\n- [Assign roles to users](https://auth0.com/docs/users/assign-roles-to-users)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fauth0-developer-hub%2Fweb-app_express_javascript_hello-world","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fauth0-developer-hub%2Fweb-app_express_javascript_hello-world","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fauth0-developer-hub%2Fweb-app_express_javascript_hello-world/lists"}