전체 글

피어나는 프론트엔드 개발자 이도이입니다. 방문해주셔서 감사합니다🌱
📌Axios란? HTTP Client(HTTP 상에서 커뮤니케이션 하는 자바기반 컴포넌트) 를 내장하고 있는 Angular와 다르게, 리액트에는 따로 내장하는 내장클래스가 존재하지 않는다. 따라서 리액트에서 AJAX(비동기 웹 애플리케이션) 를 구현하기 위해서 Javascript 내장 객체인 XMLRequest를 사용하거나, 다른 HTTP Client를 사용해야 합니다. 그렇다면 어떤 HTTP Client 라이브러리를 사용하는게 좋을까요? 현재 리액트에서 가장 많이 사용하고 있는 HTTP Client라이브러리는 Fetch API와 Axios가 있다 📌React에서 Axios 구현하기 1. Axios 설치 npm install axios yarn add axios // 생성한 프로젝트 상단에 import로..
javascript를 사용하다보면 너무나 자주 마주하는 함수들!! 한번은 정리할 필요가 있다고 생각했다. 📌for()for (int i = 0; i let arr = [];for (let i = 0; i  가장 빠르고 단순하다. 그래서 효율적이다.모든 자료형에 대해 사용이 가능하다.중간에 loop 건너뛰기나 종료가 가능하다. (continue or break)반복범위 컨트롤이 가능하다. (i++, i–, i+=2*i 등)변수를 활용할 수 있다. (var i 값을 사용할 수 있다) 📌foreach()arr.forEach(function(v, i, arr) { console.log(v);});let numbers = [1,2,3,4,5,6];// flag가 forEach함수문에 이름이라고 생각하면 됨 ..
console.dir(event.target); 이 코드를 사용하면 event.target의 속성을 알 수 있다. console.log로 하면 안나온다!! console.log(event.target.parentElement.innerText) target은 클릭된 HTML element요소를 가리킨다. 그리고 모든 HTML element요소 하나 이상의 property가 있다. parentElement 는 클릭된 element의 부모이다. event.target -> button event.target.parentElement -> li event.target.parentElement.innerText -> 내가 쓴 list text들이 console.log 창에 뜬다. - JSON.stringify ..
- Math.random() Math는 많은 function들을 가지고 있는데 그중에서 random()은 0 ~ 1 사이의 랜덤한 숫자를 제공한다. Math.random() * 10 하면 0에서 10사이의 숫자들을 얻을 수 있다. - Math.round() round()를 쓰면 1.5 -> 2 / 1.4 -> 1 / 1.3 -> 1를 돌려준다. 즉 반올림을 해서 돌려준다. - Math.ceil() 숫자를 천장까지 높여주는 것 / 1.01 , 1.5, 1.3 -> 전부다 2가 된다. 1.0만이 1이 된다. - Math.floor() 숫자를 마루까지 낮춰주는 것 / 1.9999, 1.4, 1.01 -> 전부다 1이 된다. 2.0만이 2가 된다. - Math.floor(Math.random() * 10) 이렇..
오버라이딩은 상속이 되어야 가능하다. 상속이 없으면 오버라이딩은 성립할 수 없다.  생성자 클래스 이름과 동일한 명칭을 가지고 있는 메서드이다. 그러면 Parent 클래스에서는 Parent 메서드가 생성자이고, Child 클래스에서는 Child 메서드가 생성자이다. 상속 class A{ }class B extends A { }상속할 때 B extends A를 보고 B는 자식이고, B의 부모는 A구나를 알 수 있다.  이것은 상속이지 오버라이딩이 아니다.  오버라이딩(overriding) 상속 관계여야 오버라이딩이 가능하다. class A { void fn(){};}class B extends A{ void fn(){};}보면  A랑 B랑 상속 관계인데, 메서드가 fn이 똑같이 있다...
진행중이던 프로젝트를 하면서 로그인 회원가입 UI를 짜고 서버와 연결을 하려고 했는데 계속 해서 뜨는 CORS 정말정말 며칠을 이거 때문에 고생했다..... 🚫CORS란? CORS(Cross-Origin Resource Sharing)는 출처가 다른 자원들을 공유한다는 뜻으로, 한 출처에 있는 자원에서 다른 출처에 있는 자원에 접근하도록 하는 개념이다. 직역하면, 교차되는 출처 자원들의 공유이다. 다른 출처에 있는 자원을 요청한다고 하면, 이를 교차 출처 요청이라고 부른다. 여기서 나온 origin 출처는 무엇일까? Origin은 URL에서 프로토콜, 호스트(도메), 포트 번호를 합친 부분을 의미한다. 3가지가 같으면 동일 출처(Origin)라고 한다. ✅ http or https → 프로토콜 ✅ nav..
REST(Representational State Transfer) API란? HTTP URI(Uniform Resource Identifier)를 통해 자원(Resource)을 명시하고 HTTP Method(POST, GET, PUT, DELETE, PATCH 등)를 통해 해당 자원(URI)에 대한 CRUD Operation을 적용하는 것을 의미합니다. REST 구성 요소 자원(Resource) : HTTP URI 자원에 대한 행위(Method) : HTTP Method 자원에 대한 행위의 내용 (Representations) : HTTP Message Pay Load REST 구성 = Resource(자원) + Method(행위) + Representation of Resource(자원의 형태). C..
· Cloud/AWS
https://aws.amazon.com/ko/?nc2=h_lg  클라우드 서비스 | 클라우드 컴퓨팅 솔루션| Amazon Web Services aws.amazon.comAWS(Amazon Web Service)란 무엇인가?아마존닷컴에서 개발한 클라우드 컴퓨팅 플랫폼이다. Amazon Web Services는 아마존(Amazon)에서 제공하는 클라우드 서비스로, 네트워킹을 기반으로 가상 컴퓨터와 스토리지, 네트워크 인프라 등 다양한 서비스를 제공하고 있다.비즈니스와 개발자가 웹 서비스를 사용하여 확장 가능하고 정교한 애플리케이션 구축하도록 지원하여 준다. 클라우드란?데이터를 보관, 정리, 분석하고 새로운 서비스를 빠르게 추진할 수 있도록 각종 인프라와 IT 기술을 빌려주는 서비스인터넷 기반의 컴퓨팅. ..
2-doooo-2
doyI-T