전체 글(142)
-
220412 웹TIL) 오류중심 - key props, PropTypes,className
1. key props 값은 유일해야 한다 key={movie.id} Movie 컴포넌트에 위와 같이 key props를 추가해주면 된다. 2. HTML에서는 class라고 쓰지만, 리액트에서는 className을 사용한다. 3. PropType propTypes 전부 PropTypes 라고 써줬는데 리액트 화면에서 에러가 났다. propTypes로 쓰라고. 그런데 고치다보니 어떤건 propTypes를 써야 하고 어떤 속성은 PropTypes라고 쓰라고 하고 어떤 것은 ProtoTypes 라고 이건 무슨..? Quick Fix를 하니 결과는 잘 나왔다. 그런데 왜 어떤건 propTypes라고 써줘야 하고 어떤 것은 PropTypes라고 써줘야 하는 걸까 구글링을 해보았는데 이런 케이스를 찾지 못했다.. ..
2022.04.12 -
220411 Linux) 리눅스 디렉토리 구조
/ (루트) 최상위 디렉토리 루트 아래의 모든 디렉토리가 루트로부터 상속을 받는다. 만약 /home/user/documents에 내가 파일을 저장했다면, 이 디렉토리 구조는 root->home->user->documents로부터 전달된 것이다. * 참고로 리눅스의 디렉토리 혹은 파일 시스템 구조는 윈도우와는 조금 다른 구조를 가지고 있다. 리눅스에서는 디렉토리 구분을 할 때 / (슬래시)를 이용하지만 윈도우는 \ (역슬래시)를 이용한다. 리눅스에서는 디렉토리라고 부르지만, 윈도우에서는 폴더 라고 부르는 약간의 차이가 있다. 리눅스 시스템의 디렉토리 구조는 전체적으로 역 트리 구조를 취하고 있다. 명령어의 종류와 성격, 사용권한 등에 따라 각각의 디렉토리들로 구분된다. /bin - 기본적인 명령어가 저장된..
2022.04.12 -
220411 알고리즘) JS를 이용하여 세 수 중 최솟값 출력
원래 알고리즘 2문제를 풀고 자려고 했으나 너무 피곤한 관계로 1문제만 풀고 자려고 한다. 세 수 중 최솟값 출력하기 answer 변수를 만들어놓고 그 안에 최솟값을 넣는 방법이다. 이 방법은 생각해보지 못했던 방법이다. 그리 어렵지 않은 방법이라서 쉽게 적응이 되었다.
2022.04.11 -
220408 웹TIL) state,리액트 생명주기,axios,async~await
1. state 리마인드 다시 한번 주의하자 리액트는 state가 변경되면 render() 함수를 다시 실행하여 변경된 state를 화면에 출력한다. 그런데 state를 직접 변경하는 경우에는 render() 함수를 다시 실행하지 않는다. 즉 어떤 동작이 업데이트가 되면(+ 버튼을 누른다거나, - 버튼을 누른다거나.. 하면) render() 함수가 다시 실행되어 그 결과를 화면에 출력해주는 것이다. 2. 리액트 생명주기 큼직큼직한것만 보자면 constructor() 함수 실행 > render() 함수 실행 > componentDidMount() 함수 실행 1.Add또는 Minus 버튼을 누르면 setState() 함수가 실행되고 2. 버튼이 눌렸으므로 화면의 변화가 생긴다. render() 함수가 다시 ..
2022.04.08 -
map() 함수에 대해서 (아직 헷갈려!)
요즘 리액트를 공부하면서 map() 함수가 눈에 많이 보인다. 그리고 이전에 파이썬 알고리즘을 공부할 때도 map() 함수를 썼었는데 이참에 map() 함수에 대해 좀 더 자세히 공부해보고자 한다. 아직까지는 개념이 헷갈리는 것 같다. map() - '자바스크립트' '배열' '객체 내장 함수'인 map 함수를 사용하면 반복되는 컴포넌트를 렌더링 할 수 있다. - map 함수는 파라미터로 전달된 함수를 사용해서 배열 내 각 요소를 프로세싱 한 후 그 결과로 새로운 배열을 생성한다 const numbers = [1,2,3,4,5]; let processed = numbers.map(function(num) { return num*nu }); ---화살표 함수로 정의시 const result = numbers..
2022.04.08 -
220407 웹TIL) 함수형/클래스형 컴포넌트,state,setState()
1. 함수형 컴포넌트 function App() { return ( 우리가 클래스형 컴포넌트를 사용하는 이유는 state 를 사용하기 위해서이다. state는 객체 형태의 데이터이고 state를 사용하려면 반드시 클래스형 컴포넌트 안에서 소문자를 이용하여 state라고 적으면 된다. 2. state의 쓰임 state는 동적 데이터를 저장할 수 있어야 한다. 동적이라는 것은 값을 바꿀 수 있다는 말인데, 즉 값을 바꿀 수 있도록 코드를 작성해야 한다. (예를 들면 사용자 동작에 따라 state의 count를 바꿀 수 있도록) react는 state를 직접 변경하지 못하게 한다. add = () => { // console.log('add'); this.state.count=1; }; minus = () =..
2022.04.08