https://github.com/slxca/google-onetap-nextjs
This repository demonstrates how to implement Google OneTap authentication in a NextJS v14 app using the App Router.
https://github.com/slxca/google-onetap-nextjs
google google-auth google-one-tap nextjs onetap react
Last synced: 5 months ago
JSON representation
This repository demonstrates how to implement Google OneTap authentication in a NextJS v14 app using the App Router.
- Host: GitHub
- URL: https://github.com/slxca/google-onetap-nextjs
- Owner: slxca
- Created: 2024-05-21T22:56:15.000Z (about 2 years ago)
- Default Branch: master
- Last Pushed: 2024-10-24T21:22:08.000Z (over 1 year ago)
- Last Synced: 2025-10-25T07:28:51.377Z (8 months ago)
- Topics: google, google-auth, google-one-tap, nextjs, onetap, react
- Language: TypeScript
- Homepage:
- Size: 120 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
Awesome Lists containing this project
README
# NextJS v14 Google OneTap Authentication
This repository demonstrates how to implement Google OneTap authentication in a NextJS v14 app using the App Router.
## Installation
### 1. Create a Google Application
To get started, you'll need to create a Google Application. Follow the steps in [this guide](https://developers.google.com/identity/sign-in/web/sign-in) to set up your application and obtain your Client ID.
### 2. Configure the Environment Variables
Once you have your Client ID, copy it and follow these steps:
1. Rename the `template.env.local` file to `.env.local`.
2. Open the `.env.local` file and add your Client ID as follows:
```
NEXT_PUBLIC_GOOGLE_CLIENT_ID=YOUR_CLIENT_ID_HERE
```
### 3. Authorized URLs
Make sure your application is running on an HTTPS URL that has been authorized in your Google API Console. This is necessary for the Google OneTap feature to work correctly.
## Usage
To use the Google OneTap authentication in your NextJS v14 project, follow these steps:
1. Clone the repository:
```sh
git clone https://github.com/slxca/google-onetap-nextjs.git
```
2. Install the dependencies:
```sh
cd google-onetap-nextjs
npm install
```
3. Start the development server:
```sh
npm run dev
```
4. Open your application in the browser. You should see the Google OneTap prompt appear.
## Contributing
We welcome contributions! Please feel free to submit issues, fork the repository, and open pull requests.
## Support
If you find this project helpful, please consider supporting us by sponsoring on GitHub: [github.com/sponsors/slxca](https://github.com/sponsors/slxca).
---
Thank you for your interest in our project! We hope it helps you implement Google OneTap authentication in your NextJS applications.