국비지원교육21 JS로 OMDb API 사용하기 API란? Appication Programming Interface 두 소프트웨어(App)의 구성 요소가 프로토콜(통신규약) 집합을 사용하여 서로 요청과 응답하며 통신할 수 있게 되는 방법에 대해 정의해 놓은 것으로 그 정보는 API 문서에 들어 있다. API는 생성 시기와 생성 이유에 따라 네 가지 방식으로 작동할 수 있다. 1. SOAP APIs : 단순 객체 접근(Simple Object Access) 프로토콜을 사용하는 API로, XLM을 사용하여 메세지를 교환. 과거에 더 많이 사용되었으며 유연성이 떨어진다. 2. RPC APIs : 원격 프로시저 호출이라고도 불리는 이 API는 클라이언트가 서버에 대한 함수나 프로시저를 마치고, 서버는 클라이언트에게 다시 결과를 보낸다. 3. Websocke.. 2022. 12. 16. [KDT JS] Node.js Node.js: JS가 동작할 수 있는 웹브라우저와 같은 런타임(프로그래밍 언어가 동작하는 환경)으로, Chrome V8 JS 엔진으로 빌드된, 웹페이지를 제작할 컴퓨터를 JS로 제어할 수 있는 JS 런타임 cf. 웹브라우저에서는 HTML, CSS, JS만 동작한다. Node.js에서 모듈의 도움을 받아 웹 개발을 하고, 웹브라우저가 인식할 수 있는 HTML, CSS, JS 형식으로 JS로 작성된 프로그램을 변환하는 환경 또한 Node.js이다. https://nodejs.org/en/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org LTS(Long Term Supported) 버전은 장기.. 2022. 12. 6. [알고리즘 자습] 문제 해결 접근법 알고리즘이란? 특정 작업을 달성하기 위한 혹은 문제를 해결하기 위해 수행해야 하는 일련의 과정이나 단계를 의미한다. 알고리즘 문제를 풀기 위해, 1. 문제 해결을 위한 계획을 생각해본다. 2. 일반적인 문제 해결 패턴을 파악하고 익힌다. 1. 문제의 이해 ① 내 자신의 말로 문제를 다시 파악하고 설명해보도록 한다. ② 문제에 사용되는 입력값들은 무엇인지 파악한다. ③ 문제의 해답으로 나와야하는 출력값들은 무엇인지 파악한다. ④ 입력값이 출력값을 결정하게 되는지, 문제를 해결할 정보가 충분히 주어졌는지 생각해본다. ⑤ 문제로 제시된 데이터들 중 중요한 부분들이 무엇인지, 어떻게 분류해야 할지, 어떤 이름(용어)을 붙일지 생각해본다. ex) 두 수를 가지고 그들의 총합을 반환하는 함수를 작성하라. ① 내 자.. 2022. 11. 30. [알고리즘 자습] 빅오 표기법(big O notation), 로그(Logarithms) 프로그램의 연산자의 개수로 계산 1. 상수 개의 연산자 : O(1) ... 처리할 자료 개수 n개에 영향받지 않음. ex) 산술 연산자, 변수 할당, 인덱스를 사용한 배열 요소로의 접근이나 키를 이용한 객체 요소로의 접근, 2. 계수 x의 크기에 상관없이 xn 개의 연산자 : O(n) => 빅오 표현식의 단순화 ... ex) 반복문 but 반복문 조건에 따라 다름 ! 3. 계수 x의 크기에 상관없이 x*n*n 개의 연산자 : O(n^2) => 빅오 표현식의 단순화, 최고차항 ... ex) 중첩(nested) 반복문 입력(n)이 커질수록 알고리즘이 얼마나 얼마나 공간을 많이 사용하게 되는지 cf. 보조 공간 복잡도(auxiliary space complexity) : 입력(n)은 제외하고 알고리즘 자체가 .. 2022. 11. 25. [백준] 기본 탐색 - 기초 문제 (1543, 1568, 1302, 1668, 1236) 1543번 문서 검색 ◈ 생각해야할 포인트 - 문서의 길이는 최대 2,500이고 단어의 길이는 최대 50로 다루어야할 데이터 양이 적으므로 시간복잡도에 구애받지 않고 문제를 풀면 되겠다. - 문서의 길이 * 단어의 길이로 모든 경우를 살펴보는 시간복잡도 O(NM)의 프로그램 작성해도 괜찮겠다. 1568번 새 문제이해 : 새가 14마리가 있을 때 1부터 숫자를 외치는데 1을 외칠 때는 한 마리가 날아가면서 외치고, 2를 외칠 때는 두 마리가 날아가고 하다가 4를 외칠 때에는 10마리가 날아가 4마리 밖에 안남아서 그 다음 수 5를 외칠 수가 없다. 그래서 다시 처음인 1부터 외치면서 1마리, 그 다음에 2마리가 날아가고 남은 한 마리는 다시 1을 외치며 날아가서 총 7번의 횟수를 통해 모든 새가 날아가게 .. 2022. 11. 17. VSCode의 확장 프로그램 Comment tagged templates VSCode Plugin 중에 Comment tagged templates를 설치해 사용하면, JS를 작성할 때 JS를 통해 만드는 HTML 부분이나 CSS 부분을 특정하여 하이라이트 되게 해 가독성을 높여주는 프로그램이다 ! 실제로 작성해서 살펴보니, 내가 설정해놓은 테마때문인지 하이라이트는 아니었고, 원래 HTML 파일 작성시의 스타일(색상)으로 변하는 것을 확인할 수 있었다. HTML 코드를 작성할 때에는 /* html */로, CSS 코드를 작성할 때에는 /* css */로 백틱 전에 명시해주면 하이라이트 된다 ! 2022. 11. 9. 1006note SCSS @mixin 키워드를 이용해 매개변수로 SCSS에서 사용할 변수(와 기본값)를 넣어주고, 공통적으로 사용할 스타일을 이름을 정해 @include + 이름으로 불러 사용한다. 변수: size와 color이고, 사용시에는 앞에 const나 let 대신 $를 붙여 사용하면 된다. 기본적으로 변수로 인해 적용될 값은 변수 옆에 : 값 형태로 작성하면 되고, 여러 개의 변수를 사용하고 싶을 때는 , 콤마로 여러 개의 매개변수 형태로 사용하면 된다. 지정한 기본값을 사용하고 싶으면, ( )를 사용하지 않고 @include와 이름만 작성하면 된다. 기본값이 아닌 값을 사용하고 싶을 때에는 명시해서 이름(값, 값) 과 같이 넣어주되, 단 매개변수에 지정한 순서(위치)대로 값을 넣어줘야 원하는 변수의 값으로 사용할 수 .. 2022. 11. 4. 클래스 이름 container? wrapper? 웹페이지 클로닝을 하다 클래스 이름으로 자주 등장하는 container와 wrapper에 대해서 궁금해졌다. 둘다 요소를 감싸거나 포함한다는 의미를 담고 있는 줄은 아는데, 어떨 때 container라는 이름을 붙이는지 어떨 때 wrapper라는 이름을 붙이는지 궁금했다. 애매한건 또 못 참지. 검색을 하다 보니, 어느 블로거 분이 두 명칭 차이를 이해하는데 도움이 되었다는 stack overflow의 글. https://stackoverflow.com/questions/4059163/css-language-speak-container-vs-wrapper CSS Language Speak: Container vs Wrapper? What's the difference between container an.. 2022. 11. 4. JS 표준 내장 객체 - String 메서드 String .charCodeAt() / String.fromCharCode(아스키번호) .includes(str) .indexOf(str) .match(RegExp) .padStart() / .padEnd() .replace() .slice(시작 인덱스, 끝 부분의 다음 인덱스) .split('구분자') / .join('구분자') .startsWith() .substring(begin index) / .substring(begin index, end index) toUpperCase() / toLowerCase() .trim() . 2022. 10. 28. 이전 1 2 3 다음
