5.2
Node 다루기 전,
promise 를 배우고 가자 !
- 콜백관리가어려우니 ajax를 사용한다.
- ajax는 제이쿼리가 필요하다
- promise기반의 axios를 쓰자 그냥 ( good ).
- ~자매품 fetch도 있어요~
- promise 함수의성공 리턴값은 resolve (안에다가)
- 실패 리턴값은 reject( 안에다가 )
//promise (프로미스)
// :비동기 함수 동기처리하기 위해 만든 객체
// : 성공,실패 분리해서 반환
// 성공이든 실패든 무언가의 최종 결과
// resolved: 성공
// rejected : 실패
// 프로미스를 콜백함수 전달할 필요 X :just 호출 하면 댐
// 1. 프로미스 생성하는 코드
// promise1. 함수의 return 값이 Promise 객체
// - resolve() : 성공한경우 , 프로미스 사용시 then 메서드와 연결
// - reject() : 실패한경우, 프로미스 사용시 catch 메서드와 연결
// 2. 프로미스 사용(소비)하는 코드
// 프로미스가 작동하고나서 사용할 기능은 .then()이후에 적으면 된다.async
// async / await
// 비동기 처리 패턴중 가장 최신 문법
// promise 기반 코드를 더 가독성 있게 하기 위해 등장.
// 구조
// - 함수 앞에 async 키워드 붙이기
// - 비동기 처리 메서드 앞에 await 키워드 붙이기 ( 해당 작업을 기다려 줄 것 )
// async function 함수명() {
// await 비동기처리메서드명();
// }
// async 랑 await 는 세트 ! 같이 써야함.
// async/await 예외처리는 try catch 를 사용한다
try {
// 코드 실행 ing
// 에러 발생시 catch로 이동
} catch (error) {
// 에러 관리
}
// - try 블록 코드가 실행
// - try 블록에서 에러가 없다면 .catch 블록은 건너뜀
// - try 블록에서 에러가 있다면, try 블록 실행이 중단 -> catch 블록 코드 실행
form
- 입력된 데이터를 한 번에 서버로 전송 하기 위해 사용
- 즉, 클라이언트가 서버에게 정보 전달 할 때 사용
- 속성 : action,name,target,method
- 폼 요소 :
<input>,<select>,<textarea>,<button>
- action : 폼을 전송할 서버 주소 지정
- name : 폼을 식별하기 위한 이름 // document.forms['form태그_name속성값']
- method : 폼을 서버에 전송할 http 메소드 지정
- target : action 속성값에 지정한 스크립트 파일을 현재 창이 아닌 다른 위치에서 열 수 있도록 함( _target,_blank ...)
GET 방식
- 폼에 입력한 정보가 url 에 추가되어 보임
POST 방식
- 로그인과같은 안전한 처리방식은 POST를 사용해야함.
- URL 에 가려져서 작동함.
input 속성
type : 인풋 타입
name : 이름지정 ,bE에서 name으로 key가 설정 된다.
readonly : 읽기 전용 ( 수정 불가)
autofocus : 자동 focus
- nodemon 패키지 : 자동으로 node를 재실행하는 패키지
- npm i -g nodemon
- npx nodemon app.js
back to node.js
body.parser :
app.use(express.urlencoded({ extended: true })); // post 요청으로 들어오는 모든 형식의 데이터를 파싱 (분석)
app.use(express.json()); // json 형태로 데이터를 주고받음
// 두개를 작성해야 post 의 데이터를 확인 할 수 있는,
// req.body parser를 사용할 수 있음.
/**
* 라우팅(routing) : 경로 설정
* 브라우저에서 어떤 url 로 접속 했을 때 어떤 페이지를 보여줄 것인가 ( 라우터의 뜻 )
* 루트경로
* localhost:PORT/ 로 접속 했을 때, index.ejs 를 보여주겠다.
*/
It's the smurf smurf smurf!