미어캣의 필기장

안녕하세요 미어캣입니다. 제가 공부한 내용들을 보면 DOM을 간략하게나마 정의한 부분들이 있긴하지만 앞으로 있어 기본이지만 알아야는 할 것 같아서 기록에 남겨두려고 합니다. 브라우저에 띄울 웹 페이지가 단순히 정보 전달만을 목적으로 하는 정적인 웹이라면 HTML, CSS로도 충분하지만, 인터랙티브한 기능(동적인 구현)을 하고자 한다면 자바스크립트와 DOM을 반드시 써야합니다. DOM은 웹 페이지(HTML이나 XML 문서)의 콘텐츠 및 구조, 그리고 스타일 요소를 구조화 시켜 표현하여 프로그래밍 언어가 해당 문서에 접근하여 읽고 조작할 수 있도록 API를 제공하는 일종의 인터페이스입니다. ➡️ 즉 자바스크립트 같은 스크립팅 언어가 쉽게 웹 페이지에 접근하여 조작할 수 있게끔 연결시켜주는 역할을 담당 DOM..

안녕하세요 미어캣입니다. 오늘은 React에 대해서 글을 작성해보려고합니다. 원래는 Vue.js를 공부하고 있었습니다. 기본적인건 사용할 줄알고 강의도 여러번 들어 계속해서 Nuxt 프레임워크로 넘어갈려는 찰나에, 실제 실무에서는 React가 압도적으로 많이 쓰이고 있어 겸사겸사 React도 공부를 하고있습니다. 코드적으로는 조금씩 늘려가고 있긴한데 아직 React는 무엇이다? 라는 명사적으로는 애매한 부분이 있어서 글을 끄적여 봅니다. GPT에서는 React를 뭐라고 할까요? React : Facebook에서 개발한 JavaScript 라이브러리라고 정의하고 있습니다. Features : 가상 DOM : 가상의 DOM을 사용하여 빠르고 효율적인 UI를 업데이트(전체 DOM을 업데이트하는 대신 변경된 부..

안녕하세요 미어캣입니다. 웹 애플리케이션을 만들고 랜더링하는 과정에서 CSR과 SSR으로 나뉩니다. 처음에 프로젝트를 받았을 때에는 이런 내용에 대해서는 전무한 상태였지만 시간이 지나면서 필요한 지식을 채우고자 해당 부분들을 공부하게 되었습니다 저는 SSR, CSR를 SPA는 어떤 관계일까의 질문에서 너무 헷갈렸지만 MPA라는 단어를 보고 조금은 쉽게 이해 할 수 있었습니다. SSR과 CSR 보기 이전에 SPA와 MPA에 대한 이해가 필요할 것 같습니다. SPA; Single Page Application 하나의 페이지로 구성된 웹 애플리케이션 한번의 한 페이지만 로드 되고, 페이지간 동적으로 데이터를 로드하며 UI를 업데이트하는 방식 주로 JavaScript 프레임워크/라이브러리를 사용하며 (React..

안녕하세요 미어캣입니다. 😺 vue.js를 공부하면서 예전에 들었던 강의와 요즘 듣고 있는 강의의 차이점은 바로 ES6 문법을 적용한 방식이라고 생각합니다. 최근에는 저 역시 변수/함수 선언 시에 const나 let을 사용하고 있습니다. 근데 기존의 var과 어떤 차이가 있는지 ES6문법과 ES5의 문법의 차이가 어떤지 대~충은 느낌으로는 체감하고 있겠지만 정확하게는 모른다고 생각해서 한 번 알아보는 시간을 가졌습니다.(대충은 싫어요) 그래서 오늘은 ES6문법의 특징과 변수 선언 방식에 차이가 어떤지에 대해서 알아보도록 하겠습니다. var, let, const의 차이점을 비교하기 전에 ES6가 먼지 알아보았습니다. ES6 : ECMA Script 2015 JavaScript의 표준화된 버전인 ECMASc..

안녕하세요 미어캣입니다. 요즘 일/공부 의 무한 굴레에 있어 바쁘지만 알찬 하루 하루를 보내고 있습니다. 코드적인 스킬도 중요하지만 누군가에게 설명하고 할 때에 CS 지식도 굉장히 중요하다고 생각해서 틈틈히 시간나면 기록하려고 합니다. 오늘은 HTTP API 통신을 사용할 때 주로 쓰이는 Ajax, Axios, Fetch에 대한 정리를 하려고합니다. Ajax Asynchronous JavaScript And XML : Ajax는 JavaScript에서 비동기 HTTP 통신이 가능한 기술 비동기 HTTP 통신이란 : response와 request를 비동기 식으로 다를 수 있다 동기 : 순차적으로 작업을 실행하고, 작업이 완료되기를 기다렸다 다음 작업을 실행, 작업이 끝나기를 기다리는 동안 다른 작업은 대..