본문 바로가기

분류 전체보기268

[리액트를 다루는 기술] Component (props,state) 리액트를 다루는 기술 내용 정리 3장 컴포턴트 함수형 컴포넌트의 장점메모리 자원을 덜 사용한다. 최종 결과물의 파일 크기가 더 작다.(단, 성능, 파일크기 면에서 사실상 큰 차이가 없어 중요하게 생각하지 않아도 괜찮다) 클래스형 컴포넌트 보다 선언하기가 편하다. 함수형 컴포넌트의 단점 state와 라이프사이클 API를 사용할 수 없다.(리액트 v16.8 업데이트 Hooks의 기능으로 해결) 초기에는 클래스형 컴포넌트를 통해 리액트의 기본기를 익히고 Hooks를 이해한 후 함수형 컴포넌트로 사용. ES6 화살표 함수주로 함수를 파라미터로 전달할 때 유용하다. setTimeout(function() { console.log('hello world'); }, 1000); setTimeout(()=> { con.. 2022. 4. 27.
[TIL] 2022.04.26 TIL 첫 번째 기록 2022년 4월 26일 리액트를 다루는 기술 1~2장 - JSX 문법 1. 감싸인 요소 2. { }를 활용한 자바스크립트 표현 3. if 문 대신 조건부 연산자(삼항 연산자) 4. AND 연산자(&&)를 활용한 조건부 렌더링 5. OR 연산자(||)를 활용한 undefined 렌더링 하지 않기 6. 스타일 처리에 인라인 스타일링(카멜 표기법) 7. class 대신 className 8. 태그 닫기 9. 주석 => {/* 주석 */} - const let var의 차이점 ES6 문법에서 const와 let 도입. var : 함수 스코프 let, const : 블록 스코프 모던 자바스크립트 Deep Dive 1~4장 - 변수 호이스팅 변수 선언은 런타임 이전에 실행되지만, 값의 할당은 .. 2022. 4. 26.
[프로그래머스] 숫자 문자열과 영단어_Javascript 문제 출처 코딩테스트 연습 - 숫자 문자열과 영단어 | 프로그래머스 (programmers.co.kr) 코딩테스트 연습 - 숫자 문자열과 영단어 네오와 프로도가 숫자놀이를 하고 있습니다. 네오가 프로도에게 숫자를 건넬 때 일부 자릿수를 영단어로 바꾼 카드를 건네주면 프로도는 원래 숫자를 찾는 게임입니다. 다음은 숫자의 일부 자 programmers.co.kr 위 문제는 숫자 문자열을 찾고 대응되는 숫자로 변경하면 되는 문제였다. 방법은 두가지로 진행. 1. 나의 풀이 replace([변경될 문자열], [변경할 문자열]) 문법: str.replace(regexp|substr, newSubstr|function) replace를 활용하면 간단하게 해결할 수 있다고 생각했으나, replace의 특성을 정확하게.. 2022. 4. 26.
2022.4.24 생각정리 잡담 및 앞으로의 목표를 정리하는 첫번째 생각정리 앞으로의 목표 1. 매일 개발 공부 및 TIL 정리 2. 하루 최소 1문제 이상의 코딩테스트 준비 3. Project 1일 1커밋 진행 우선 기존에 진행하던 리액트 강의를 진행하려고 한다. 2~3가지 정도의 리액트 강의를 직접 만들어보며 리액트에 익숙해지고, 개인 포트폴리오 사이트를 제작하려고 계획중이다. 추가로, 두가지 책을 완독하려고 한다. 1. 모던 자바스크립트 Deep Dive 2. 리액트를 다루는 기술 두가지 책 모두 아이패드를 활용해 e-book으로 공부하며 프론트엔드 개발자를 목표로 공부를 할려고 한다. 현재는 외국계 회사에서 3년 2개월 근무를 완료하고 퇴사했다. 퇴사를 준비하며 1년간 자바스크립트, 리액트, 프로그래머스 1단계 까지만 독학.. 2022. 4. 24.

티스토리툴바