코딩하는 고릴라

본 게시물은 poiemaweb(https://poiemaweb.com/)에 기술된 내용을 기반으로 작성한 게시물입니다. 1. Node.js - 프로젝트의 규모가 커짐에 따라 React, jQuery와 같은 외부 라이브러리를 도입하거나 Babel, Webpack, ESlint 등 여러가지 도구 사용의 필요성 有 - 이때 Node.js와 npm을 필요로 함 - 2009년 라이언 달(Ryan Dahl)이 발표한 Chrome V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경 - 브라우저에서만 동작하던 자바스크립트를 브라우저 이외의 환경에서 동작시킬 수 있는 자바스크립트 실행환경 1.1. Node.js와 npm - Node.js - 주로 서버 사이드 애플리케이션 개발에 사용 - 이에 필요한 모듈, 파일 ..

본 게시물은 poiemaweb(https://poiemaweb.com/)에 기술된 내용을 기반으로 작성한 게시물입니다. 1. 자바스크립트의 탄생 - 1995년 : 넷스케이프 커뮤니케이션즈는 정적인 HTML의 동적 표현을 위해 브렌던 아이크(Brendan Eich)가 자바스크립트를 개발 - 1996년 : 넷스케이프 커뮤니케이션즈의 웹 브라우저인 Netscape Navigator2에 탑재 - Mocha(3월) -> LiveScript(9월) -> JavaScript(12월)로 이름 변경 2. 자바스크립트의 파편화와 표준화 - 1996년 8월 : 마이크로소프트 "JScript"를 Internet Explorer 3.0에 탑재 - JScript와 자바스크립트는 서로 경쟁하듯 독자적인 기능을 개발하기 시작했고, ..

본 게시물은 poiemaweb(https://poiemaweb.com/)에 기술된 내용을 기반으로 작성한 게시물입니다. 1. 시맨틱 웹(Semantic Web) - 웹에 존재하는 웹페이지들에 메타데이터를 부여, 기존의 데이터 집합이었던 웹페이지에 '의미', '관련성'을 더해 거대한 데이터베이스로 구축하고자 하는 발상 1.1. 검색 엔진 - 크롤러 : 크롤링 수행 (로봇이라는 프로그램을 통해 매일 전세계 웹사이트의 정보 수집) - 인덱서 : 인덱싱 수행 (검색될 만한 키워드를 미리 예상, 검색 키워드에 대응하는 인덱스(색인) 생성) - 로봇은 HTML 코드 정보를 수집하고, HTML 코드만으로 그 의미를 인지한다. - 이 때 시맨틱 요소를 해석 Hello Hello - 위 두줄의 코드는 브라우저 상에서 동..

1. Lifecycle 1. 컴포넌트 생성(mount) 2. 컴포넌트 업데이트, 재렌더링(update) 3. 컴포넌트 제거(unmount) Hook을 이용하여, 각각의 라이프사이클 단계에서 함수를 실행시킬 수 있음 - Line 2 : useEffect 임포트 - Line 6 : useEffect() 내에 컴포넌트가 mount 혹은 update 됐을 때 실행시킬 함수 넣어주기 => 해당 컴포넌트가 mount 되거나 update 될 때, 브라우저의 콘솔창에 "하위!" 가 출력 1-1. useEffect - useEffect 안에 적어놓은 코드는 컴포넌트의 html이 모두 렌더링 된 후에 실행 - 따라서 연산이 오래걸리는 작업들을 useEffect 안에 넣어두면, 일단 html 요소는 화면에 렌더링 된 후 해..

본 게시물은 poiemaweb(https://poiemaweb.com/)에 기술된 내용을 기반으로 작성한 게시물입니다. 1. HTML5 HTML - 웹 페이지를 기술하기 위한 마크업 언어 - 웹페이지의 내용, 구조를 담당하는 언어 - HTML 태그를 통해 정보를 구조화 하는 것에 목적 HTML5 - 2014년 10월 28일 확정된 차세대 웹 표준 - 아래와 같은 기능들이 추가됨 멀티미디어 : 플래시와 같은 플러그인의 도움 없이 비디오 및 오디오 기능 자체 지원 그래픽 : SVG, 캔버스를 사용한 2차원 그래픽과 CSS3, WebGL을 사용한 3차원 그래픽 지원 통신 : 기존의 HTML과 달리 서버와의 소켓 통신을 지원해 서버와의 양방향 통신이 가능 디바이스 접근 : 카메라, 동작센서 등의 하드웨어 기능을..

Styled-components .css 파일을 사용하지 않고 .js 파일 내에서 html요소에 스타일을 적용하기 위해 사용 기존의 .css 파일에서 스타일을 적용하지 않고 각 .js 파일에서 적용하기 때문에, class명이 겹치는 경우 스타일 적용이 중복으로 이뤄지지 않는다. 1. 설치 npm install styled-components 2. 사용 Line 6 - styled-components 임포트하기 Line 8 - styled라는 이름으로 임포트한 styled-components를 이용하여 스타일이 적용된 컴포넌트 ‘Box’ 생성하기 Line 19 - 위에서 만들어진 스타일이 적용된 ‘Box’ 컴포넌트사용 일반 css 파일의 적용 범위 한정하기 (모듈화) .css 파일의 이름을 [컴포넌트명.m..