윈터애플파이의 개발일기

이전 글 : #06. 상수 입력하기 문자와 숫자를 입력하고 각각을 더해보자. const string1 = '1'; const string2 = '2'; const number1 = 1; const number2 = 2; console.log('문자를 더하면:%s',string1 + string2); console.log('숫자를 더하면:%d',number1 + number2); console.log('문자와 숫자를 더하면:%s',string1 + number2); 결과 문자와 문자를 더하면 문자 두개를 이어 붙인 것이 출력 된다. 숫자와 숫자를 더하면 두 숫자를 더한 값이 출력된다. 문자와 숫자를 더하면 문자와 문자를 더한것 처럼 출력된다. 문자인지 숫자인지 구분은 어떻게 할 수 있을까? isNaN() ..

이전 글 : #04 Do it! 리액트 프로그래밍 정석 스터디 4일차[153~221p] Do it! 리액트 앱 프로그래밍 정석 국내도서 저자 : 박호준 출판 : 이지스퍼블리싱 2020.02.07 상세보기 커링 개념이 복잡해서 이해하기 어려웠다. 그동안 자바나 C#을 다뤘어서 그런지 상속개념이 더 익숙했는데 상속 패턴보다 클래스 간 종속성 없이 기능만 공유하는 데코레이터 패턴에 대해 익숙해져야 하는 건 어려웠다. 솔직히... 원래 리액트가 어려운건지 아니면 책이 어려운건지 내가 돌대가리인 건지 모르겠어... 이 책 공부하면서 느낀건 이 책은 완전히 리액트를 처음 다뤄보는 초보용은 아닌 거같다. 초보보다는 리액트 문장 구조는 대략 알아야 할 거같다... 이 책은 ~합니다, ~는 ~해서 ~입니다 이런 식으로 ..

이전 글 :#05. 변수 입력하기 변수와 상수에 대해 알아보자. 예전엔 var로 모든 걸 해결했다면, ES6엔 let, const가 있다. let은 지난 시간에 해보았으니, 상수 const를 알아보자. const num = 123.456; num = 987.654; console.log(num); 결과는 이렇다. 이미 정의된 상수 num에 재할당 하려고 하니 에러가 났다. Assignment to constant variable.

이전 글 : #03 Do it! 리액트 프로그래밍 정석 스터디 3일차[79~152p] Do it! 리액트 앱 프로그래밍 정석 국내도서 저자 : 박호준 출판 : 이지스퍼블리싱 2020.02.07 상세보기 storybook을 설치해서 화면에 띄우는데 자꾸 자바스크립트 오류가 나서 질문게시판을 찾아보니 같은 오류가 났던 사람이 질문했던 게 있어서 똑같이 했다. node-module을 삭제하고 재설치 하니 작동이 되었다. 파일 만들고 나서 보니 정오표에서 폴더명, 파일명 정정이 있었단 걸 알아서 만들고 나서 수정을 하였다. 근데 자꾸 에러가 뜨는데 해결 방법이 node-module 재설치 밖에 답이 없어서 답답하다....

이전 글 : #04. 주석 달아보기 변수를 입력해보자. // 변수 선언하기 let myname = '이철수'; console.log('내 이름은:', myname); myname = '김영희'; console.log('내 이름은:', myname); var yourname ='김철수'; console.log('네 이름은:', yourname); var yourname = '이영희' console.log('네 이름은:', yourname); 결과 ES6에선 let을 쓴다. ES6 이전엔 var를 사용했다. var의 경우 같은 이름의 변수를 두 번 이상 선언해도 에러가 뜨지 않으며 다른 내용으로 변한다. 한편 let은? //이렇게 하면 에러가 떠요 let yourmother = '복분자'; let yourm..

이전 글 :#02 Do it! 리액트 프로그래밍 정석 스터디 2일차[53~78p] Do it! 리액트 앱 프로그래밍 정석 국내도서 저자 : 박호준 출판 : 이지스퍼블리싱 2020.02.07 상세보기 React의 컴포넌트 사용법에 대해서 자세히 알 수 있었다. es6이 익숙하지는 않아 코드를 이해하기 어렵지만, 계속 코드를 쳐 보니 어떤 인수가 들어가서 어떠한 결과가 나오는지에 대해서는 이해했다. 컴포넌트를 작성해보면서 엄청 신기했다... 백엔드만 했다보니깐 그런가..... 와 엄청 신기하다.

이전 글 : #03. 콘솔에 Hello World 출력하기 02 어... javaScript와 똑같다. 주석은 영어로 하면 comment로 주로 이 코드가 무슨 코드인지 간단하게 적을때 사용한다. 내가 현업에서 사용했던 건... 무슨 기능을 하는 함수인가를 표시할 때 쓰거나, 공통 패키지엔 들어가는데 패키지 이용자(=특정 기업)가 그 기능을 안쓸 경우에 그 안쓰게 된 기능을 사용자(=기업)가 언젠간 다시 쓸 수도 있고 업뎃할 때 반영될 수 있기 때문에 코드를 삭제하기 보다는 주석을 달아서 감춰놓을때 주로 사용했다. 그 외에도 사용자(=기업)가 건드린 환경 에러뜰 때 테스트 환경에서 하나하나 체크할 때 써먹었었다. // 한 줄 주석 console.log('이건 뜬다?'); // console.log('이건..

이전 글 : #01 Do it! 리액트 프로그래밍 정석 스터디 1일차[16~48p] Do it! 리액트 앱 프로그래밍 정석 국내도서 저자 : 박호준 출판 : 이지스퍼블리싱 2020.02.07 상세보기 어려웠던 점 기존의 자바스크립트와 ES6코드를 비교했을 때 코드 수가 좀 더 늘어난 거 같지만, 한결 간결해졌다. 어떤 처리를 하는지 알기 쉬워졌다. 규칙을 이해하기는 어렵지만 앞으로 계속 배우면 금방 익힐 수 있을 것 같다. 예전에 자바스크립트 배울때 동기, 비동기 배웠던거 까먹어서 더 어렵게 느껴지더라... 가장 최근에 했던 업무에서도 자바스크립트보단 C#, ASP.NET 위주로 썼었으니깐...

이전 글 : #02. 콘솔에 Hello World 출력하기 01 ■포맷팅해서 출력하기 다음의 코드를 입력해보자 // 포맷팅 출력 // 문자열 console.log('이름:%s','홍길동'); // 숫자데이터 console.log('나이:%d', 20); console.log('소수를 입력해보자:%d', 99.9); // 두 가지 이상 이어서 출력 console.log('이름:%s, 나이:%d','홍길동', 20); console.log('이름:%s, 나이:%s','홍길동', 20); console.log('이름:%s 나이:%d 소수를 입력해보자:%d','홍길동', 20, 99.9); 자바에서 Spring.format를 사용할 줄 안다면 이해하기 쉽다. (C#은 string.format였나. 다른 언어는 ..

Do it! 리액트 앱 프로그래밍 정석 국내도서 저자 : 박호준 출판 : 이지스퍼블리싱 2020.02.07 상세보기 책을 보니 공부단이란걸 하길래 카페 가입해서 공부단 신청하고나서 이 글을 쓴다. 오늘(20/11/24)부터 13일간 (20/12/06까지) 공부를 해나가고자 한다. 공부한 내용 01. 리액트 시작하기 현재 주목 받고 있는 프레임워크중에 가장 많이 사용하는 것은 리액트 이다. 리액트는 화면출력 특화 프레임워크이다. 설치 : NVM(노드버전매니저) 설치 -> Node.js 설치 -> Node.js 사용 설정-> yarn 설치 -> create-react-app 설치 ->프로젝트(리액트 앱) 생성. 구동 구동하고자 하는 디렉토리로 이동한 뒤 'yarn start' package.json 수정해서..