반응형

Dev 96

Github Pages next.js 에셋 404 뜰 때

원인GitHub Pages는 기본적으로 Jekyll이라는 정적 사이트 생성기를 사용합니다.그리고 Jekyll은 _next/, _site/, _includes/처럼 밑줄(_)로 시작하는 폴더를 무시합니다.즉, _next/ 폴더가 있어도 서빙되지 않습니다.해결 방법: .nojekyll 파일 추가.nojekyll이라는 빈 파일을 GitHub Pages 루트에 추가하면 Jekyll 처리를 비활성화할 수 있습니다.touch docs/.nojekyllgit add docs/.nojekyllgit commit -m "fix: add .nojekyll to serve _next static files"git push origin main

Dev/etc. 2025.06.02

JWT 인증과 인가 흐름

JWT 인증과 인가 흐름1. Axios 인터셉터를 활용한 자동 토큰 갱신 예시Axios 인터셉터 설정Axios를 사용하여 Access Token의 만료를 감지하고, Refresh Token을 사용하여 새로운 Access Token을 발급받는 방식으로 자동화할 수 있음.import axios from 'axios';// Axios 인스턴스 생성const api = axios.create({ baseURL: 'https://example.com/api', timeout: 10000, headers: { 'Content-Type': 'application/json' },});// 요청 인터셉터 (요청이 보내지기 전에 처리)api.interceptors.request.use( config => { ..

Dev/etc. 2025.03.12

10. Github Actions 배포 자동화

배포 설정.github/workflows/deploy.ymlname: Deploy on Pushon: push: branches: - main # main 브랜치에 푸시될 때 실행jobs: deploy: runs-on: ubuntu-latest steps: # 1. 리포지토리 체크아웃 / 저장소 코드를 워크플로 실행 환경에 복사하는 GitHub에서 제공하는 공식 액션 - name: Checkout repository uses: actions/checkout@v3 # 2. SSH 키 설정 및 서버에 접속하여 빌드 실행 - name: Deploy to server env: SSH_PRIVATE_KEY:..

Dev/개발 일지 2025.02.02

9. NginX 세팅

NginX 설치sudo apt updatesudo apt install nginxNginX 커맨드sudo systemctl start nginx # 시작sudo systemctl restart nginx # 재시작sudo systemctl status nginx # 중지sudo systemctl enable nginx # 부팅 시 자동시작 설정NginX 설정 파일의 목적nginx.confNginx의 주요 설정 파일로, Nginx의 동작 방식을 정의/etc/nginx/nginx.conf 경로에 위치sites-available, sites-enabled이 두 디렉토리는 Nginx의 가상 호스트 설정을 관리하는데 사용sites-available활성화되지 않은 사이트의 설정 파일을 보관하는 디렉토리호스트별 ..

Dev/개발 일지 2024.12.21

7. mongoDB 설치

# 설치brew install mongodb-community# mongoDB 커맨드 설치brew install mongodb-community-shell# mongoDB 실행brew services restart mongodb/brew/mongodb-community유저 생성mongo# mongodb 쉘 접속use admindb.createUser({ user: 'yt', pwd:'asdasd', roles:[]})db.updateUser("yt", { roles: [ { role: "root", db: "admin" } ] })암호 설정vim /usr/local/etc/mongod.conf # 또는 /etc/mongod.conf해당 설정 추가security: authorization: "enabl..

Dev/개발 일지 2024.11.03

6. 프로젝트 세팅 (husky 커밋 훅, docker)

프로젝트 세팅husky 커밋 훅 설정커밋 시 자동으로 prettier를 적용해서 커밋하도록 설정root에서 설치pnpm add -wD husky lint-stagedroot의 package.json에 추가"scripts": { "prepare": "husky"}"lint-staged": { "apps/maplem/frontend/src/**/*.{js,ts,tsx}": [ "prettier --cache --write" ], "apps/maplem/backend/src/**/*.{js,ts}": [ "prettier --cache --write" ], "configs/**/*.{js,json}": [ "prettier --cache --write..

Dev/개발 일지 2024.10.08

5. 프로젝트 세팅 (FE + BE 연결)

앞전에 fastify를 간단히 로컬에서 돌아가는 정도로만 세팅하고 도커를 세팅하려하니 빌드가 원하는대로 안되기도 하고, 문서나 정보가 너무 부실해서 그냥 express로 변경하려 함.Express + TypeScript 설치pnpm initpnpm i express corspnpm i -D typescript @types/express @types/cors @types/node ts-node-dev세팅tsconfig.json{ "extends": "@playground/tsconfig/base.json", "compilerOptions": { "target": "ESNext", "module": "CommonJS", "esModuleInterop": true, "skipLibCh..

Dev/개발 일지 2024.09.26

4. 프로젝트 세팅 (eslint, prettier, tsconfig)

프로젝트 세팅우선 하나의 프로젝트로 진행하고 추가로 다른 프로젝트를 진행할 때 세팅을 또 하지 않아도 되도록 모노레포로 구성추후 다시 세팅하는 상황을 고려해 최대한 상세히 기록해 놓으려 함2024.10.14 - 아래 코드는 온전히 동작하지 않는 부분이 있으니, 참고만 하세요. 추후 재작성 예정입니다.터보레포 생성npx create-turbo@latest playground패키지 매니저는 기존에 사용하던 pnpm 선택.Vite + React + TypeScript 프런트엔드 생성pnpm create vite@latest apps/maplem.gg/frontend --template react-tsFastify 백엔드 생성mkdir -p apps/maplem.gg/backendcd apps/maplem.gg..

Dev/개발 일지 2024.09.19

3. 프로젝트 스택 선정

기존에 진행하고 있던 프로젝트가 앞선 게시물에서 언급했던 것 처럼백엔드와 배포를 둘 다 netlify를 통해서 진행했어서 DB도 없고, 배포가 되는 과정을 모르는게 아쉽다 생각했음.아래는 v1을 개발했을 때의 스택- Frontend - react / vite- Backend - netlify serverless functions / DB 없음- hosting - netlify새롭게 v2를 만들 계획을 하면서 이전에 v1스택을 정하게 된 이유에 대해 먼저 간략히 말하자면,회사에서 개발을 하다보면 오래전부터 이어져온 코드이기도 하고, 컨벤션이나 룰이 있다지만 아무래도 개개인이 작성하는 코드기 때문에, 통일이 안되어있는 부분에서 해소되지 않는 답답함이 있어서 가장 미니멀한 스택으로 기능만 구현하자라..

Dev/개발 일지 2024.09.11
반응형