리액트의 state에 대해 알아보자
Archives: 프론트엔드
스코프에 대해서 알아보자
Promise와 Async로 Callback Hell을 탈출해보자
문제상황 7,8번째 줄에서 다음과 같은 에러가 뜬다. Function declared in a loop contains unsafe references to variable(s) ‘direction’. 왜 이런 에러메세지가 나왔는지 짐작은간다. todos를 루프 돌리면서 안에있는 함수를 호출할때는 이미 direction이 내가 의도한 값이 아니기 때문이다. 예를들어서, 실행해보면 12만 계속 나온다. 당연하다! 실행시점에서 a를 찾아 찾아 위로 올라갔을때(scope chain) 이미 a값은 12가 되어있기 때문이다. 그래서 […]
공통점 박스 선언 둘다 어떤 값을 넣기 위한 박스를 만드는데 사용된다. 함수 안에서 밖을 참조 함수 밖에있는 값들을 함수 안에서 참조할 수 있다. 함수 안에 함수가 있어도 마찬가지이다. if문(block) 안에서도 참조 가능하다. 함수 밖에서 안을 참조 함수 밖에서 안에있는 변수를 참조할 수 없다. 차이점 Scope 기본적으로 함수안에 박스(= var, let)를 선언하면, 해당 박스는 그 함수 […]
new Person(“안녕하세요 저는 윤병인입니다”);에서 무슨 일이 일어난걸까? customNew new의 작동방식을 이해하기 위해서 new 연산자와 비슷한 일을 하는 customNew를 구현해보자. 1. 빈 오브젝트 생성 new 키워드를 함수에 쓰면, 먼저 빈 오브젝트(obj)가 하나 만들어 진다. 2. prototype 넘겨주기 obj의 __proto__ 속성에다가 생성자 함수(Person)의 prototype을 넘겨준다. 이렇게 하면, obj에서도 talk()함수를 쓸 수 있게된다. 3. constructor함수에 this를 obj로하고 인자값 […]
참고 : https://stackoverflow.com/questions/48475500/webpack-scss-how-to-work-with-image-paths 현재상황 파일 구조 style.scss webpack.config.js 내가 원하는 상황 webpack을 빌드하면 dist폴더의 구조는 아래와 같이 되고 style.css파일안에서 background-image를 지정하는 부분은 이렇게 되는것이다. 일단 Build해보자 에러가 따-악 You may need an appropriate loader to handle this file type OK, 내 추측으로는 style.scss파일의 url(‘./assets/bg.png’)가 문제인것같다. 이 코드를 처리할 수 있는 loader가 없다는 의미인듯. file-loader를 설치해보자고 […]
문제상황 keyboard.ts파일에 Keyboard class를 만들고, export했다. main.ts파일에서 keyboard.ts파일을 import했는데 다음과 같은 에러가 나왔다. 내 코드 keyboard.ts main.ts 해결방안 찾기 webpack.config.js 파일에 문제가? webpack에서 import할때 확장자명을 안붙이는데, 기본적으로 확장자가 js파일이라고 인식하는것같다. 그래서 javascript로만 프로젝트를 진행할때는 문제가 없는데, typescript를 쓰면 문제가 발생한다. 확장자명이 ts파일이라서 해당 파일을 못찾기 때문이다. 그래서, webpack.config.js 파일의 resolve부분에 extensions를 직접 지정해줘야한다. 문제가 해결되었다!
문제상황 typescript와 webpack을 같이 사용하려고 했다. webpack, webpack-cli, webpack-dev-server를 devDependencies로 깔고 typescript는 global로 깔았다. 근데 build해보니까 아래와 같은 에러가 났다. 해결방안 찾기 재건설 여기에 나온대로 cache를 지우고, node_modules폴더와 package-lock.json파일을 삭제해봤다. 하지만 그래도 똑같은 에러가 났다. webpack을 잘못쓴듯 ./node_modules/.bin/webpack 이 코드를 써서 build를 했는데, 그냥 cmd에 webpack이라고 하니까 다른 에러가 나왔다. 다시말해서,,,처음에 만난 에러는 /node_modules/.bin/webpack이거를 써서 […]
문제상황 webpack, webpack-cli, webpack-dev-server를 깔고, 공식사이트에 나온대로 webpack serve –open 를 쳤다. 근데 다음과 같은 에러가 나왔다. 해결방안 찾기 구글링해서 여기를 찾았다. 브라우저 지정하기 근데 크롬을 모른단다. 크롬 실행파일로 바꿔볼까 chrome.exe파일을 찾을 수없다… 모를만 하지. full path를 적어보자. path에 \가 들어가니까 에러가 뜬다. \를 2개 붙였는데도 안된다. 아래처럼 하니까 되었다! 문제상황 webpack, webpack-cli, webpack-dev-server를 깔고, […]