안녕하세요. 진득 코딩입니다.  이번 시간에는 그동안 만들던 뉴스 웹페이지에 페이지네이션을 적용하고 마무리하는 시간을 가져보겠습니다.  페이지네이션   페이지네이션을 적용하기 전에 우선 API 문서부터 확인해 보도록 하겠습니다.  해당 문서에서 제공하는 정보를 살펴보면 pageSize는 20이 default 값으로 페이지 당 20개의 데이터가 오는 것을 확인할 수 있습니다.  또한 현재 보고 있는 페이지를 page로 알 수 있습니다.  위 문서에는 없지만 totalResults도 알 수 있습니다. HTML   먼저 HTML을 살펴보도록 하겠습니다.  HTML에 있는 부분은 거의 없습니다.  pagination이 들어갈 section이 추가되었습니다.   태그로 되어 있는 것은 pagination의 특성상..

안녕하세요. 진득 코딩입니다.  지금까지 뉴스 웹 페이지를 만드는 과정은 웹 페이지가 정상적으로 작동할 때만을 고려해서 만들었습니다.  에러가 생겼을 때 개발자는 개발자 툴을 통해서 에러 상황을 알 수 있지만 유저 입장에서는 이러한 상황을 알 수 없습니다.  이렇게 에러에 대해서 유저를 고려해서 필요한 것이 에러 핸들링입니다.  이번 시간에는 에러 핸들링하는 법에 대해 알아보도록 하겠습니다. try-catch문   에러 핸들링을 하는 방법으로 try-catch문이 있습니다.  try-catch문에 대해 알아보기 위해 에러가 발생하는 상황부터 알아보도록 하겠습니다.  위와 같이 그냥 문자열만 써놓으면 어떻게 될지 생각해 봅시다.   위와 같은 그냥 문자열만 써놓으면 당연히 에러가 발생하게 됩니다.   이때..

안녕하세요. 진득 코딩입니다.  이번 시간에는 API를 이해하기 위한 필수 개념인 자바스크립트의 동작 원리에 대해 살펴보도록 하겠습니다.     위와 같은 코드가 있으면 어떤 결과가 나올지 예상하는 것은 쉽습니다.   예상한 대로 1, 2, 3이 순서대로 출력된 것을 확인할 수 있습니다.  이처럼 자바스크립트 코드는 위에서부터 아래로 차례대로 실행됩니다.  이를 동기적 프로그래밍이라고 합니다.   자바스크립트 엔진은 Memory Heap 영역과 Call Stack 영역으로 나뉩니다.  Memory Heap 영역은 변수와 같은 메모리들을 두서없이 저장해 놓는 메모리 공간입니다.  Call Stack은 실행하는 역할을 담당합니다.  stack은 자료형 중 한 종류로 LIFO(Last In First Out)..

안녕하세요. 진득 코딩입니다.  지난 포스팅까지 프로그래밍을 할 때 알아야 할 메인 속성들을 살펴보았습니다.  이번 시간에는 이러한 메인 속성들 중 마지막 메인 속성인 함수에 대해 알아보도록 하겠습니다.  함수  함수는 일의 단위입니다.  로직을 짤 때 테스크들이 따로따로 돌아다니게 되면 관리하기가 힘들어집니다.  이때 이런 테스크들을 하나로 모아서 관리하기 위해 나온 것이 함수입니다.   위와 같이 하나의 일을 하기 위해 여러 코드들을 사용하는 예시가 있습니다.  하지만 매번 햄버거를 만들 때마다 위 코드를 하나하나 다 적어주는 건 효율적이지 않고 오류의 가능성이 높아집니다.    위에 있는 여러 코드들을 함수로 묶어서 한번에 표현할 수 있습니다.  위와 같이 표현하게 되면 각 함수만 호출하면 안에 있..

안녕하세요. 진득 코딩입니다.  저번 시간에는 자료형 중 여러 데이터들을 쉽게 다룰 수 있는 배열에 대해 알아보았습니다.  이번 시간에는 마지막 자료형인 Object(객체)에 대해 알아보도록 하겠습니다. 객체  객체는 한 데이터에 많은 정보를 담아야 할 때 사용합니다.   object를 사용하기 위해서는 중괄호({ })를 사용하여 object에 넣을 데이터들을 넣어줍니다.  각 데이터는 데이터의 이름 뒤에 :을 붙여서 각각의 데이터를 넣어줘서 사용합니다.  출력할 때는 해당 object의 이름을 넣어서 출력해 주면 됩니다.   object를 출력하게 되면 위와 같이 출력되게 됩니다. 객체 출력하기   이때 객체에 들어있는 모든 데이터가 아닌 특정 데이터를 보고 싶은 상황이 생길 수 있습니다.  이럴 때는..