목록분류 전체보기 (186)
Iriton's log
참고 자료 누구든지 하는 리액트: 초심자를 위한 리액트 핵심 강좌 | VELOPERT.LOG이 튜토리얼은 리액트를 1도 모르는 사람들을 위해 작성되었습니다. 만약에 여러분이 리액트를 배우고 싶은데, 아직 뭐가 뭔지 잘 모르겠다! 그렇다면 이 튜토리얼을 진행하고 나면 리액트가 무velopert.com React에서는 state의 값을 직접 수정하면 안 된다. 불변성 유지 (데이터의 원본이 훼손되는 것을 막는 것) 때문인데 내장 함수(push, splice, unshift, pop) 배열 자체를 직접 수정하면 안 돼서 기존의 배열에 기반하여 새 배열을 만드는 함수(concat, slice, map, filter)를 사용해야 한다. 데이터 추가import React, { Component } from "r..
참고 자료 누구든지 하는 리액트: 초심자를 위한 리액트 핵심 강좌 | VELOPERT.LOG이 튜토리얼은 리액트를 1도 모르는 사람들을 위해 작성되었습니다. 만약에 여러분이 리액트를 배우고 싶은데, 아직 뭐가 뭔지 잘 모르겠다! 그렇다면 이 튜토리얼을 진행하고 나면 리액트가 무velopert.com 전화번호부 프로젝트 실습을 위해 새 프로젝트 생성 첫 번째 컴포넌트, PhoneForm 만들기// file: src/components/PhoneForm.jsimport React, { Component } from 'react';class PhoneForm extends Component { state = { name: '' } handleChange = (e) => { this.setS..
참고 자료 누구든지 하는 리액트: 초심자를 위한 리액트 핵심 강좌 | VELOPERT.LOG이 튜토리얼은 리액트를 1도 모르는 사람들을 위해 작성되었습니다. 만약에 여러분이 리액트를 배우고 싶은데, 아직 뭐가 뭔지 잘 모르겠다! 그렇다면 이 튜토리얼을 진행하고 나면 리액트가 무velopert.com LifeCycle API란 컴포넌트가 우리 브라우저에서 나타날 때, 사라질 때, 그리고 업데이트 될 때 호출되는 API이다. 컴포넌트 초기 생성constructorconstructor(props) { super(props);}컴포넌트 생성자 함수이다. 컴포넌트가 새로 만들어질 때마다 함수가 호출된다. componentDidMountcomponentDidMount() { // 외부 라이브러리 연동: D3,..
참고 자료 누구든지 하는 리액트: 초심자를 위한 리액트 핵심 강좌 | VELOPERT.LOG이 튜토리얼은 리액트를 1도 모르는 사람들을 위해 작성되었습니다. 만약에 여러분이 리액트를 배우고 싶은데, 아직 뭐가 뭔지 잘 모르겠다! 그렇다면 이 튜토리얼을 진행하고 나면 리액트가 무velopert.com 새 컴포넌트 만들기src/component/test 폴더를 생성하여 MyName이라는 컴포넌트를 만든다.import React, { Component } from 'react';class MyName extends Component { render() { return ( 안녕하세요! 제 이름은 {this.props.name} 입니다. ); }}export de..
참고 자료 누구든지 하는 리액트: 초심자를 위한 리액트 핵심 강좌 | VELOPERT.LOG이 튜토리얼은 리액트를 1도 모르는 사람들을 위해 작성되었습니다. 만약에 여러분이 리액트를 배우고 싶은데, 아직 뭐가 뭔지 잘 모르겠다! 그렇다면 이 튜토리얼을 진행하고 나면 리액트가 무velopert.com재사용 가능한 컴포넌트로 분리 작성함으로써 프로젝트의 유지보수성을 우수하게 한다. App.jsimport React, { Component } from 'react';파일에서 JSX를 사용하려면 필수적으로 React를 import 해야 한다.리액트와 그 내부의 Component 불러온다. import logo from './logo.svg';import './App.css';webpack을 사용하여 파일을 불..
스터디 참고 자료https://youtube.com/playlist?list=PLuHgQVnccGMBxNK38TqfBWk-QpEI7UkY8&si=l0cktZbzZIUvhKWS JavaScript Immutability www.youtube.com 불변성이란 데이터 원본이 훼손되는 것을 막는 것이다.데이터를 불변하게 다루면 데이터들 간의 간섭으로 인한 버그의 가능성을 획기적으로 낮출 수 있다.또, 데이터가 변경되었는지 여부를 쉽게 체크할 수 있으며 특히 CRUD(Create, Read, Update, Delete) 작업 시, 불변성을 보장하는 것이 매우 중요하다. 이름에 대한 불변함const를 사용하여 이름을 불변하게 만든다.const를 사용하게 되면 선언한 변수를 수정할 수 없게 되며, 수정을 시도..
blind-commandRead the flag file XD Reference Web Hackingdreamhack.io 페이지 분석문제 페이지에 접속하면 보이는 화면이다.cmd 파라미터를 통해서 명령어를 실행할 수 있나? 싶어서 ls를 먼저 보냈다. 문자열을 그대로 출력한다. 코드 분석코드는 너무 간단하다.cmd 값이 있을 때 기준, 요청이 GET 메소드인 경우 조건문 아무런 동작을 하지 않고다른 메소드일 경우 시스템 명령어를 실행한다. URL을 통해 ?cmd=ls를 추가했을 때 HTTP 요청 메소드가 GET 메소드이기 때문에 실행되지 않았다./ 경로에서 methods=['GET']으로만 정의되어 있다. 웹 서버에 POST 메소드로 전달하는 것도 POST 메소드가 정의되어 있지 않아서 불가하다. ..
보호되어 있는 글입니다.