55,000원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결실전 프로젝트로 배우는 타입스크립트
모듈 알리아스(as) 질문 드립니다.
import * as Chart from 'chart.js'; 이렇게 가져온 모듈은 Chart.Chart.defaults.coror 로 접근해야 하는것 아닌가요? 어떻게 Chart. 으로 바로 접근할수있어여?
- 미해결실전 프로젝트로 배우는 타입스크립트
프리티어 안되시는 분들
강의에선 format on save를 체크 하지말라고 하는데, 전 체크를 해제하니 프리티어가 적용이 안되었습니다 오히려 전 체크를 한 후 아래 같이 디폴트 포매터를 적용하니 잘 되었습니다.
- 해결됨실전 프로젝트로 배우는 타입스크립트
프론트개발관련모듈질문
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요!! 강의 잘듣고있습니다! 질문을 자주해서 죄송합니다 ㅠㅠ 강의를 듣다가 궁금한 점이있습니다. 프론트 개발쪽은 axios 모듈을 사용한다면 html쪽에도 cdn(<script>) 방식으로 선언을 하고 모듈을 직접적으로 사용하는 js/ts 파일에도 import로 선언을 총 2곳에 해야하나요??
- 해결됨실전 프로젝트로 배우는 타입스크립트
변수 선언 할때 타입 선언과 타입 단언 관련 궁금점이있습니다.!
안녕하세요! 강의잘듣고있습니다!! 타입 선언과 동시에 타입단언을 할때 보통 어떤 식으로 사용하는지 궁금해서 문의남깁니다! 1.const deathsTotal: HTMLParagraphElement = $('.deaths') as HTMLParagraphElement; 2. const deathsTotal = $('.deaths') as HTMLParagraphElement; 영상에서는 선언할때 타입은 빼고 단언만 하고 마무리하시던데 대부분 단언 하는 경우에는 선언 할때 타입은 안적나요??
- 미해결실전 프로젝트로 배우는 타입스크립트
char.js 3.대로 업그레이드 후 발견된 오류
char.js 관련 에러입니다. 먼저 올려주신 분 과 같이 에러가 나서 chart.js 버전 업그레이드 후 업로드를 햇더니 클릭 후 다른 나라 클릭시 에러가나는데 chart.js 플러그인 메서드인 destroy()를 사용하면된다는데 해당 메서드를 어떻게 사용해야되는지를 모르겠습니다.
- 미해결실전 프로젝트로 배우는 타입스크립트
개인 프로젝트 리팩토링 중 질문!
일단 강의 관련 질문이 아니라서 죄송하단 말씀 먼저 드립니다. 강의를 수강한 후 제 개인 프로젝트를 타입스크립트로 리팩토링 중에 발생한 문제를 해결하고자 열심히 찾아봤으나 가로막혀 질문드리고 싶어서 여기에 글 남기게 되었습니다. 혹시나 도움받을 수 있다면 정말 감사할 것 같습니다.
- 미해결실전 프로젝트로 배우는 타입스크립트
오류가 이렇게 나는데 왜 이럴까요...
chart.js 를 다운받은 후 * as 를 붙인 뒤 확인을 해보니 이런 오휴가 나오는데 왜 이런 오류가 뜰까요..
- 미해결실전 프로젝트로 배우는 타입스크립트
API함수 return타입 정의시에 Promise<>를 작성해야 하는 이유가 무엇인가요?
API함수 타입 정의 시에 Promise<AxiosResponse<CovidSummaryResponse>> 이런식으로 앞에 Promise를 붙이는 이유가 무엇인가요?
- 해결됨실전 프로젝트로 배우는 타입스크립트
Chart.js 3.5.1 버전으로 차트를 렌더링 할때 destroy하고 다시 렌더링해야 하는 이슈
안녕하세요 강사님 :)저는 현재 Chart.js 3.5.1 버전으로 프로젝트를 따라가는 중입니다. 그런데 아래와 같은 코드로 할 경우에 서로 다른 나라를 클릭해서 차트를 렌더링하게 되면 차트를 destroy 해야한다는 에러메세지가 뜹니다. function renderChart(data: number[], labels: string[]) { const ctx = ($('#lineChart') as HTMLCanvasElement).getContext('2d'); Chart.defaults.color = '#f5eaea'; Chart.defaults.font.family = 'Exo 2'; Chart.register( LineElement, LineController, CategoryScale, LinearScale, PointElement, Filler ); new Chart(ctx, { type: 'line', data: { labels, datasets: [ { label: 'Confirmed for the last two weeks', backgroundColor: '#feb72b', borderColor: '#feb72b', data, fill: true, }, ], }, options: {}, }); } 그래서 이를 해결하기 위해 아래와 같은 코드를 작성했더니, 제대로 렌더링이 됐습니다. 그러나 제대로된 해결 방법인지 잘 모르겠어서 질문 드립니다. casetChart라는 변수에 any 대신 Chart 인스턴스의 타입을 넣어야할거같은데, chart.js 노드모듈 폴더의 index.esm.d.ts 파일을 봤는데 어떤걸 가져와서 넣어야하는지 모르겠습니다. 그리고 아래와 같은 방식으로 destroy 하는 게 맞는 방법인지 궁급합니다. let casesChart: any; function renderChart(data: number[], labels: string[]) { const ctx = ($('#lineChart') as HTMLCanvasElement).getContext('2d'); if (casesChart !== undefined) { casesChart.destroy(); } Chart.defaults.color = '#f5eaea'; Chart.defaults.font.family = 'Exo 2'; Chart.register( LineElement, LineController, CategoryScale, LinearScale, PointElement, Filler ); casesChart = new Chart(ctx, { type: 'line', data: { labels, datasets: [ { label: 'Confirmed for the last two weeks', backgroundColor: '#feb72b', borderColor: '#feb72b', data, fill: true, }, ], }, options: {}, }); }
- 해결됨실전 프로젝트로 배우는 타입스크립트
DOM 객체의 타입 단언
안녕하세요 :) 강의를 보면 p 태그는 HTMLParagraphElement로 타입단언을 하고, span태그는 HTMLSpanElement로 타입단언을 하셨습니다. 그런데 만약 이렇게 해야할 경우 어떤 태그인지 모두 파악하여 세부적으로 타입 단언을 해줘야하나요? 현재 프로젝트에서는 innerText때문에 타입단언을 하셨는데, HTMLElement 에도 innerText프로퍼티가 있는데 왜 저렇게 세부적으로 구분해서 타입 단언을 하신지 궁금합니다! 그리고 실제 타입스크립트 프로젝트에서도 만약 DOM 조작을 직접 할 경우에 저렇게 구체적으로 타입 단언을 해야하나요?
- 미해결실전 프로젝트로 배우는 타입스크립트
ESLint 가 제대로 적용되는건지 잘 모르겠습니다
강사님이 제공해주신 셋업가이드 를 따라서 모두 설정했는데, ESLint가 적용이 제대로 되는지 잘 모르겠습니다ㅠㅠ 예를 들어 var a = 10; 을 입력하고 save했을때 const 로 변환되기도 하고, eslint 서버가 돌아가는 것도 확인이 되는 것 같은데, vscode 하단 상태표시줄에 ESLint에 체크 표시가 없고 Prettier에는 더블체크표시가 됩니다. 현재 화면과 settings.json 첨부합니다..도와주세요! { "workbench.colorTheme": "Material Theme Darker High Contrast", "prettier.semi": false, "prettier.useTabs": true, "prettier.tabWidth": 2, "explorer.confirmDelete": false, "editor.tabSize": 2, "editor.defaultFormatter": "esbenp.prettier-vscode", "[javascript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "files.autoSave": "off", "workbench.iconTheme": "material-icon-theme", "liveServer.settings.donotVerifyTags": true, "liveServer.settings.donotShowInfoMsg": true, "tabnine.experimentalAutoImports": true, "window.zoomLevel": 1, "solidity.compileUsingRemoteVersion": "v0.5.6+commit.b259423e", "vetur.format.defaultFormatterOptions": { "js-beautify-html": { "wrap_attributes": "force-expand-multiline" }, "prettyhtml": { "printWidth": 100, "singleQuote": false, "wrapAttributes": false, "sortAttributes": false } }, "workbench.editor.untitled.hint": "hidden", "security.workspace.trust.untrustedFiles": "open", "editor.suggestSelection": "first", "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue", "prettier.endOfLine": "auto", "eslint.alwaysShowStatus": true, "eslint.workingDirectories": [ { "mode": "auto" } ], "eslint.validate": [ "javascript", "typescript" ], "editor.codeActionsOnSave": { "source.fixAll.eslint": true }, "editor.formatOnSave": false }
- 해결됨실전 프로젝트로 배우는 타입스크립트
chart.js@2.8.0 버전 관련 에러
현재 강의를 수강하는 시점에서 js파일과 index.html 파일로 구성된 프로젝트 파일을 실행해보면 위와 같은 에러가 발생합니다. 정확한 에러 발생 이유는 모르겠으나 chart.js@2.8.0 버전에서 Chart.defaults를 구성하는 프로퍼티들이 변경된 것 같습니다. 그래서 저는 해결 방법으로 현재 버전으로 cdn경로를 수정하여 현재 기준 최신 버전을 받도록 변경했습니다. "https://cdn.jsdelivr.net/npm/chart.js@3.5.1" 그리고 3.5.1버전에서는 생성된 Chart 인스턴스의 datasets 안에 있는 객체에 fill: true 를 추가해야 백그라운드에 색깔이 들어갑니다. 추가하지 않는 경우 디폴트 값으로 false로 되어있는 것 같습니다. 이렇게 해결하면 되는게 맞나요 강사님?위와 관련된 질문이 올라와있지 않길래 남겨봅니다.강의 잘 듣고 있습니다. 감사합니다 :)
- 미해결실전 프로젝트로 배우는 타입스크립트
Vue2.0에서 타입스크립트를 적용하려면 어떻게 해야하나요?
안녕하세요! 타입스크립트 강의를 듣고 있는 학생입니다! 현재 만들고 있는 프젝에 타입스크립트를 적용해보려고합니다!! Vue 2.0에다가 Typescript를 적용하려고하는데 build를 어떻게 해야할 지 모르겠어서 질문을 남깁니다. - 타입스크립트 라이브러리 설치와 tsconfig.json 파일 생성은 해주었습니다. build나 start할 때 vue2.0과 함께 타입스크립트를 빌드시킬 방법이 있을까요?
- 해결됨실전 프로젝트로 배우는 타입스크립트
[질문] eslint.validate
안녕하세요 캡틴판교님 typescript 입문 강의 부터 실전까지 정말 강의 잘 듣고 있습니다 :) setting.json 에서 validate 를 추가하면 아래와 같은 에러가 발생하는데 구글링을 하면서 찾아보고 적용을 해봐도 도저히 해결을 못하겠어서 글을 남깁니다.뭐가 문제인지 알고싶습니다. :) setting.json 입니다 . { "editor.codeActionsOnSave": { "source.fixAll.eslint": true },--------------------------------------------이 부분을 추가하면 아래 에러가 발생합니다. "eslint.validate": [ "javascript", "typescript" ],_-------------------------------------------- "eslint.alwaysShowStatus": true, "eslint.workingDirectories": [ { "mode": "auto" } ], "javascript.suggestionActions.enabled": false, "liveServer.settings.donotShowInfoMsg": true, } 에러ESLint: Failed to load plugin '@typescript-eslint' declared in '.eslintrc.js': Class extends value undefined is not a constructor or null Referenced from: C:\Users\dlals\OneDrive\바탕 화면\captain\learn-typescript\project\.eslintrc.js. Please see the 'ESLint' output channel for details. .eslintrc.js입니다 ↓ module.exports = { parserOptions: { parser: '@typescript-eslint/parser', }, root: true, env: { browser: true, node: true, }, extends: [ 'eslint:recommended', 'plugin:@typescript-eslint/eslint-recommended', 'plugin:@typescript-eslint/recommended', ], plugins: ['prettier', '@typescript-eslint'], rules: { 'prettier/prettier': [ 'error', { singleQuote: true, semi: true, useTabs: false, tabWidth: 2, printWidth: 80, bracketSpacing: true, arrowParens: 'avoid', }, ], }, };
- 미해결실전 프로젝트로 배우는 타입스크립트
질문) 왜 이렇게 나오는지 모르겠네요^^;
(사진)
- 미해결실전 프로젝트로 배우는 타입스크립트
화면 및 차트가 제대로 동작하지 않고 있습니다.
안녕하세요. 캡틴 판교님. 영상을 보고 있는 시점은 21.10.3일 입니다. 현 시점에서 코드 기능을 바꾼건 없고 영상을 보면서 타입만 입히고 있었습니다. 그런데 처음 화면에서 맨처음 아무 나라를 선택하면 TotalDeaths와 Total Recovered는 잘 나오고, console에 'app.js:204 Uncaught (in promise) TypeError: Cannot set properties of undefined (setting 'family')' 에러가 뜨고 차트도 출력이 되지 않습니다. 그리고 다른 나라를 클릭하게 되면 클릭이 되지않고 먹통이 되고 있습니다.Total Death chart.Js에 변화도 있고 그래서 하나하나 찾아보려고 하는데 다른 나라 클릭도 안되고 console에 찍히는 에러메시지는 어떻게 해결 할 수 있는지 궁금합니다 ㅜㅜ
- 미해결실전 프로젝트로 배우는 타입스크립트
키보드 뭐쓰시나요?
학습 관련 질문이 아니라 죄송합니다. 소리가 참 마음에 드는데 쓰시는 키보드 모델이 궁금합니다ㅎㅎ
- 미해결실전 프로젝트로 배우는 타입스크립트
'Defaults' 형식에 'global' 속성이 없습니다.
package.json { "name": "project", "version": "1.0.0", "description": "최종 프로젝트 폴더입니다", "main": "app.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "build": "tsc" }, "keywords": [], "author": "", "license": "ISC", "devDependencies": { "@babel/core": "^7.15.0", "@babel/preset-env": "^7.15.0", "@babel/preset-typescript": "^7.15.0", "@typescript-eslint/eslint-plugin": "^4.29.3", "@typescript-eslint/parser": "^4.29.3", "eslint": "^7.32.0", "eslint-plugin-prettier": "^3.4.1", "prettier": "^2.3.2", "typescript": "^4.4.2" }, "dependencies": { "axios": "^0.21.3", "chart.js": "^3.5.1" } } 에러 원인을 모르겠습니다..
- 미해결실전 프로젝트로 배우는 타입스크립트
Uncaught ReferenceError: exports is not defined
제목과 같이 오류가 발생하는데 어떻게 해결해야 하는지 알수 있을까요?
- 미해결실전 프로젝트로 배우는 타입스크립트
app.ts에서 또 다른 오류...
판교님 안녕하세요. 강의 수강 도중에 아래와 같이 에러가 떴었는데 어떤 걸 추가해줘야 하나요?? 'number[]' 형식의 인수는 'number' 형식의 매개 변수에 할당될 수 없습니다.ts(2345)