본문 바로가기
반응형

전체 글601

코드스테이츠 소프트웨어엔지지어링 부트캠프 +25일 SPA (Single Page Application) 필요한 부분만 서버에서 전달받아 업데이트 하고 중복되는 부분은 냅둔다. 전통적인 방식은 전체를 새로 로딩하기 때문에 불필요한 트래픽이 발생한다. JS크기가 크기때문에 첫 로딩시간이 길다. 구글 네이버등 검색엔진은 HTML을 분석하여 검색기능을 구동하는데 SPA의 경우 HTML이 가볍기 때문에 SEO가 좋지 않다. 하지만 이러한 단점은 사라지는 추세이다. 라우팅(Routing) SPA는 하나의 페이지를 갖고 있지만 사실 한 종류의 화면만 사용하지 않는다. 메신저의 경우 홈, 메시지창, 프로필 등 한 화면에서 여러종류의 작은 화면들이 필요하다. 또한 이 화면에 따라 '주소' 도 달라질 것이다. 이렇게 다른 주소에 따라 다른 뷰를 보여주는 과정을 경로에 따.. 2021. 8. 12.
코드스테이츠 소프트웨어엔지지어링 부트캠프 +24일(외계어 리액트) 외계어 리액트 리액트는 외계어다 React의 3가지 특징 : React는 프론트엔드 개발을 위한 JS라이브러리이다. 선언형 범용성 컴포넌트 기반 JSX : JS를 확장한 문법으로 브라우저가 바로 실행할 수 있는 JS코드가 아니다. Babel은 JSX를 브라우저가 이해할 수 있게 컴파일해주는 역할을 한다. 우리가 JSX코드로 개발을 하면 Babel이 JS코드로 컴파일 하여 브라우저가 읽을 수 있게 해준다. JSX가 왜 명시적인가? HTML과 JS가 결합한 문법으로 직관적이다. React Component의 필요성 하나의 기능 구현을 위해 여러 코드를 묶어둔것을 컴포넌트라고 한다. 컴포넌트를 분리하면 서로 독립적이고 필요할 때 간편하게 재사용이 가능해서 기능에 집중하여 개발할 수 있다. 몰랐던것: JS는 중.. 2021. 8. 12.
JS 배열 합치는 3가지 방법 배열 합치는 3가지 방법 concat() 메서드 ...spread operator(전개연산자) push() 1. concat() 인자로 주어진 배열이나 값들을 기존 배열에 합쳐서 새 배열을 반환한다. 기존 배열을 변경하지 않고 새로운 배열을 반환한다. const array1 = ['a', 'b', 'c']; const array2 = ['d', 'e', 'f']; const array3 = array1.concat(array2); console.log(array3); // expected output: Array ["a", "b", "c", "d", "e", "f"] concat은 호출한 배열 뒤에 각 인수를 순서대로 붙여 새로운 배열을 만든다. 인수가 배열이면 그 구성요소가 순서대로 붙고, 배열이 아니.. 2021. 8. 11.
코드스테이츠 소프트웨어엔지지어링 부트캠프 +23일 고차함수 일급객체의 특징 3가지 변수에 할당할 수 있다. 다른 함수의 인자로 전달될 수 있다. 다른 함수의 결과로서 리턴될 수 있다. 고차함수 함수를 인자로 받을 수 있고 함수의 형태로 리턴할 수 있는 함수. 인자로 전달되는 함수를 콜백 함수라고 한다. 내장 고차함수 자바스크립트에는 기본적으로 내장된 고차함수가 있다. 그 중 배열 메소드들 중 일부가 대표적인 고차함수에 해당된다. filter : 걸러내기 위한 조건을 명시한 함수를 인자로 받는다. 콜백함수는 true, false 만 리턴한다. map : 배열 내의 모든 요소 각각에 주어진 함수를 호출하고 그 리턴값을 모아 새로운 배열을 반환한다. 이전배열을 수정하지 않음 reduce : 배열의 각 요소에 대해 주어진 함수를 실행하고 하나의 결과값을 반환한다. 2021. 8. 11.
반응형