참고자료 / 강의 링크 웹팩은 가장 많이 사용되는 모듈 번들러이다. $ npm install webpack webpack-cli -D $ npm install lodash 1. 파일 설정 <!-- index.html --> <html> <head> <title>Webpa...
01-Bundler-등장-배경
참고 자료 1. Node.js와 NPM 1) Node.js Node.js란 브라우저가 아닌 환경에서 JS를 실행할 수 있도록 하는 환경이다. JavsScript 런타임 환경으로 React.js 더 편리하게 사용할 수 있도록 해주는 도구를 제공해 준다. 이전에는 JS가 브라우저에서만 실행할 수 있었지만 No...
05-useEffect-useReducer-useContext
강의 링크 1. useEffect 1) SideEffect react의 메인 업무: UI를 렌더링하고 사용자에 반응하여 리렌더링한다. JSX 코드와 DOM을 평가하고 렌더링한다. state와 props를 관리한다. SideEffect: 애플리케이션에서 일어나는 다른 모든 것 ...
04-Fragments-Portals-useRef
강의 링크 1. Fragments 1) 필요성 JSX 제한 사항 // root요소는 1개여야 한다. return ( <h2>Root</h2> <p>ERROR!!!</p> ) 자바스크립트는 둘 이상을 반환할 수 없기 때문이다. 즉, 단 1개의 리액트 createElemen...
03-컴포넌트-스타일링
강의 링크 1. 동적 스타일 1) 동적 인라인 스타일 공백을 입력하면 테두리 색이 변하는 input 컴포넌트를 만들어보자. import React, { useState } from 'react'; import Button from '../../UI/Button/Button'; import './CourseInput.css'; const ...
02-컴포넌트-리스트-및-조건부-렌더링
강의 링크 반복 렌더링 공식문서 / 조건부 렌더링 공식문서 1. 반복 렌더링 1) map메서드를 활용하여 반복 렌더링 하기 이전 코드 import ExpenseItem from "./ExpenseItem"; import Card from "./Card"; function Expenses({ expenses }) { return (...
01-상태관리를-통한-동적인-페이지-구현
강의 링크 state를 활용한 동적 페이지 상태를 선언한다. 리액트의 이벤트와 바인드 한다. 모델이 변경됨을 감지한 후, 변경된 부분만 DOM에 반영한다. ## 1. Event // 컴포넌트: 자바스크립트 함수일 뿐이다. import "./ExpenseItem.css"; import ExpenseDate from "./Exp...
React-특징
공식 문서 1. 선언형 프로그래밍 명령형 (HOW) 선언형 (WHAT) DOM 스크립트 기반 React, Vue 어딘가를 가야할 때 일일이 다 서술 해야 한다. 목적지만 말하면 된다. 즉, ...
운영체제-기본-구조
2장-운영체제-구조 강의 링크 1. 컴퓨터 시스템 구조 CPU 메모리에 있는 instruction을 실행한다. CPU안에는 레지스터들과 modebit이 있다. Modebit: CPU의 제어 권한이 현재 프로그램에 있는지 OS에 있는지 확인가능 ...
운영체제-기본-개념
1장-운영체제-소개 1. 운영 체제란? 컴퓨터 하드웨어 바로 위에 설치되어 사용자 및 다른 모든 소프트웨어와 하드웨어를 연결하는 소프트웨어 계층 컴퓨터 안의 하드웨어랑 프로그램을 어떻게 잘 관리할 것인가. 협의의 운영체제 (커널) 운영체제의 핵심 부분으로 메모리에 상주하는 부분이다. 광의...