Authentication - lesson 5 | HackIndia Skills

Key point

Use a provider

OAuth lets a trusted provider like Google or GitHub confirm who the user is. Your app receives a verified identity and does not see the user’s provider password.

The idea to remember: OAuth is for sign-in delegation. Your app still must create its own app session or token after the provider confirms the user.

What OAuth adds

In a college project, OAuth sign-in is useful because users can join with an account they already have. For a hackathon app, Google is common for student emails. GitHub is common for developer tools.

The flow has four parts: your app redirects to the provider, the user approves, the provider redirects back to your callback URL, and your app signs the user into your own app.

Your to-do

Set up provider app

Do each one yourself, then tap it to tick it off. The ticks are only a checklist for you: they are not marked or scored.

Choose one provider first, such as Google or GitHub.
Create an OAuth app in that provider’s developer console.
Add your local callback URL, such as http://localhost:3000/api/auth/callback/google.
Add your deployed callback URL later, using your real domain.
Copy the client ID and client secret into environment variables, not into code.

0 of 5 done

Example

NextAuth example

If your project uses Next.js, Auth.js / NextAuth is a common free choice. This example adds Google sign-in and stores the provider credentials in env vars.

Check the docs for the exact setup for your Next.js version before copying. AI tools often mix old and new NextAuth file paths.

// app/api/auth/[...nextauth]/route.js
import NextAuth from "next-auth";
import GoogleProvider from "next-auth/providers/google";

const handler = NextAuth({
  providers: [
    GoogleProvider({
      clientId: process.env.GOOGLE_CLIENT_ID,
      clientSecret: process.env.GOOGLE_CLIENT_SECRET,
    }),
  ],
  callbacks: {
    async session({ session, token }) {
      session.user.id = token.sub;
      return session;
    },
  },
});

export { handler as GET, handler as POST };

// .env.local
GOOGLE_CLIENT_ID="your-client-id"
GOOGLE_CLIENT_SECRET="your-client-secret"
NEXTAUTH_URL="http://localhost:3000"
NEXTAUTH_SECRET="make-a-long-random-secret"

Common mistake

Do not trust extras

Do not treat every field from the provider as proof. The email, name, and photo help build a profile, but you should store only what your app needs.

Also do not skip your own auth state. After OAuth succeeds, your app still needs a session cookie or token, with the safe handling from earlier lessons.

Tip

Use AI carefully

Ask AI for a provider checklist, not secret values. Paste your framework version and ask for the correct callback route and env variable names.

Then check three things yourself: secrets are not committed, callback URLs match exactly, and the app creates its own session after provider sign-in.