fix,docs: README.md update, api 수정

frontend/portal/README.md

@@ -1,14 +1,6 @@
-# Frontend Boilerplate
+# Frontend Portal
 
-Next.js + Typescript 활용한 React 기반 프론트엔드 기본 설정 Boilerplate.
-해당 프로젝트에 설정된 부분은 [여기를](https://www.notion.so/Frontend-Boilerplate-b4f07b67713243f1bb0050cd35970bc9) 확인!!
-
-### Tech stack
-
-- [Next.js](https://nextjs.org/docs/getting-started)
-- [Typescript](https://www.typescriptlang.org/docs/)
-- [ESLint](https://eslint.org/) + [Prettier](https://prettier.io/) + [airbnb Style Guide](https://github.com/airbnb/javascript)
-- [Jest](https://jestjs.io/docs/next/getting-started) + [testing-library](https://testing-library.com/docs/)
+Next.js + Typescript 활용한 React 기반 프론트엔드.
 
 ## Getting Started
 
@@ -19,8 +11,6 @@ npm install
 
 # 기본 소규모 모드
 npm run dev
-# or
-yarn dev
 
 # 소규모 모드 for Windows
 npm run dev:smWin
@@ -33,6 +23,43 @@ npm run dev:lgWin
 npm run dev:lg
 ```
 
+run the local to production mode:
+
+```bash
+npm install
+npm run build
+npm run start
+```
+
+### 환경변수
+
+- `.env.local.sample` 파일처럼 `.env.local` 파일을 생성하여 필요한 환경변수를 세팅한다.
+- 사용하고 있는 환경변수는 `./src/constants/env.ts`, `./next.config.js` 파일을 확인한다.
+
+## 소셜 로그인
+
+소셜 로그인이 필요한 경우 `SOCIAL_LOGIN_ENABLED` 환경변수를 `true` 로 설정한다. (기본값: `false`)
+아래를 참고하여 각 소셜 로그인의 key를 환경변수로 등록한다.
+
+```typescript
+// @constants/env.ts
+export const GOOGLE_CLIENT_ID = process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID
+export const KAKAO_JAVASCRIPT_KEY = process.env.NEXT_PUBLIC_KAKAO_JAVASCRIPT_KEY
+export const NAVER_CLIENT_ID = process.env.NEXT_PUBLIC_NAVER_CLIENT_ID
+export const NAVER_CALLBACK_URL = process.env.NEXT_PUBLIC_NAVER_CALLBACK_URL
+```
+
+**`SOCIAL_LOGIN_ENABLED=true`이고 각 key의 값이 존재하는 경우 각 소셜로그인의 버튼이 활성화 된다.**
+
+> e.g.
+> SOCIAL_LOGIN_ENABLED=true
+> NEXT_PUBLIC_KAKAO_JAVASCRIPT_KEY=kakao
+
+위 처럼 환경변수를 설정한 경우 카카오 로그인 버튼만 활성화 된다.
+user-service 에서 backend 설정(`application.yml`)도 해주어야 한다.
+
+## 폴더 구조
+
 ```bash
 ├─public                 # static resource root
 │  ├─locales             # 다국어 message.json
@@ -74,3 +101,10 @@ npm run dev:lg
 │ tsconfig.json          # typescirpt config
 └ tsconfig.server.json   # custom server 사용 시 typescript config
 ```
+
+### Tech stack
+
+- [Next.js](https://nextjs.org/docs/getting-started)
+- [Typescript](https://www.typescriptlang.org/docs/)
+- [ESLint](https://eslint.org/) + [Prettier](https://prettier.io/) + [airbnb Style Guide](https://github.com/airbnb/javascript)
+- [Jest](https://jestjs.io/docs/next/getting-started) + [testing-library](https://testing-library.com/docs/)