TIL day 06

어니언·2023년 1월 17일
0
post-thumbnail

오늘은 저번주 금요일에 배운 axios의 활용에 대해서 배웠다.

axios는 rest-api를 할 때 브라우저, node.js를 위한 HTTP비동기 통신 라이브러리이다.

기능으로는
promise, Async/Await 등이있다.

사용방법은 yarn add axios를 vscode 터미널에 입력을하여 설치완료후, 코드에 작성하여 이용하면 된다.

axios http의 메서드종류로는 아래4가지가있다.

axios.get("url주소",) : 서버에서 데이터를 가져올 때 사용하는 메서드이다.

axios.post("url주소",) : 서버에 데이터를 새롭게 생성 할 때 사용하는 메서드입니다. 두번째 파라미터로는 생성할 데이터를 넘깁니다.

axios.put("url주소",) : 서버에 있는 특정 데이터를 수정할 때 요청하는 메서드입니다. put은 새로운 리소스를 생성, 이미존재하는 데이터를 대체할 때 사용되어집니다.

axios.delete("url주소",) : 서버에 있는 특정 데이터나 값을 삭제할 때 요청하는 메서드입니다.

콜백함수
콜백함수에는 보통의 함수에서 인자로 넣는 데이터는 문자열, 숫자열, 배열, 객체등 이있는데 함수자체도 인자로 들어갈 수 있다. 또는,

이벤트에 의해호출되어지는 함수도 있다. html에서 미리 만들어 놓은 함수에서 동작이 이루어지면 함수가 실행되고 그함수가 또다른 함수를 실행하게 하는 것을 이벤트에 의해 호출되어지는 함수라고 합니다.

이러한 콜백함수는 동기적함수와 비동기적함수로 나뉘어진다.
동기적방식은 코드를 위에서 부터 아래로 내려가면서 순서대로 코드가 완료된 후 다음 코드를 실행하는 것을 말하고, 비동기적방식은 위에서부터 아래로 내려가면서 코드를 읽고 완료 다음 코드를 수행하는 것이아닌 현재실행중인 코드완료여부와 상관없이 다음코드로 넘어가서 실행을 시키느 방식을 말한다.

서버로보내는 코드의 경우 비동기적 방식이 필요하지만 , 기본 세팅이 동기적방식으로 되는 경우 이것을 보완해주기 위한 기능이 axios에 있는 async, await기능이 있다.

비동기 작업을 수행하고자하는 함수 앞에 async를 표기, 함수 내부에 실질적인 비동기 작업이 필요한 곳 마다 await을 작성해주면 뒤으 내용이 promise로 자동전환이 되고 해당내용이 해결 된 후 진행될 수 있도록 도와줍니다.

promise...

환경변수분리

coolsms, email을 보내는 작업을 할 때 개인이 부여받은 apikey, 2차 암호가 있을 것이다.
이러한 개인적인 정보를 하드코딩이 된 상태에서 git허브에 추가를 하게되면 해커들에게 개인정보가 날라가 보안에 큰 문제가 생길 수 있다 이를 막기위해 env파일을 폴더에 추가하여
env파일에 변수를 작성, 각각의 개인정보자료를 올리고 .gitignore 파일에 env파일명을 추가해주면된다.
이후 하드코딩이 되어있는 코드들을 env파일에 변수로 작성한것을 불러오는 작업을 통하여
개인정보를 코드에 입력하지않고 불러들여 안전하게 정보를 끌어올 수 있도록 도와주는 것을 환경변수분리라고 할 수 있다.

profile
안녕하세요.

0개의 댓글