잡식성 개발자

오일러 경로(Eulerian path)는 그래프의 모든 간선을 한 번씩만 방문하면서 출발점과 도착점이 다른 경로입니다. 파이썬으로 오일러 경로를 구하는 알고리즘은 다음과 같습니다. 그래프가 오일러 경로가 되는지 확인합니다. 이를 위해서는 그래프가 무방향 그래프이고 모든 정점의 차수가 짝수이거나, 정확히 두 개의 정점의 차수가 홀수이어야 합니다. 오일러 경로가 있다면 시작 정점을 선택합니다. 시작 정점은 차수가 홀수인 정점 중 임의의 하나를 선택하거나, 그렇지 않으면 아무 정점이나 선택할 수 있습니다. 시작 정점에서 출발하여 갈 수 있는 경로가 있는 동안 이동합니다. 이동한 경로는 스택에 저장합니다. 이동한 경로의 마지막 노드에서 출발하여 갈 수 있는 경로가 있는 동안 이동합니다. 이동한 경로도 스택에 저..

Conditional Rendering Condition 조건, 상태를 의미 Conditional Rendering 조건에 따른 렌더링 조건부 렌더링 어떠한 조건(조건문의 True, False)에 따라서 렌더링이 달라지는 것 function Greeting(props) { const isLogginedIn = props.isLoggedIn if (isLoggedIn) { return } return } Javascript의 Truthy와 Falsy Truthy : Javascript에서 True는 아니지만 True로 여겨지는 값 Falsy : Javascript에서 False는 아니지만 False로 여겨지는 값 // truthy true {} (empty object) [] (empty array) 42..

Event의 정의 및 Event 다루기 Event 특정 사건 예시 : 사용자가 버튼을 클릭한 사건 바인딩 사용하기 class Toggle extends React.Component { constructor(props) { super(props); this.state = { isToggleOn: True }; // callback에서 `this`를 사용하기 위해서는 바인딩을 필수적으로 해줘야 합니다. this.handleClick = this.handleClick.bind(this); } // 바인딩 사용 handleClick() { this. setState(prevState => ({ isToggleOn: !prevState.isToggleOn })); } render() { return ( {this..

JSX의 정의와 역할 JSX의 정의 A syntax extension to Javascript 즉 자바스크립트의 확장 문법 자바스크립트 + XML/HTML 1 const element = Hello, world!; 역할 JSX는 내부적으로 XML 코드를 자스로 변환하는 과정을 거침 React.createElement( type, [props], [...children] ) JSX를 사용한 코드 class Hello extends React.Component { render() { return Hello {this.props.toWhat}; } } ReactDOM.render( , document.getElementById('root') ); JSX를 사용하지 않은 코드 // JSX를 사용한 코드 cons..

섹션 2. 리액트 시작하기 index.html 잡식성 개발자 블로그에 오신 여러분을 환영합니다. 잡식성 개발자 블로그에 오신 여러분을 환영합니다. {/* DOM Conatiner(Root DOM Node) */} MyButton.js // MyButton.js function MyButton(props) { const [isClicked, setIsClicked] = React.useState(false); return React.createElement( 'button', { onclick: () => setIsClicked(true) }, isClicked ? 'Clicked!' : 'Click here!' ) } const domContainer = doc..

섹션 1. 리액트 소개 리액트는 무엇인가? 라이브러리 자주 사용되는 기능들을 정리해 모아 놓은 것 리액트는 자바스크립트 UI 라이브러리 프레임워크 vs 라이브러리 프레임워크 프로그램의 흐름의 제한을 개발자가 아닌 프레임워크가 가지고 있음. 라이브러리는 프로그램의 흐름을 개발자가 제어함. 리액트의 장점과 단점 리액트의 장점 빠른 업데이트와 렌더링 속도 Virtual DOM(Document Object Model) Component-Based 레고 블록 조립하듯 컴포넌트들을 모아서 개발 아래는 Air BnB 사이트 재사용성 계속해서 사용이 가능한 성질 - 모듈의 의존성을 낮추고 호환성을 높임. ⇒ 재사용성을 높임 - 효과 - 개발 기간 단축 - 유지 보수 용이 - Meta라는 든든한 지원군 - 커뮤니티의 활..

변수 컴퓨터 메모리(RAM)는 수많은 번지들로 구성된 데이터 저장 공간이다. 프로그램은 데이터를 메모리에 저장하고 읽는 작업을 지속적으로 수행한다. 이때 데이터를 어디에, 어떤 방식으로 저장할지 정해져 있지 않다면 메모리 관리가 매우 어려워질 것이다. Java는 이러한 문제를 해결하기 위해 변수를 사용한다. 변수는 데이터를 저장할 메모리의 위치를 나타내는 이름이다. 즉 하나의 값을 저장할 수 있는 메모리 번지에 붙여진 이름이다. 변수를 통해 프로그램은 메모리 번지에 값을 저장하고 읽을 수 있다. 메모리 상에 데이터를 보관할 수 있는 공간을 확보해야 하는데, 적절한 공간을 확보하기 위해서 변수의 타입이 등장한다. 자바는 정수와 실수만 변수로 저장할 수 있다. 이는 정수형 변수에 정수값을 저장하고, 실수형 ..

실행문, 세미콜론 main() 메소드 블록 내부에는 다양한 실행문이 작성된다. System.out.println("Hello.World");은 ()안의 내용을 출력하는 실행문이다. 실행문은 변수 선언, 변수값 저장, 메소드 호출에 해당하는 코드를 말한다. 아래는 앞으로 배울 실행문이다. int a; // 변수 a 선언 a = 2; // 변수 a에 2 값을 저장 int b = 4; // 변수 b를 선언하고 2 값을 저장 int result = a + b; // 변수 result를 선언하고 변수 a와 b를 더한 값을 저장 System.out.println(result); // 콘솔에 변수의 값을 출력한느 println() 메소드 호출실행문 끝에는 반드시 세미콜론(;)을 붙여야 한다. 그렇지 않으면 컴파일 에..

주석 주석은 프로그램 실행과는 상관없이 코드에 설명을 붙인 것이다. 복잡한 코드일수록 주석을 달면 전체 코드를 이해하기 쉽다. 주석은 컴파일 과정에서 무시되기 때문에 주석을 많이 작성한다고 해서 바이트코드 파일의 크기가 커지는 것은 아니다. Java에서 주석을 다는 방법은 아래와 같다. // 내용 : 해당 기호가 있는 위치부터 그 줄 끝까지 주석처리 /* 내용 */ : 해당 범위의 내용 주석처리 /** 내용 */ : Documentations API를 위한 주석 처리 주석 기호는 코드 내 어디든 작성이 가능하지만, 문자열(" ") 내부에서 작성하면 안 된다. 문자열 내부에서 주석 기호는 주석문이 아니라 문자열 데이터로 인식하기 때문이다. System.out.println("Hello, /* 주석이 될 수..

Java로 'Hello, World!'라는 문구를 출력하기 위해서는 아래와 같이 코드를 입력해야 한다. package ch01.sec09; public class Hello { public static void main(String args[]) { System.out.println("Hello, World!"); } }그럼 이 코드를 뜯어보며 살펴보자. 다음과 같은 코드를 패키지 선언어라고 부르며, 이는 소스 파일이 scr/ch01/sec09 패키지에 있다는 뜻이다. 컴파일 후 생성되는 바이트코드 파일도 bin/ch01/sec09 패키지에 생성된다. package ch01.sec09;public class Hello를 클래스 선언이라 부르며, Hello를 클래스명이라고 한다. 클래스명은 ..