MVC 패턴 MVC 패턴은 모델(Model), 뷰(View), 컨트롤러(Controller)로 이루어진 디자인 패턴이다. 애플리케이션의 구성요소를 세가지로 구분하여 개발 프로세스에서 각 요소에만 집중하여 개발할 수 있다. 재사용성과 확장성이 용이하지만, 애플리케이션이 복잡할수록 모델과 뷰의 관계도 복잡해진다. 모델(model)은 애플리케이션의 데...

정규 표현식(정규식)은 문자열에서 특정 문자의 조합을 찾기 위한 패턴이다. javascript에서 정규표현식은 객체로 RegExp의 exec(),test()메서드를 사용할 수 있다. 또한 String의 match(),matchAll(),replace(),replaceAll(),search(),split()메서드와도 함께 사용할 수 있다. 정규표현식...

ES6(ES2015)큰 변화 이후에도 업데이트가 꾸준히 되고 있는데, ES2016부터 ES2023의 업데이트된 내용들을 정리해보려한다. ES2016 Array.prototype.includes() arr.includes(valueToFind[,fromIndex]) includes() 메서드를 사용하여 배열에 특정 원소가 포함되어 있는지 확인...

ES란 ECMAScript의 약자로, 자바스크립트의 표준 규격을 나타낸다. 2009년에 ES5, 그리고 2015년에 ES6가 출시되면서 많은 변화를 가져왔다. 변수 선언 방식 ES5에서는 Function scope를 따르는 var를 사용하여 변수를 선언했었는데, ES6에서는 Block scope를 따르는 let과 const라는 변수선언방식이 생겼다....

HTTP 1989년 팀 버너스 리에 의해 처음 설계되었으며, WWW(World Wide Web)기반으로 사용된다. HTTP는 HyperText Transfer Protocol의 약자로, 인터넷에서 하이퍼텍스트를 교환하기 위한 통신규약이다. 서버와 브라우저 간의 데이터 전송을 위한 응용계층 프로토콜이다. (프로토콜: 컴퓨터 사이에서 데이터의 교환방식...

주소창에 url 주소를 입력했을 때 브라우저에 그려지는 과정에 대해 정리해보려한다 1. DOM Tree 생성 브라우저의 렌더링 엔진이 html 코드를 읽고 파싱하여 DOM Tree를 생성한다. 2. DOM Tree + CSSOM HTML 인라인으로 작성된 스타일 코드와 CSS파일을 파싱하여 CSSDOM을 생성하게되고, 이렇게 만들어진 DOM tre...

기본적으로 MPA(Multi Page Application)는 SSR 방식을 채택하고, SPA(Single Page Application)는 CSR 방식을 채택하고 있다. 그리고 next.js 공식문서에서 권장하는 SSG(Static Site Generation)방식이 있다. SSR,CSR,SSG에 대해 자세히 살펴보자. SSR(Server Si...

Dom 이란? DOM은 문서객체모델(Document Object Model)의 약자로서 HTML 문서를 파싱하여 문서의 구성요소를 구조화한 것이다. DOM은 문서를 노드와 객체로 나타낸다. document -> html -> head,body 와 같은 형태의 트리구조로 생성된다. 내가 작성한 코드가 브라우저가 이해할 수 있도록 객체로 ...

SPA란? 먼저 전통적인 웹방식인 MPA(Multi Page Application)는 새로운 페이지가 필요할 때 내용이 조금만 바뀌어도 전체페이지를 다시 생성한다. SPA는 Single Page Application의 약자로 단일 페이지 웹 애플리케이션을 의미한다. 페이지의 내용이 바뀌었을 때 MPA처럼 서버로부터 새로 불러오지 않고 현재페이지를...

이번 글은 gitblog와 관련한 내가 자주 참고했던, 그리고 앞으로도 자주 참고하게 될 링크들을 정리하는 공간이다 gitblog 프로필 Profile 이미지 설정 프로필 이미지를 설정하려고 document그대로 파일을 직접 local에 넣고 경로 설정했는데도 자꾸 404에러가 떴음 local은 답이 아닌것같아 많이 찾아봤는데 링크화 시켜서 넣...