📍 DEV12 모듈과 모듈 번들러란?! (feat. Webpack) react에서 create-react-app을 사용하면 리액트에 집중할 수 있지만 웹팩, 바벨 등 번들링 도구들이 어떻게 동작하는지는 잘 모르고 넘어가게 된다. 하지만 프론트엔드 개발 환경을 이해하기 위해선 꼭 알아야 한다고 생각하기 때문에 정리를 해보고자 한다. 📝❗️ 모듈(Module)이란?! 한줄로 정의하자면 모듈은 파일 하나하나, 특정 기능을 갖는 작은 코드 단위를 의미한다. 우리가 개발을 하면서 규모가 커지면 언젠가 파일을 여러 개로 분리해야 하는 시점이 온다. 이때 분리된 파일 각각을 모듈이라고 부르는 것이다. 목적에 따라, 기능별로 여러 개의 파일로 분리해서 관리할 수 있으며 모듈로 분리하는 과정을 모듈화라고 한다. 그렇다면 모듈을 왜 사용해야 하는 걸까?! 모듈이 필요한 이유 : 브라우저 .. 2021. 7. 27. CSR, SSR 그리고 SPA 정리 SPA(Single Page Application)에 대해 대략적으로만 알던 내용들을 정리해보고자 한다. SPA와 함께 CSR(Client Side Rendering), SSR(Server Side Rendering) 도 정리하겠다. SPA : 기존의 웹은 서버사이드 렌더링 방식(SSR)으로 서버로부터 새로운 페이지를 불러왔었다. 하지만 점점 웹에서 더 많은 정보를 제공하고, 모바일 기기를 통한 웹 애플리케이션 접속도 증가하면서 속도 저하로 이어지게 되었다. 그래서 SPA가 등장하는데 SPA는 최초 한 번 페이지 전체를 로드한 후 동적으로 필요한 데이터만을 변경해서 사용할 수 있는 웹 애플리케이션으로 기본적으로 클라이언트 사이드 렌더링 방식(CSR)이다. (하지만 SPA가 무조건 CSR인 것은 아니다.).. 2021. 6. 16. [17JAN, 2021]OOP2)Prototype in JavaScript. 자바스크립트는 Prototype 기반 언어이다. Class 기반의 언어에서는 Class 안의 내용을 기반으로 인스턴스를 생성하여 객체를 사용하지만 자바스크립트는 Class 가 존재하지 않는다. 그래서 자바스크립트는 프로토타입을 이용한다. 그럼 이 Prototype이 뭘까?! (ES6에서는 Class문법이 추가되었지만 자바스크립트가 클래스 기반의 언어로 바뀌었다는 것은 아니다.) 프로토타입에 대해 설명하기에 앞서 클래스와 인스턴스에 대한 개념을 한 줄로 정리하고 가고 싶다. 동기분들이 공유해준 블로그 중 하나에서 깔끔한 정리를 찾을 수 있었다. 객체(Object)는 소프트웨어 세계에 구현할 대상이고, 이를 구현하기 위한 설계도가 클래스(Class)이며, 이 설계도에 따라 소프트웨어 세계에 구현된 실체가 인.. 2021. 1. 17. [14JAN, 2021] OOP1)What is Object-oriented Programming?! 객체 지향??!! 나처럼 프로그래밍을 처음 접한 사람들에게는 이 객체지향이라는 말이 생소하게 느껴질 것이다. 우리의 일상생활에서 쓰이지 않는 말이기 때문이다. 나는 프로그래밍을 접하기 전, 이 단어를 딱 들었을 때 '객체가 뭐길래 지향한다?? 지향이면 그래도 선호한다는 건데..?'이라는 생각을 했다. 그래서 이 객체 지향을 이해하는 데에는 우선 객체가 무엇인지 이해를 해야 객체지향도 이해할 수 있다고 생각한다. 객체(Object): 객체는 ''Thing', '어떤 것'으로 생각하면 조금 더 이해하기 쉽다. 그래서 객체는 사람이 될 수 있고, 자동차가 될 수도 있으며 컴퓨터, 책 등등 무엇이든 될 수도 있다. 클래스(Class): 그럼 자동차로 예를 들어보자. 자동차는 사람들이 이동할 때 타는 운송수단이다.. 2021. 1. 15. 이전 1 2 3 다음