https://github.com/immutal0/google-github-oauth2-react-vite-example
React vite example can provide google, github, OAuth2
https://github.com/immutal0/google-github-oauth2-react-vite-example
github google oauth2 react vite
Last synced: 5 months ago
JSON representation
React vite example can provide google, github, OAuth2
- Host: GitHub
- URL: https://github.com/immutal0/google-github-oauth2-react-vite-example
- Owner: Immutal0
- Created: 2025-02-12T06:23:55.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-02-12T06:24:34.000Z (12 months ago)
- Last Synced: 2025-02-20T07:19:12.900Z (11 months ago)
- Topics: github, google, oauth2, react, vite
- Language: TypeScript
- Homepage: https://google-github-oath2-reactjs.vercel.app
- Size: 38.1 KB
- Stars: 6
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Google and GitHub OAuth Implementation in React.js
This guide will walk you through the process of integrating Google and GitHub OAuth authentication in React.js applications.

---
## Google OAuth2 Integration in React.js
This tutorial covers the steps to implement Google OAuth2 authentication in a React.js app. You'll learn how to:
- Create a project in the Google API Console
- Configure client ID and redirect URI
- Implement OAuth2 flow in your React app
### Topics Covered:
- Running React Google OAuth2 with different backends (Node.js, Golang)
- Setting up the React project
- Obtaining Google OAuth2 Client ID and Secret
- Building OAuth2 consent screen and authorization links
- Creating a Zustand store for state management
- Building reusable React components:
- Spinner
- Header
- Layout
- Implementing Authentication:
- Registration and login pages
- Building additional pages:
- Home and profile pages
- Setting up React Router for navigation
- Testing Google OAuth2 flow:
- Account creation
- OAuth2 login
- Accessing protected pages
**Read the full article here:**
[How to Implement Google OAuth2 in React.js](https://codevoweb.com/how-to-implement-google-oauth2-in-reactjs/)
---
## GitHub OAuth Integration in React.js
This tutorial will guide you through implementing GitHub OAuth in a React.js app. You'll learn how to:
- Create a GitHub OAuth app
- Configure the app’s client ID, secrets, and redirect URI
- Implement OAuth flow in your React application
### Topics Covered:
- Running React GitHub OAuth with different backends (Node.js, Golang)
- Setting up the React project
- Obtaining GitHub OAuth credentials
- Building GitHub OAuth consent screen and authorization links
- Creating a Zustand store for state management
- Building reusable React components:
- Spinner
- Header
- Layout
- Implementing GitHub OAuth:
- Account registration and login
- Building additional pages:
- Home and profile pages
- Setting up React Router for navigation
**Read the full article here:**
[How to Implement GitHub OAuth in React.js](https://codevoweb.com/how-to-implement-github-oauth-in-reactjs/)