분류 전체보기

(리액트를 다루는 기술) 5장 ref-dom에 이름 달기

5장. ref:DOM에 이름 달기 ref: HTML에서 id를 사용하여 DOM에 이름을 다는 것처럼 리액트 내부에서 DOM에 이름을 다는 방법 예제 자바스크립에서는 이벤트나 스타일 주려면 id나 class 지정 해야하지만 리액트는 굳이 그렇게 하지 않아도 됨 App.js; import React, { Component } from "react"; import ValidationSample from "./ValidationSample"; class App extends Component { render() { return ; } } export default App; import React, { Component } from "react"; import "./ValidationSample.css"; cla..

(리액트를 다루는 기술) 4장 이벤트 핸들링

Event 사용자가 웹 브라우저에서 DOM요소들과 상호 작용하는 것을 이벤트라고 한다. 리액트의 이벤트 시스템 이벤트를 사용할 때 주의 사항 이벤트 이름은 카멜 표기법으로 작성(HTML의 onclick->리액트에서는 onClick) 리액트에서는 이벤트에 실행할 함수 형태의 객체를 전달 # 렌더링 부분 외부에서 만들어 전달해도 됨 const Say = () => { const [message,setMessage]=useState(''); const onClickEnter=()=>setMessage('안녕하세요') return ( 입장 {message} ); }; # 함수 형태 바로 전달해도 됨 const Say = () => { const [message,setMessage]=..

(리액트를 다루는 기술) 3장 Component

Component UI를 독립적이고 재사용 가능하도록 나눈 조각 props 컴포넌트 속성을 설정할 때 사용하는 요소 props 값은 해당 컴포넌트를 불러와 부모 컴포넌트에서 설정 MyComponent.jsx import React from 'react'; const MyComponent = props => { return ( 안녕하세요, 제 이름은 {props.name} 입니다 ); }; export default MyComponent; App.js import React,{Component} from 'react' import './App.css' import MyComponent from './MyComponent' class App exten..

(리액트를 다루는 기술) 2장 JSX

JSX 자바스크립트의 확장 문법이며 XML과 매우 비슷하게 생겼음 function App() { return ( Hello react ); } export default App; 위처럼 작성된 코드는 아래와 같이 변환 funcion App(){ return React.createElement("div",null, "Hello", React.createElement("b",null,"react)) } 감싸인 요소 컴포넌트에 여러 요소가 있다면 반드시 부모 요소 하나로 감싸야 한다 ./src/App.js SyntaxError: C:\Users\User\react\hello-react\src\App.js: Unterminated regular expression (6:21) 4 | function App() ..

7. 파이썬 엑셀 파일 읽고 쓰기

파이썬 엑셀 파일 읽고 쓰기 1. 엑셀 파일 읽기 -엑셀 파일 읽기 import openpyxl #data_only=Ture로 해줘야 수식이 아닌 값으로 받아온다. load_wb=openpyxl.load_workbook("C:\Users\nye\PycharmProjects\chatbot\test.xlsx", data_only=True) #시트이름 불러오기 load_ws=load_wb['2020'] #셀 주소로 값 출력 print(load_ws['F4'].value) #셀 좌표로 값 출력 print(load_ws.cell(6,4).value) -지정한 셀 값 출력 print('\n-----지정한 셀 출력-----') get_cells = load_ws['A..

6. 파이썬 예외(python exception)

예외 처리 ##1. 기본 형태 try : ... except [오류 사항 [as 오류 메시지 변수]] : ... finally: ... try 구문 안에 오류 발생 가능성이 있는 코드를 사용 만약 try 구문 안에 들어 있는 코드에서 예외가 발생하면 그 즉시 except 구문으로 코드 흐름이 점프 except 구문에는 예외가 발생했을 때 예외 처리를 할 수 있는 코드가 있다 finally 구문은 try 구문 수행 도중 예외 발생 여부와 상관없이 항상 실행(리소스 해제를 위해 많이 사용) 리소스 해제가 필요 없는 경우에는 finally 구문을 생략할 수 있다 2. 예제 try : a = [1, 2] print(a[3]) 4 / 0 except Exception as e: print(e) finally: p..

5. 파이썬 모듈(python module)

모듈 1. 모듈 : 여러가지 함수나 클래스 등을 기능이나 목적별로 모아놓은 파일 모듈화된 기능은 재사용하기 쉽기 때문에 중복 코드 문제도 해결 모듈의 이름을 보고 해당 모듈의 기능을 유추할 수 있어야 좋은 모듈 예제 calc.py def add(a,b) : return a+b def sub(a,b) : return a-b def mul(a,b) : return a*b def div(a,b) : return a/b* 다른 경로에 있다면 import 할 때 경로를 지정 해줘야 한다(파일명 뒤 .py 붙이면 안된다) >>> import calc >>> calc.add(4,3) 7 >>> calc.sub(10,5) 5 2. 모듈에서 불러올 함수를 직접 지정하는 방법(모듈 이름을 붙이지 않는다) 사용할 모듈 함수..

4. 파이썬 클래스 (python class)

파이썬 클래스 class Fourcal: def setdata(self, first, second): #메서드의 첫 번째 매개변수 self를 명시적으로 구현하는 것은 파이썬만의 독특한 특징 self.first = first self.second = second a=Fourcal() a.setdata(4, 2) #a.setdata(4, 2)처럼 호출하면 setdata 메서드의 첫 번째 매개변수 self에는 setdata메서드를 호출한 객체 a가 자동으로 전달되기 때문 print(a.first) print(a.second)b=Fourcal() b.setdata(10,20) print(b.first) - a 객체의 first 값은 b 객체의 first 값에 영향받지 않고 원래 값을 유지하고 있음을 확인할 수 ..

3. 파이썬 함수(python function)

파이썬 함수의 구조 def 함수명(매개변수): ... 함수는 시스템에 내장되어 있는 내장 함수, 사용자가 만든 사용자 정의 함수, 라이브러리 형태로 모듈화시킨 외장 함수가 있다 def gugu(a,b): #a,b는 매개변수 : 함수에 입력으로 전달된 값을 받는 변수 return a+b print(gugu(2,5)) #2,5는 인수 : 함수를 호출할 때 전달하는 입력값 여러개의 입력값을 받는 함수 def 함수이름(*매개변수): ... def many_add(*num): #매개변수 이름 앞에 *을 붙이면 입력값을 전부 모아서 튜플로 만들어 주 sum=0 for i in num : sum=sum+i return sum print(many_add(1,2,3,)) def add_mul(choice, *num) :..