공부하자 공부 공부하자 공부

1. for문 // 1부터 5까지 차례로 더하기 // 반복문 이전의 방법 let result = 1; result = result + 2; result = result + 3; result = result + 4; result = result + 5; console.log(result) // 15 // 반복문 let result = 0; for(let i = 1; i

if 문 if (조건식) { // 조건식의 타입은 boolean(true / false)이 되도록 // 내부 코드 } if문은 주어진 조건식의 참 / 거짓 여부에 따라 내부 코드의 실행이 결정된다. 조건식은 boolean타입이 되도록 작성해야 한다. 동치 연산자 ( === ) 'a' === 'a' // true 'a' === 'b' // false 'a' !== 'a' // false 'a' !== 'b' //true 동치 연산자는 두 피연산자가 동일하면 true, 그렇지 않으면 false를 반환한다. !==는 반대로 두 피연산자가 동일하지 않을 때 true를 반환한다. 비교 연산자 ( >, =, 20 // false 10 >= 10 // true 10

1. UI / UX란? 1) UI (User Interface, 사용자 인터페이스) 사람들이 컴퓨터와 상호작용하는 시스템을 의미. ex) 화면에 보이는 그래픽 요소뿐만 아니라 물리적인 키보드, 마우스도 포함. [1] GUI(Graphical User Interface, 그래픽 사용자 인터페이스) - 사람들이 그래픽을 통해 컴퓨터와 상호작용하는 시스템을 의미. - 터미널과 같은 CLI(Command Line Interface)로도 충분히 컴퓨터와 상호작용 할 수 있지만 그래픽 사용자 인터페이스를 사용 하면 더 직관적이고 간편하기 때문에 현대사회에서는 그래픽 유저 인터페이스가 굉장히 중요한 역할. - 프론트엔드 개발자로서의 UI는 대부분 GUI를 의미. 2) UX (User Experience, 사용자 경험..

얼마 전 수업에서 한 세션이 끝나며 회고를 진행했다. 분명 내가 더 잘 알고 이해하고 공부하려고 블로그를 작성해야 하는데 그러지 못해서 손을 놓고 있었다. 그래서 내용 정리를 끝낸 것만 블로그에 올리기로 결심했다. 물론 하나 블로깅 하는데 시간이 더욱 많이 걸릴 수 있다. 하지만 천천히 꾸준히 해보면 다 작성하는 날이 올꺼라고 믿는다. 가자!

REST API (Representational State Transfer API) 웹에서 사용되는 데이터나 자원(Resource)을 HTTP URI로 표현하고, HTTP 프로토콜을 통해 요청과 응답을 정의하는 방식이며 요청과 응답의 메뉴판이라 할 수 있다. REST API 디자인 디자인이라고 해서 뭐지?라는 생각이 들 수 있겠지만 쉽게 말해 잘 만드는 법이라고 생각하면 된다. REST API를 잘 적용하기 위한 4단계 모델을 만들었는데 이것을 REST 성숙도 모델이라 부른다. REST 성숙도 모델은 총 4단계(0~3단계)로 나누어진다. 모든 단계를 충족해야 REST API라고 부를 수 있다고 하지만 엄밀하게 3단계까지 지키기 어렵기 때문에 2단계까지만 적용해도 좋은 API 디자인이라고 한다. 이런 경우..

오늘은 props와 state를 공부하며 과제를 진행했다. 전보다 컴포넌트를 세분화하고 컴포넌트끼리 데이터를 주고받으며 컴포넌트 안에서 값을 바꾸는 것을 배웠다. 아직까진 공부하면서 벅찬다기보단 재미가 조금 있는 것 같다. 구현을 못하고 있다가 구현이 되면 이 성공했다는 기분이 좋다. 이 기분 계속 가져가고 싶다. props 컴포넌트의 속성이며 변하지 않는 값이다. 컴포넌트 외부에서 값을 전달받는다. 부모 컴포넌트(상위 컴포넌트)로부터 전달받은 값이다. 어떤 타입이라도 값을 전달하기위해 객체의 형태를 가진다. 외부에서 전달받고 변하지 않는 값이기 때문에 읽기 전용 객체이다. (읽기 전용이 아니라면 전달받은 값을 하위 컴포넌트에서 수정 시 값을 전달해준 상위 컴포넌트의 값도 바뀌기 때문에 개발자가 의도하지..

오늘은 React SPA를 배웠다. 이전 같은 경우에는 다른 내용을 출력하려면 다른 HTML을 만들어서 출력했어야 했다. HTML에서 내가 바꾸고 싶은 내용만 바꾼다는 것이 신기했다. 이벤트 핸들러를 사용하지 않고도 다른 것에 변화를 줄 수 있다는 것도 알게 되었다. React SPA 페이지를 바꿀 때 원래는 매번 페이지 전체를 불러와야 했다. 하지만 매번 페이지를 불러오면서 사용자와 서비스 간 상호작용이 많아지게 되면 중복되는 요소들 때문에 불필요한 트래픽이 발생한다. 그로 인해 사용자 입장에서는 서비스의 느린 반응을 경험하게 된다.(좋지 않은 사용자 경험(UX)을 제공하게 된다) SPA를 사용하게 되면 중복되는 부분은 불러오지 않고 바꾸려는 부분만 불러오기 때문에 불필요한 트래픽이 감소되면서 위의 단..

오늘은 HTML과 JS가 묶여있다고 생각되는 리액트의 인트로를 배웠다. 이번 주는 새로운게 너무 많아... React 리액트는 프론트앤드 개발을 위한 Java Script 오픈소스 라이브러리라고 불린다. 리액트를 배워야하는 이유 선언형(명시적이다) - 코드를 자세히 분석을 안하고도 코드의 의도를 분명히 알 수 있는 것을 말한다. (jsx를 활용하여 직관적으로 작성이 가능하다.) 컴포넌트 기반 - 하나의 가능을 구현하기위해 여러 종류의 코드를 묶어 놓은 것을 말한다. (컴포넌트로 분리하면 서로 독립적이고 재사용이 가능하기 때문에, 기능 자체에 집중하여 개발할 수 있다.) 범용성 - s프로젝트 어디든 유연하게 적용가능이 가능하다. 번외 - facebook에서 만든 오픈소스이기 때문에 관리가 안정적이고 가장 ..