DEV Community: Jun Oh Lee

first step of Type Script -1

Jun Oh Lee — Mon, 08 Sep 2025 07:43:31 +0000

why TS is popular?

When it comes to JavaScript, Many developers agree with it is one of essential languages in this field. However, as the application grows in scale, several drawbacks become apparent.

drawback of Js

In general, JavaScript is a dynamically typed language, meaning types are determined at runtime. JavaScript has a double edged sword : it cause developer mistakes and makes development tools harder to use.

type Error
It throws runtime error what if the unexpected type of data is delivered into function.
low readability
It is hard to read code for other developers.. This is because
uncertainty type of variable or return type.
short of auto complete
lack of assurance of object structure
it does not have guarantee for the existence of property

cheating code for authentication -2

Jun Oh Lee — Tue, 02 Sep 2025 05:55:42 +0000

📝 router/Auth.js

import express from 'express';
import prisma from '../lib/prisma.js';
import bcrypt from 'bcrypt';
import jwt from 'jsonwebtoken';
import { JWT_SECRET, JWT_EXPIRES } from '../lib/constants.js';


const router = express.Router();

router.post('/register', async (req, res) => {
    const {nickname, password} = req.body;

    const existing_nickname = await prisma.user.findUnique({
        where: {nickname}
    });
    console.log("req.data" , req.data)
    if (existing_nickname) return res.status(400).json({message:" 이미 존재하는 닉네임입니다"})

    // create hashed password
    const hashed_password = await bcrypt.hash(password, 10); // hash round 10

    // create user in database
    const user = await prisma.user.create({
        data: { password: hashed_password, nickname },
    })
    res.status(201).json({ id: user.id, nickname: user.nickname})
})
    router.post('/login',async (req, res) => {
        const {nickname, password} = req.body;

        // 사용자 확인
        const existing_user = await prisma.user.findUnique({
            where: {nickname}
        })
        if(!existing_user) return res.status(400).json({message:""})

        // 비밀번호 검증
        const isValid = await bcrypt.compare(password, user.password)
        if (!isValid) return res.status(400).json({ message: '비밀번호가 틀렸습니다.' });

        // jwt token 발급
        const token = jwt.sign({id : user.id}, JWT_SECRET, { expiresIn: JWT_EXPIRES })
        res.json({token})
    })
export default router

📝 router/index.js

import express from 'express';
import authRoutes from './authRouter.js';
import protectedRoutes from './protectedRouter.js';

const router = express.Router();
router.use('/',authRoutes)
router.use('/profile',protectedRoutes)

export default router;

📝 router/protected.js

*/
import express from 'express'
import passport from 'passport'
const router = express.Router()

router.get(
  '/',
  passport.authenticate('access-token', { session: false }),
  (req, res) => {
    // JWT가 유효하면 req.user에 사용자 정보가 들어옴
    res.json({
      message: `Protected profile data for ${req.user.nickname}`,
      user: req.user
    });
  }
);
export default router

cheating code for authentication code

Jun Oh Lee — Tue, 02 Sep 2025 05:48:06 +0000

📂 lib/constants.js

Env variables, JWT secret, token expiry,

import dotenv from 'dotenv';

dotenv.config();

const NODE_ENV = process.env.NODE_ENV || 'development';
const PORT = process.env.PORT || 3000;
const JWT_ACCESS_TOKEN_SECRET =
  process.env.JWT_ACCESS_TOKEN_SECRET || 'your_jwt_access_token_secret';
const JWT_REFRESH_TOKEN_SECRET =
  process.env.JWT_REFRESH_TOKEN_SECRET || 'your_jwt_refresh_token_secret';
const ACCESS_TOKEN_COOKIE_NAME = 'access-token';
const REFRESH_TOKEN_COOKIE_NAME = 'refresh-token';
const GOOGLE_CLIENT_ID = process.env.GOOGLE_CLIENT_ID;
const GOOGLE_CLIENT_SECRET = process.env.GOOGLE_CLIENT_SECRET;

export {
  NODE_ENV,
  PORT,
  JWT_ACCESS_TOKEN_SECRET,
  JWT_REFRESH_TOKEN_SECRET,
  ACCESS_TOKEN_COOKIE_NAME,
  REFRESH_TOKEN_COOKIE_NAME,
  GOOGLE_CLIENT_ID,
  GOOGLE_CLIENT_SECRET,
};

📂 lib/token.js

import jwt from 'jsonwebtoken';
import {
  JWT_ACCESS_TOKEN_SECRET,
  JWT_REFRESH_TOKEN_SECRET,
} from './constants.js';

function generateTokens(userId) {
  const accessToken = jwt.sign({ sub: userId }, JWT_ACCESS_TOKEN_SECRET, {
    expiresIn: '1h',
  });
  const refreshToken = jwt.sign({ sub: userId }, JWT_REFRESH_TOKEN_SECRET, {
    expiresIn: '1d',
  });
  return { accessToken, refreshToken };
}

function verifyAccessToken(token) {
  const decoded = jwt.verify(token, JWT_ACCESS_TOKEN_SECRET);
  return { userId: decoded.sub };
}

function verifyRefreshToken(token) {
  const decoded = jwt.verify(token, JWT_REFRESH_TOKEN_SECRET);   
  return { userId: decoded.sub };
}

export { generateTokens, verifyAccessToken, verifyRefreshToken };

📂 lib/prisma

import { PrismaClient } from '@prisma/client';

const prisma = new PrismaClient();

export default prisma;

cheating code for post authentication

Jun Oh Lee — Tue, 02 Sep 2025 05:36:37 +0000

📂 lib/passport/localStrategy.js
npm install bcrypt
npm install passport-local

 import LocalStrategy from 'passport-local';
import bcrypt from 'bcrypt';
import prisma from '../prisma.js';

export const localStrategy = new LocalStrategy(async function (
  username,
  password,
  done
) {
  const user = await prisma.user.findUnique({ where: { username } });
  if (!user) {
    return done(null, false);
  }

  const isPasswordValid = await bcrypt.compare(password, user.password);
  if (!isPasswordValid) {
    return done(null, false);
  }

  done(null, user);
});

📂 lib/passport/jwtStrategy.js

import { Strategy as JwtStrategy } from 'passport-jwt';
import prisma from '../prisma.js';
import {
  ACCESS_TOKEN_COOKIE_NAME,
  REFRESH_TOKEN_COOKIE_NAME,
  JWT_ACCESS_TOKEN_SECRET,
  JWT_REFRESH_TOKEN_SECRET,
} from '../constants.js'; // lib

const accessTokenOptions = {
  jwtFromRequest: (req) => req.cookies[ACCESS_TOKEN_COOKIE_NAME],
  secretOrKey: JWT_ACCESS_TOKEN_SECRET,
};

const refreshTokenOptions = {
  jwtFromRequest: (req) => req.cookies[REFRESH_TOKEN_COOKIE_NAME],
  secretOrKey: JWT_REFRESH_TOKEN_SECRET,
};

async function jwtVerify(payload, done) {
  try {
    const user = await prisma.user.findUnique({
      where: { id: payload.sub },
    });
    done(null, user);
  } catch (error) {
    done(error, false);
  }
}

export const accessTokenStrategy = new JwtStrategy(
  accessTokenOptions,
  jwtVerify
);

export const refreshTokenStrategy = new JwtStrategy(
  refreshTokenOptions,
  jwtVerify
);

📂 lib/passport/oathStrategy.js

import { Strategy as GoogleStrategy } from 'passport-google-oauth20';
import { GOOGLE_CLIENT_ID, GOOGLE_CLIENT_SECRET } from '../constants.js';
import prisma from '../prisma.js';

export const googleStrategy = new GoogleStrategy(
  {
    clientID: GOOGLE_CLIENT_ID,
    clientSecret: GOOGLE_CLIENT_SECRET,
    callbackURL: 'http://localhost:3000/auth/google/callback',
  },
  async function (accessToken, refreshToken, profile, cb) {
    const user = await prisma.user.findUnique({
      where: { provider: 'google', providerId: profile.id },
    });
    if (user) {
      return cb(null, user);
    }

    const newUser = await prisma.user.create({
      data: {
        provider: 'google',
        providerId: profile.id,
        username: profile.id,
        password: null,
      },
    });

    return cb(null, newUser);
  }
);

📂 lib/passport/index.js

import passport from 'passport';
import prisma from '../prisma.js';
import { localStrategy } from './localStrategy.js';
import { accessTokenStrategy, refreshTokenStrategy } from './jwtStrategy.js';
import { googleStrategy } from './oauthStrategy.js';

passport.use('local', localStrategy);
passport.use('access-token', accessTokenStrategy);
passport.use('refresh-token', refreshTokenStrategy);
passport.use('google', googleStrategy);

passport.serializeUser(function (user, done) {
  done(null, user.id);
});

passport.deserializeUser(async function (id, done) {
  const user = await prisma.user.findUnique({ where: { id } });
  done(null, user);
});

export default passport;

What the hell is authentication system in node?

Jun Oh Lee — Tue, 02 Sep 2025 05:22:45 +0000

Hmm during refactoring my project, I was suffering about structure of directory and how to render authentication.

first of all, make directories which are library and routers..

roject/
├─ lib/                 # Utilities and core services
│  ├─ constants.js      # Env variables, JWT secret, token expiry, etc.
│  ├─ prisma.js         # PrismaClient singleton (optional but useful)
│  ├─ token/            # JWT helpers (sign, verify, refresh)
│  └─ passport/         # All authentication strategies
│      ├─ localStrategy.js   # For username/password login
│      ├─ jwtStrategy.js     # For JWT verification
│      ├─ oauthStrategy.js   # For Google/GitHub/etc.
│      └─ index.js           # Register all strategies with passport
│
├─ routers/             # Route definitions
│  ├─ auth.js           # Register, login, logout endpoints
│  ├─ protected.js      # Endpoints that require authentication
│  └─ index.js          # Combine routers into a single entry
│
├─ prisma/
│  └─ schema.prisma     # Database schema
│
├─ server.js            # App entrypoint
└─ package.json

🔄 Request Flow Example

user register via api/auth
User logs in via /auth/login
User accesses protected route /protected/profile