분류 전체보기 (125) 함수형 컴포넌트의 생명주기 분류 클래스형 컴포넌트 함수형 컴포넌트 Mounting constructor() 함수형 컴포넌트 내부 Mounting render() return() Mounting ComponenDidMount() useEffect() Updating componentDidUpdate() useEffect() UnMounting componentWillUnmount() useEffect() useEffect useEffect(() => { //코드 }) : 모든 컴포넌트가 리렌더링 될 때마다 실행 componentDidMount() useEffect(() => { //코드 },[]) : 한번만 실행 componentDidUpdate() & getDerivedStateFromProps() useEffect(() => {.. 5. Create import {useState} from 'react'; //훅 function Header(props) { return { event.preventDefault(); props.onChangeMode(); }}>{props.title} } function Nav(props) { const lis = []; for(let i=0; i{t.title} ); } return {lis} } function Article(props) { return {props.title} {props.body} } function Create(props) { return Create { event.preventDefault(); const title = event.target.title.value; const body = e.. 4. useState import {useState} from 'react'; //훅 function Header(props) { return { event.preventDefault(); props.onChangeMode(); }}>{props.title} } function Nav(props) { const lis = []; for(let i=0; i{t.title} ); } return {lis} } function Article(props) { return {props.title} {props.body} } function App() { /* const _mode = useState{'WELCOME'}; //초기값 const mode = _mode[0]; //상태값 const setMode = _mode[1]; //값.. 3. 이벤트 props 를 이용하여 onClick, onChangeMode 등 이벤트를 적용하기 function Header(props) { return { event.preventDefault(); props.onChangeMode(); }}>{props.title} } function Nav(props) { const lis = []; for(let i=0; i{t.title} ); } return {lis} } function Article(props) { return {props.title} {props.body} } function App() { const topics = [ {id:1, title:'html', body:'html is ...'}, {id:2, title:'css', body:'css is.. 2. props (속성) props(속성)을 html 태그 안에서 사용하려면 { } 안에 props를 넣어준다. function Header(props) { return {props.title} } function Nav() { return html css javascript } function Article(props) { return {props.title} {props.body} } function App() { return ( ); } export default App; props 를 이용하여 동적태그 생성하기 function Header(props) { return {props.title} } function Nav(props) { const lis = []; for(let i=0; i 1. 컴포넌트 만들기 function App() { return ( WEB html css javascript Welcome Hello, WEB ); } export default App; 위의 코드를 아래와 같이 컴포넌트로 만들어서 사용할 수 있다! 컴포넌트를 만들 때 이름은 꼭 대문자로 시작해야한다. function Header() { return WEB } function Nav() { return html css javascript } function Article() { return Welcome Hello, WEB } function App() { return ( ); } export default App; 리액트의 본질은 컴포넌트 !!!!!!! 출처 - https://www.youtube.com/watch?v=W.. [리눅스] Tomcat 실시간 로그 확인하기 Putty에 세션 로그인하기 id / pw 입력 후 명령어 사용하여 톰캣 설치된 폴더 - 로그 폴더로 이동 cd /usr/local/server/tomcat/logs 실시간 로그 확인하는 명령어 (tail -10000f 마지막 10000줄 확인 가능) tail -10000f catalina.out 프레임워크와 라이브러리의 차이 프레임워크 프로그램이 동작하는 기본 뼈대(Frame)를 제공 IOC(제어의 역전), 라이브러리, 디자인 패턴을 구현 라이브러리 특정 기능(알고리즘)을 미리 구현한 소스코드의 집합 이전 1 2 3 4 ··· 16 다음