웹개발 숙련 주차 과제 해설 강의

 

과제 할때 예시는 대충 적었는데  >> 이걸로 바로 복사해서 api 확인해보면 편하다

 

 

삭제 api명세서 작성시
처음부터 이력서 로그인하고 이력서를 띄우는거라 삭제 권한은 부여하지 않았다.

 

 

 

 

데이터 베이스 ERD 작성할때는  카멜케이스가 아니라 _ 언더바로 작성

 

 

 

 

서버가 죽지 않고 동작하기 위해서 에러핸들러 추가 

 

 

 

readme
 >> # 쓰면 제목

```sh
안에 목록을 넣을 수 있음            >> 코드 블럭

```

https://velog.io/@gmlstjq123/Readme.md-%ED%8C%8C%EC%9D%BC-%EC%9E%91%EC%84%B1%EB%B2%95

Readme.md 파일 작성법

https://gist.github.com/ihoneymon/652be052a0727ad59601

마크다운(Markdown) 사용법

혹시 import하면서 파일 위치를 잘 잡았나 확인하려면 
command 누르고 클릭하면 확인가능 ../ ./ 갯수 헷갈릴때 좋다.

 

 

 

 

 

ESLint 설치 >> 변수 선언이 되어있는지를 바로 알려줌

     

npm init @eslint/config@latest

설치할때 선택한것 

상황따라 다르게 체크

+ eslint 확장프로그램 설치


만약 변수 선언 안된거 표시 안해도 되는 부분이 있으면
eslint.confih.js파일에서 

이런식으로 달주기 ->> 중간에 rules: {} 이렇게 안쪽으로

지정하고 : 표시

표시 >> error > 빨간색

        >> off >> 없앰

        >> warn >  주황색




yarn add -D prisma  >> 스키마를 생성하고 테이블을 관리하는 용도

 

yarn add @prisma/client >>> 쿼리를 날리는 역할 >> 배포시에도 사용

 

yarn prisma init --datasource-provider mysql

     >>mysql 명령어는 Prisma ORM(객체 관계 매핑 도구)을 사용하여 MySQL 데이터베이스를 설정하고 초기화하는 명령어
       1. Prisma 프로젝트 초기화
         2.데이터 소스 설정 >> schema.prisma 파일 내의 데이터 소스 부분을 자동으로 MySQL로 설정

>>>>>>여기까지 하면 기본 셋팅파일이 생김

 

 

 

 

 

Stirng으로 지정하면 기본적으로 varchar가 뜬다 > mysql, prisma
이름을 다르게 쓸거면 @map{"")  >> 이때는 아무리 ''로 prettier로 지정했어도  ""로 작성
이름을 그대로 작성할거면 안쓰면된다

 

prisma / docs  >>>orm에서 보면 더 자세하게 찾아볼 수 있다.

 

 

 

 

 

prisma 확장프로그램 다운후 

 

프라즈마 스키마로 가서
오른쪽 버튼 문서 서식으로 가면 기본포멧터를 프리즈마로 변경 >> 이러면 파일을 자동으로 포멧팅해줌


스키마 만들고 DB테이블 생성 push와 migrate 방법이 있지만

빠른 프로토 타이핑에 적합한 push 선택

 

yarn prisma db push



하고 테이블이 잘 생성되었는지 확인하기

 >> 만든 erd랑 유사한지 확인

 

메세지도 따로 상수폴더안에 관리하면 좋은데

큰 객체안에 분류해서 넣으면 된다.


라우터도 각각 라우터에 api를 풀로 적었었는데

각각 겹치는 라우터끼리 파일에 모아두고 index 라우터 파일에 라우터 대표 api 지정해서 
통으로 묶어서 app.js에 넣으면 된다.





joi로 유효성 검사할때

모든 에러들을 next에 담아두고 따로 만들어둔 에러, 검증 폴더에서
각각 검증별로 파일을 나누고 joi는 스키마를 작성해야하니 먼저 스키마 작성후 검증작업을 하면된다.
>> 또한 검증에 겹치는 부분은 하나로 묶어두기 common

 

 

joi는 같은 값이 들어가게 지정할수 있는데 >> valid(Joi.ref(key:'어떤 키와 동일하게 넣을 것 인지')



회원가입할때 

비밀번호랑 비밀번호 확인을 req.body에서 받았는데

api에서 담을때 굳이 안담아도 된다.

이미 joi에서 검증을 완료했으므로

 

이메일 중복은 따로 조사해봐서 처리해야하기에 바로 확인할 수 없는 부분

그래서 라우터에서 처리해야한다.

>> db로 조회하려면 prisma만들어둔 곳에서 가져온다.



비밀번호 해쉬를 위한 bcypt

 

보통 saltOrRounds는 10으로 사용하긴 한다.

 

 

 

 

 

api검증할때 base url만들어두면 편하다  >>>>>>>>>>>Thunder client  방법찾기 >> 강의는 insomnia였음

 

 

 

 

 

로그인할때는 회원가입과 다르게 비밀번호 제약조건을 알려주지 않는다

>>> 악의적으로 접근하는 사람에게 힌트를 줄 수 있기 때문에

 

 

 

 

 

프리즈마 >> 데이터베이스의 내용과 비교해야할때는 
prisma.x.내장함수({})  >>> 이건 공식문서 찾아보기  >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

 

 

 

 

 

 

 

 

여기에서 밑에 

const isPasswordMatched =

user && bcrypt.compareSync(password, user.password); //db에 저장된 패스워스는 해쉬화 -> 회원가입할때 해쉬로 진행함

 

 

이부분은 db(프리즈마)에서 이메일을 바탕으로 찾은  > 유니크한 유저값을 찾아서  > 유저에 담은걸
이제 변수 isPasswordMatched 

 

부분에 먼저 user이 존재하고,  && 오른쪽에 값을 확인하는데 

bcript.compareSync은  bcrypt 라이브러리의 메서드

입력된 평문 비밀번호(plain text password)와 저장된 해시된 비밀번호(hashed password)를 비교하는 데 사용

 

일치하면 true 아니면 false를 나타낸다.
둘 다 true가 나오면 

 

&&논리 연산자는 둘 다 맞으면 오른쪽 값이 들어가게 되는데 그럼 반환받은 true 가 들어가게 된다.

jwt로 시크릿키 만들기
https://www.avast.com/random-password-generator#mac

Random Password Generator | Create Strong Passwords | Avast

추천

엑세스 토큰 만들때 expiresIn은 유효기간

 

 

 

 

 

환경변수를 추가하면 서버를 껐다가 다시 실행해야한다.

 

환경변수(environment variable)는 운영 체제나 응용 프로그램에서 사용되는 변수로, 시스템 환경이나 프로세스 환경을 설정하고 구성하는 데 사용됩니다. 환경변수는 특정 값들을 저장하며, 이러한 값들은 프로그램이 실행될 때 참조되어 프로그램의 동작을 제어하거나 영향을 줄 수 있습니다. 환경변수는 주로 운영체제에서 사용하는 중요한 설정 정보를 포함하며, 파일 경로, 시스템 설정, 사용자 정보 등이 포함될 수 있습니다.

예를 들어, 환경변수는 다음과 같은 정보들을 포함할 수 있습니다:

	•	PATH: 실행 파일의 경로를 지정하며, 운영 체제가 명령어를 실행할 때 이 경로들을 검색합니다.
	•	HOME 또는 USERPROFILE: 사용자의 홈 디렉터리 경로를 지정합니다.
	•	TEMP 또는 TMP: 임시 파일이 저장되는 디렉터리 경로를 지정합니다.
	•	JAVA_HOME: 자바 개발 키트(JDK)의 설치 경로를 지정합니다.

 

 

 

엑세스토큰  > jwt가 제대로 들어갔는지 확인
https://jwt.io/

JWT.IO

 

 

 

 

 

 

----JWT 발생할 수 있는 에러 -----

 

https://www.npmjs.com/package/jsonwebtoken

jsonwebtoken

 

 

 

 

 

 

 

 

 

프리즈마 받아올때 비밀번호는 제외하고 받아오고 싶으면 

prisma schema에 generator부분에 넣기

previewFeatures = ["omitApi"]

넣고 터미널에 yarn prisma generate

 

https://www.prisma.io/docs/orm/reference/prisma-client-reference

Prisma Client API | Prisma Documentation

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

prisma 설치 >개발용

@prisma/client 설치 > 배포용
yarn prisma init --datasource-provider mysql   >>mysql사용하는데 파일 내의 데이터 소스 부분을 자동으로 MySQL로 설정
 

비밀번호 해쉬 > bcypt
유호성 검증과 에러 처리 > joi

.env사용 > botenv

prettierrc > prettier

nodemon설치