
- 책에 나와 있는 sass의 환경설정은 지금 버전이 바뀌어 지원을 하지 않고 있기 때문에 아래와 같이 환경설정해서 사용하면 된다. 1. .css .scss 사용을 위한 기본 설정 .css .scss 등 스타일링에 필요한 라이브러리 npm install node-sass --save npm install open-color --save npm install sass-loader --save npm install classnames --save index.css가 실질적으로 백그라운드에 영향을 준다. .scss를 사용 하기 위해서는 index.js 파일에서 import를 변경시켜 주어야 한다. .scss로 변경하더라도 .css 확장자명을 설정 변경없이 사용이 가능하다. index.css의 확장자를 inde..

Ex01. 하위 컴포넌트의 사용 - 이전 React에서 사용하듯이 사용 - Action과 Reducer, State 함수는 정의 했지만 사용하지 않음에 주의 - btn 클릭시 단순히 log 출력 // Ex01 App.js import React, { Component } from 'react'; import { connect } from 'react-redux'; class App extends Component { render() { console.log('App'); return ( ); } } class Com1 extends Component { render() { console.log('App'); return ( { console.log('com1'); } }>com1 btn1 ); } } c..

JDBC(Java Database Connectivity) 자바 프로그램 안에서 SQL을 실행하기 위해 DB를 연결해주는 응용프로그램 인터페이스 즉, 자바 프로그램 내에서 질의문을 실행하기 위한 API 어떤 DB를 사용하든 간에 JDBC 드라이버만 제공된다면 코드의 수정이 거의 없이 바로 적용이 가능하다는 장점이 있다. JDBC 프로그래밍 단계 1. 드라이버 로딩 - Class.forName()의 인자로 자신의 DB가 제공하는 드라이버 이름을 명시하면 된다. - Class.forName()을 호출하면 Driver가 자기자신을 초기화하여 객체가 생성되고, DriverManager에 등록한다. Class.forName("oracle.jdbc.driver.OracleDriver"); 2. 데이터베이스 연결 -..

Redux란? - 리액트에서 상태를 더 효율적으로 관리하는 데 사용하는 상태 관리 라이브러리 - 리덕스는 쉽게 설명하면 상태 관리의 로직을 컴포넌트 밖에서 처리 하는 것이다. - 리덕스를 사용하면 스토어라는 개체 내부에 상태를 담게 된다. - 리덕스를 사용하면 위 그림과 같이 스토어에서 모든 상태 관리가 일어난다. 상태에 어떤 변화를 일으켜야 할 때는 액션(Action) 이라는 것을 스토어에 전달한다. 액션은 객체 형태로 되어 있으며, 상태를 변화시킬 때 이 객체를 참조하여 변화를 일으킨다. 액션을 전달하는 과정은 디스패치(dispatch)라고 한다. - 스토어가 액션을 받으면 리듀서(Reducer)가 전달받은 액션을 기반으로 상태를 어떻게 변경시켜야 할지 정한다. 액션을 처리하면 새 상태를 스토어에 저..

1. concat(), slice(), pop() 예제 // 문법1 let arr = [10, 20, 30, 40, 50] console.log('arr 출력 : ', arr); console.log('------------------------------------------------------'); // 추가, 연결을 위한 함수 arr.concat(60); // 그러나 출력 결과에는 추가가 되지 않음 console.log('arr.concat 출력 : ', arr); console.log('------------------------------------------------------'); // concat은 자체적으로 붙인것 처럼 보이지만 복사본이다. // arr = arr.concat(60);..

2019.08.08(목) React - map()복습, concat/slice 활용 Ex01 - Java Script의 concat(), slice(), pop() 문법 알고가기 // 문법 let arr = [10, 20, 30, 40, 50] console.log('arr 출력 : ', arr); console.log('------------------------------------------------------'); // 추가, 연결을 위한 함수 arr.concat(60); // 그러나 출력 결과에는 추가가 되지 않음 console.log('arr.concat 출력 : ', arr); console.log('--------------------------------------------------..

2019.08.07(수) React - event, state, tag, map()함수, lifecycle, 함수형 컴포넌트 Ex01 - alert, prompt, window.confirm import React, { Component, Fragment } from 'react'; class App extends Component { f1 = () => { console.log('f1()'); alert("반응"); // 경고창이 발생한다.(확인만) } f2 = () => { console.log('f2()'); // 첫번째 인수값은 : 알려주는 내용, 두번째 인수값은 에디터박스의 초기값이다. // return 값이 존재하기 때문에 log를 이용해 출력이 가능하다. //prompt("입력하세요", "입..

[http 설치] yum install httpd [firewalld 설치] yum install firewalld [vim 설치] yum install vim [설치 확인] yum list installd | grep httpd yum list installd | grep firewalld [방화벽 설정] firewall-cmd --permanent --add-service=http firewall-cmd --permanent --add-service=https firewall-cmd --reload [httpd 시작/상태 확인] systemctl start httpd systemctl status httpd [워크스페이스 생성] - 앞으로 사용한 디렉토리를 하나 만들어준다.(mkdir /home/Hw..