1. 마크업 완성 시키기현재 내가 맡은 부분은 로그인 및 회원 가입이다.나이키 공식 홈페이지를 보면, 여기는 로그인과 회원가입이 따로 구분을 하지 않았다. 이메일을 입력하면 만약에 없다는 가정하에 아래와 같이 약관동의 페이자가 나온다.그 뒤에이렇게 입력 폼이 나오면 회원가입이 끝난다. 오랜만에 이러한 프로젝트를 진행하는데, 처음 프로젝트 세팅부터가 오래 걸린 것 같았다. 패키지 설치 및 노션 정리, 컨벤션 회의 등등....프로젝트 하기 전에는 많은 준비가 필요했다. 근데 당연한 것 같다. 하루 이틀 프로젝트도 아니고 3주짜리에, 이는 파이널을 위한 연습이기에 더욱 확실한 준비가 필요했다. 그래서 우리조의 경우는 빠르게 노션, 패키지를 정리한 후 각자 맡을 기능들을 빠르게 정했다. 나는 예전에 로그인 회원..

1. 에러 처리의 필요성우리는 코드를 작성할 때 에러를 발생하지 않는 코드를 작성한다? 이것은 있을수가 없다.그래서 우리가 에러가 났을 때, 대처할 수 있는 방법이 몇가지 있다. 그 중에 소개해 줄 것은 try..catch..finally 문이다. 1-1. try .. catch .. finallytry catch 문을 사용하여 발생한 에러에 적절하게 대응하면, 프로그램이 강제 종료되지 않고 계속해서 코드를 실행할 수 있다.console.log('[Start]');try { foo();} catch(error) { console.error('[에러 발생]', error); // 에러 발생}// 발생한 에러에 적절한 대응을 하면 프로그램이 강제 종료되지 않는다.console.log('[End'); c..

REST REpresentational State Transfer는 HTTP/1.0과 1.1의 스펙 작성에 참여했고 아파치 HTTP 서버 프로젝트의 공동 설립자인 로이 필딩의 2000년 논문에서 처음 소개되었다. 발표 당시의 웹이 HTTP를 제대로 사용하지 못하고 있는 상황을 보고 HTTP의 장점을 최대한 활용할 수 있는 아키텍쳐로서 REST를 소개했고 이는 HTTP 프로토콜을 의도에 맞게 디자인하도록 유도하고 있다. REST의 기본 원칙을 성실히 지킨 서비스 디자인을 "RESTful" 이라고 표현한다. 즉, REST는 HTTP를 기반으로 클라이언트가 서버의 리소스에 접근하는 방식을 규정한 아키텍쳐고, REST API는 REST를 기반으로 서비스 API를 구현한 것을 의미한다. 1. REST API의 구..

1. ajax자바스크립트를 사용하여 브라우저가 서버에게 비동기 방식으로 데이터를 요청하고, 서버가 응답한 데이터를 수신하여 웹페이지를 동적으로 갱신하는 프로그래밍 방식을 말한다.ajax는 브라우저에서 제공하는 Web API인 XMLHttpRequest 객체를 기반으로 동작한다. XMLHttpRequest는 HTTP 비동기 통신을 위한 메서드와 프로퍼티를 제공한다. 왼쪽은 전통적인 웹페이지의 단점이전 웹페이지와 차이가 없어서 변경할 필요가 없는 부분까지 포함된 완전한 HTML을 서버로부터 매번 다시 전송받기 때문에 불필요한 데이터 통신이 발생한다.변경할 필요가 없는 부분까지 처음부터 다시 렌더링한다. 이로 인해 화면 전환이 일어나면 화면이 순간적으로 깜박이는 현상이 발생한다.클라이언트와 서버와의 통신이 동..

1. 동기처리와 비동기 처리함수를 호출하면 함수 코드가 평가되어 함수 실행 컨텍스트가 실행된다. 이때 생성된 함수 실행 컨텍스트는 실행 컨텍스트 스택(콜 스텍이라고 부른다)에 푸시되고 함수 코드가 실행된다.함수 코드의 실행이 종료하면 함수 실행 컨텍스트는 실행 컨텍스트 스택에서 팝되어 제거된다. 함수가 호출된 순서대로 순차적으로 실행되는 이유는 함수가 호출된 순서대로 함수 실행 컨텍스트가 실행 컨텍스트 스택에 푸시되게 때문이다. 이처럼 함수의 실행 순서는 실행 컨텍스트 스택으로 관리한다.자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 갖는다. 최상위 요소인 실행 중인 실행 컨텍스트를 제외한 모든 실행 컨텍스트는 모두 실행 대기 테스크들이다. 현재 실행 컨텍스트가 POP되어 스택에서 제거 되면 다음 실..

1. 일급 객체 다음 조건을 만족한느 객체는 일급 객체이다.무명의 리터럴로 생성할 수 있다. 즉, 런타임에 생성이 가능하다.변수나 자료구조(객체, 배열 등)에 저장할 수 있다.함수의 매개변수에 전달될 수 있다.함수의 반환값으로 사용할 수 있다.// 1. 함수는 무명의 리터럴로 생성할 수 있다.// 2. 함수는 변수에 저장할 수 있다.// 런타임(할당 단계)에 함수 리터럴이 평가되어 함수 객체가 생성되고 변수에 할당된다.const increase = function (num) { return ++num;};const decrease = function (num) { return --num;};// 2. 함수는 객체에 저장할 수 있다.const auxs = { increase, decrease };// ..