🖥️ 프로젝트 소개 [ Website ] ⭐️ 로그인 창의 테스트 계정으로 로그인하시면 회원 가입 없이 사이트를 둘러보실 수 있습니다. Motimates Motimates motimates.xyz [ GitHub ] https://github.com/SesacProjectTeamA-2 SesacProjectTeamA-2 새싹 프로젝트 팀프로젝트 TeamA-2. SesacProjectTeamA-2 has 3 repositories available. Follow their code on GitHub. github.com [ Notion ] Motimates Motimates 🌐 웹 사이트 주소 www.notion.so 🏃🏻‍♂️ 개요 Motivation + Mates 모임에 가입해 목표를 함께 달성하고 경..

1. JWT 검증 개발한 기능들 중 토큰 검증을 통해 접근할 수 있는 기능들에는 앞서 개발한 미들웨어를 넣어줄 수 있다. 예를 들어, 이런 식으로 게시글을 작성하기 위한 페이지에 접근하기 위해 토큰 검증을 하려고 하는 경우, middlewares/auth.js 폴더 안 토큰을 검증하는 로직인 checkToken을 불러와 authUtil이라는 이름으로 미들웨어로 넣어주었다. 로그인을 하면 토큰이 발급되게 해 두었고, 이 토큰을 포스트맨과 스웨거에서 사용하는 법을 정리해보려 한다. 2. Postman에서 토큰 활용 포스트맨을 열어 사용하려는 api를 작성한 뒤, 상단의 Auth 탭에 들어간다. 이런식으로 토큰의 타입을 선택할 수 있는데, 현재 토큰은 req.headers.authorization에 Beare..

JWT란? Json Web Token Json 포맷을 이용하여 사용자에 대한 정보를 저장하는 웹 토큰 토큰 자체를 정보로 사용하는 방식 주로 회원 인증이나 정보 전달에 사용 [ 구조 ] 1) Header (헤더) typ : 토큰의 타입 (ex. JWT) alg : 해싱하기 위한 알고리즘 방식 (ex. SHA256, HS256 등) 2) PayLoad (페이로드) 토큰에서 사용할 정보들인 Claim (클레임)이 담겨있음 Registered Claim (등록된 클레임) 토큰 정보를 표현하기 위해 이미 정해져 있는 종류의 데이터 선택적 작성이 가능 issuer 토큰 발급자 subject 토큰 제목 audience 토큰 대상자 expiration 토큰 만료 시간 not before 토큰 활성 날짜 issued ..

1. SPA Single Page Application 단일 웹 페이지로 돌아가는 애플리케이션 (ex. index.html) 브라우저에서 자바스크립트를 이용하여 단일 웹 페이지의 상위 HTML 요소를 동적으로 생성 및 조작 검색 엔진 최적화 (SEO)에는 적합하지 않음 [ 특징 ] 대표적인 SPA라이브러리 : React.js, Vue.js, Augular2 등 컴포넌트들이 모여 하나의 페이지를 작성하고, 이후 특정 부분만 데이터를 바인딩하는 개념 [ 장점 ] 사용자 친화적 초기에 한 번의 렌더링 후, 데이터만 받아오기 때문에 상대적으로 서버 요청이 적음 FE와 BE의 분리로 개발 업무의 분업화 및 협업에 용이 효율적인 개발을 할 수 있도록 함 [ 단점 ] 처음 화면을 로딩할 때, 모든 화면이 미리 준비되..

1. 일반 CSS 일반적으로 우리가 알고 있는 바로 그 CSS 소규모 프로젝트에 적합 별도의 라이브러리 필요 X 1.1 주의사항 CSS 작성 시 컴포넌트 별 클래스가 중복되지 않도록 작성하는 것이 중요 1) 클래스 생성 규칙 클래스의 이름을 생성할 때 중복되지 않도록 특정한 규칙을 정해둘 수 있음 이름-태그의 형식과 같이 규칙을 정할 수 있음 ex) App 컴포넌트에 헤더를 생성 => App-header 2) CSS Selector DOM트리 구조를 통해 원하는 DOM을 참조하여 꾸밀 수 있음 ex) .App .logo { ... } 1.2 CSS 모듈 사용 CSS의 모듈 형식을 사용하면 자동으로 클래스명이 생성 CSS의 파일명을 컴포넌트명.module.css로 생성 -> 사용하려는 js 파일에서 imp..

🖥️ 프로젝트 소개 [ 웹사이트 바로가기 ] ⭐️ 로그인 창에 기본 값으로 작성되어 있는 계정으로 로그인 시 회원가입 없이 사이트를 둘러보실 수 있습니다. https://sesacin.online/ 메인 사진에 어떠어떠한 구조물이 있는지 분석하는 ai를 개발하려면 어디부터 시작해야할까요?이런걸 시작하기 위해 필요한 부분들이 정리돼있는 책, 유튜브, 혹은 검색해볼 주제를 알려주셨으면 좋 sesacin.online [ Github 바로가기 ] https://github.com/SesacProjectTeamC/SesacIn GitHub - SesacProjectTeamC/SesacIn: 새싹 프로젝트 팀프로젝트 TeamC 새싹 프로젝트 팀프로젝트 TeamC. Contribute to SesacProjectTe..