프론트엔드 개발

function is object type Parameters premitive parameters: passed by value object parameters: passed by reference (메모리에 ref가 전달) Rest parameters ( ES6에서 추가) // parameters가 ...으로 선언하면 배열로 전달되어진다. function printAll(...args) { for(let i = 0; i console.log(arg)); }; printA..

1. primitive type - 더 이상 나눠질 수 없는 - 값 자체가 메모리에 저장된다 number special numeric values const infinity = 1 / 0; // Infinity const netativeInfinity = -1 / 0; // -Infinity const nAn = 'not a number' / 10; //NaN string boolean falsy 한 값: 0, null, undefined, NaN, '' truthy: 어느 값이든 있는 null 텅텅 비어있는 empty 값, 값이 할당이 되어 있는 undefined 선언은 되었지만, 값이 지정되어있지 않은 symbol 동시에 다발적으로 일어날 수 있는 코드에서 우선순위를 주고 싶을 때 사용 고유한 식별자..

varaible * mutable = 값을 계속 변경될 수 있는, all objects type * immutable = 값을 변경할 수 없는, primitive type var 1. 값을 재선언 및 재할당 할 수 있다 console.log(age); //undefined age = 4; console.log(age); //4 var age; 첫 줄에서 변수는 정의되어있지만, 값이 안 들어가 있다는 의미. 값을 할당하고 console.log를 찍어보면 값인 4가 반환된다. => var hoisting 호이스팅은, 어디에서 선언하는 것과 상관없이 제일 위로 끌어올려주는 것. 자바스크립트는 ES6에서 도입된 let, const를 포함하여 모든 선언(var, let, const, function, functi..

앞서 CSR과 SSR을 비교해 보면서 정리해보면, 각 브라우저의 크롤러들이 해당 페이지에서 내용을 찾게 될 때, SEO적인 측면에서 SSR을 고려해볼 필요가 있다고 생각하였습니다. SEO 뿐만이 아니라 html을 먼저 뿌려주기 때문에, 유저가 처음 들어왔을 때, 빠르다고 느끼다고 생각할 수 있습니다. React에서, SSR을 적용하려면 몇 개의 프레임워크들이 있습니다. https://jthcast.dev/posts/gatsby-versus-nextjs/ 이글에서Gatsby와 Next.js의 차이를 알 수 있습니다. 저는 SSR과 SSG방법을 모두 사용 가능한 Next js를 선택하겠습니다. Next.js는 리액트를 기반으로 한 SPA를 빠르게 빌드할 수 있도록 도와주는 프레임워크입니다. Next js는 ..

CSR 동작 방식 처음에 웹서버에 요청할 때, 서버는 데이터가 없는 문서를 반환한다. HTML 및 static파일들이 로드되면서 데이터가 있다면, 데이터 또한 서버에 요청하고 그것이 화면상에 나타나게 된다. Browser가 서버에 HTML과 static파일을 요청한 후 로드되면 사용자의 상호작용에 따라서 javascript를 통해 동적으로 Rendering 한다. 필요에 따라 데이터를 서버에 요청해서 받아와 Rendring 한다. SSR 동작방식 서버에서 렌더링을 작업하는 렌더링 방식, 전통적인 웹 어플리케이션 렌더링 방식으로 사용자가 웹 페이지에 접근할 때, 서버에 각각의 페이지에 대한 요청을 하며 서버에서 HTML 및 JavaScript 파일 등을 모두 다운로드해서 화면에 렌더링 하는 방식. SSR과..