반응형 SMALL 전체 글118 [study] 첫번째 수업 ** 브라우저 렌더링 동작 꼭 기억하기! 브라우저 렌더링 : 먼저 html을 파싱해서 domtree로 만들고, css를 파싱해서 css오브젝트 모델을 만든다. 그리고 그 두 개를 합쳐서 렌더트리로 만든다. 그리고 렌더트리를 디스플레이한다. js: 클라이언트에서 사용하고자 하는 언어. js 사용 이유: 서버쪽에서의 부화를 줄이기위해 클라이언트에게 역할을 줌. 전통적인 웹페이지 HTML, CSS, JS => 협업이 어렵다, 유지보수가 어렵다, 화면을 계속 refresh 해야되서 불편하다. 비효율적. => 특히 '페이스북'이 이 부분에서 가장 큰 어려움을 겪음 -> 'react' 만듦!! 리액트의 핵심: SPA(Single Page Application) - 계속 refresh 하지 않아도 된다.(리액트의 장.. 2020. 11. 21. 모던 JS 튜토리얼 정리 2 객체 만드는 법 let user = new Object(); // '객체 생성자' 문법 let user = {}; // '객체 리터럴' 문법 ** 상수 객체는 수정될 수 있다!! ** const user = { name: "John" }; user.name = "Pete"; // (*)OK alert(user.name); // Pete 계산된 프로퍼티(computed property)(cf. 대괄호 표기법) let fruit = prompt("어떤 과일을 구매하시겠습니까?", "apple"); let bag = { [fruit]: 5, // 변수 fruit에서 프로퍼티 이름을 동적으로 받아온다. }; alert( bag.apple ); // fruit에 "apple"이 할당되었다면, 5가 출력. // 위.. 2020. 11. 12. 모던 JS 튜토리얼 정리 1 자료형 // 일반적인 문자열은 "",'' 둘 중 하나로 감싼다. let name = "John"; // 변수를 문자열 중간에 삽입(백틱 ``사용) alert( `Hello, ${name}!` ); // Hello, John! // 표현식을 문자열 중간에 삽입 alert( `the result is ${1 + 2}` ); // the result is 3 typeof 연산자 : 피연산자의 자료형을 알려준다. typeof 0 // "number" typeof "hi" // "string" typeof null // "object" typeof alert // "function" typeof Math // "object" prompt 함수 : 사용자로부터 입력받는다. confirm 함수 : 확인/취소 창 보여.. 2020. 11. 12. [React] map 사용방법 - map() 메소드는 파라미터로 전달 된 함수를 통하여 배열 내의 각 요소를 순차적으로 돌며 그 결과로 새로운 배열을 생성한다. AreaList.js import React, { Component } from 'react'; import AreaListForm from './AreaListForm'; import AddedArea from './AddedArea'; class AreaList extends Component { state={ areaInfo:[], } handleCreate=(data)=>{ const{areaInfo}=this.state; this.setState({ areaInfo:areaInfo.concat(data) }) } render() { return ( {/* {JSON... 2020. 10. 30. 이전 1 ··· 16 17 18 19 20 21 22 ··· 30 다음 반응형 LIST
