inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

173만명의 커뮤니티!! 함께 토론해봐요.

+ 아이콘 안보이실때2

미해결

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

index.html에 설정하는 Font Awesome 태그는 기존버전태그(5.x) 대신 (<link.... ) 제가 강의를 듣고 있는 시점기준(8월 2일) 현재버전태그(6.1.2) 로 사용하시면 될 듯 싶습니다. (저는 요걸로 해결했습니다.) <script defer src="https://use.fontawesome.com/releases/v6.1.2/js/all.js" integrity="sha384-11X1bEJVFeFtn94r1jlvSC7tlJkV2VJctorjswdLzqOJ6ZvYBSZQkaQVXG0R4Flt" crossorigin="anonymous"></script> <TodoInput.vue> plus icon 태그: <i class="fa-solid fa-plus addBtn"></i> 6버전 CDN에 대한 내용은 아래 공식사이트 주소 들어가서 보시면 됩니다~ https://fontawesome.com/v6/docs/web/use-with/wordpress/install-manually

  • vuex
  • javascript
  • es6
  • vuejs
배수민 댓글 5 좋아요 8 조회수 994

웹페이지 로딩 시간

미해결

풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]

안녕하세요, 강의 너무 잘 듣고있습니다. 다름이 아니라 현재 만들고 있는 웹페이지를 열 때 로딩 시간이 너무 오래 걸리는데 혹시 head단의 메타데이터 작성부분에서 로딩을 오래 걸리게 하는 요소가 있는 것인지 궁금합니다. 아니라면 이유를 모르겠어요 ㅠㅠ 제가 따로 html파일을 간단하게 만들어서 브라우저로 열때는 로딩이 길지 않아서요!

  • HTML/CSS
  • es6
  • javascript
댓글 1 좋아요 0 조회수 274

강의 자료에 대하여

미해결

풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]

- 본 강의 영상 학습 관련 문의에 대해 답변을 드립니다. (어떤 챕터 몇분 몇초를 꼭 기재부탁드립니다) - 이외의 문의등은 평생강의이므로 양해를 부탁드립니다 - 현업과 병행하는 관계로 주말/휴가 제외 최대한 3일내로 답변을 드리려 노력하고 있습니다 - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요! 질 좋은 강의 너무 잘 듣고 있습니다. 따로 권한을 받아서 볼 수 있는 강의 자료도 정말 잘 정리되어 있어 공부하기 수월해요!! 감사드립니다. 강의자료에 대해서 여쭤볼게있는데요. 1. 권한은 수업과 동일하게 기한제한없이 볼 수 있는건가요? 2. 개인적인 궁금증으로써.. 보통 초보(혹은 중급)개발자분들은 이러한 모든 css특징들을 모두 외우시는지, 아니면 이러한 기능이 필요해! 할때 구글검색을 하며(혹은 강의자료) 그때그때 꺼내쓰는건지 궁금합니다

  • es6
  • HTML/CSS
  • javascript
댓글 1 좋아요 0 조회수 229

권한 요청드립니다.

미해결

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

인프런 아이디: tsseo.dev@gmail.com 인프런 이메일: tsseo.dev@gmail.com 깃헙 아이디: tsseo.dev@gmail.com 깃헙 username: 3rd-big

  • javascript
  • vuex
  • es6
  • vuejs
댓글 1 좋아요 1 조회수 145

i 태그에 v-on:click 이벤트랑 v-bind:class가 적용되지 않습니다.

미해결

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

강의를 보면서 따라서 타이핑하고 있는데, i 태그에서 이벤트랑 클래스 바인딩이 안됩니다. 아래에 span태그에서는 적용되는데, 이유가 뭔지 알 수 있을까요? <template> <div> <ul> <li v-for="(todoItem, index) in todoItems" v-bind:key="index" class="shadow"> <span v-on:click="toggleComplete(todoItem, index)"> <i class="checkBtn fas fa-check" v-bind:class="{checkBtnCompleted: todoItem.completed}"></i> </span> <span v-bind:class="{textCompleted: todoItem.completed}">{{todoItem.item}}</span> <span class="removeBtn" v-on:click="removeTodo(todoItem, index)"> <i class="fas fa-trash-alt"></i> </span> </li> </ul> </div> </template> <script> export default { data: function() { return { todoItems: [], } }, methods: { removeTodo: function(todoItem, index) { console.log('ffff'); localStorage.removeItem(todoItem); this.todoItems.splice(index, 1); }, toggleComplete: function(todoItem) { todoItem.completed = !todoItem.completed; } }, created: function() { if(localStorage.length > 0) { for (var i = 0; i < localStorage.length; i++) { this.todoItems.push(JSON.parse(localStorage.getItem(localStorage.key(i)))); } } } } </script> <style scoped> ul { list-style-type: none; padding-left: 0px; margin-top: 0; text-align: left; } li { display: flex; min-height: 50px; height: 50px; line-height: 50px; margin: 0.5rem 0; padding: 0 0.9rem; background: white; border-radius: 5px; } .removeBtn { margin-left: auto; color: #de4343; } .checkBtn { line-height: 45px; color: #62acde; margin-right: 5px; align-self: center; } .checkBtnCompleted { color: #b3adad; } .textCompleted { text-decoration: line-through; color: #b3adad; } </style>

  • i태그
  • vuex
  • v-bind:class
  • v-on:click
  • vuejs
  • es6
  • javascript
Aon 댓글 2 좋아요 1 조회수 783

favicon 경로 질문

해결됨

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

파비폰 아이콘을 index.html과 같은 경로인 public폴더에 넣고 태그 경로를 ./favicon.ico로 설정하면 잘 적용이 되는데 강의에서처럼 src/assets/경로에 넣고 (index.html이 public폴더에 있으므로 이에 접근하기위해) ../src/assets/favicon.ico로 설정하면 왜 정상적으로 적용이 되지 않을까요? 그리고 npm돌릴때 local로 들어갈때는 파비콘이 안뜨고 network로 들어갈땐 파비콘이 뜨는 이유도 알려주세요

  • vuex
  • es6
  • javascript
  • vuejs
조성락 댓글 1 좋아요 1 조회수 672

블록스코프 내에서 펑션을 선언해서 사용하는경우가 있나요?(실무)

미해결

Javascript ES6+ 제대로 알아보기 - 초급

제가 실무에서 2년간 일할땐 블록스코프 내에서 펑션을 만들어서 쓰는경우가 한 번 도 없었는데, 이 강의를 보고나서 이렇게 코드를 짜는 경우도 있나 궁금해서 질문드립니다!

  • es6
  • javascript
트릴 댓글 1 좋아요 0 조회수 372

프론트개발관련모듈질문

해결됨

실전 프로젝트로 배우는 타입스크립트

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요!! 강의 잘듣고있습니다! 질문을 자주해서 죄송합니다 ㅠㅠ 강의를 듣다가 궁금한 점이있습니다. 프론트 개발쪽은 axios 모듈을 사용한다면 html쪽에도 cdn(<script>) 방식으로 선언을 하고 모듈을 직접적으로 사용하는 js/ts 파일에도 import로 선언을 총 2곳에 해야하나요??

  • typescript
  • es6
JSTS 댓글 1 좋아요 1 조회수 245

변수 선언 할때 타입 선언과 타입 단언 관련 궁금점이있습니다.!

해결됨

실전 프로젝트로 배우는 타입스크립트

안녕하세요! 강의잘듣고있습니다!! 타입 선언과 동시에 타입단언을 할때 보통 어떤 식으로 사용하는지 궁금해서 문의남깁니다! 1. const deathsTotal : HTMLParagraphElement = $ ( ' .deaths ' ) as HTMLParagraphElement ; 2. const deathsTotal = $ ( ' .deaths ' ) as HTMLParagraphElement ; 영상에서는 선언할때 타입은 빼고 단언만 하고 마무리하시던데 대부분 단언 하는 경우에는 선언 할때 타입은 안적나요??

  • typescript
  • es6
JSTS 댓글 1 좋아요 1 조회수 245

선생님 수업 내용이 잘 이해가 안가는데요.

미해결

타입스크립트 입문 - 기초부터 실전까지

ㅜ,ㅜ 안녕하세요. 수업 내용중에 타입 제한을 쓰는 이유가 잘 이해가 안가는데요. 제네릭의 장점과 타입 추론에서의 이점 수업에서.. function logText < T > ( text : T ) : T { console . log (text); return text; } const str = logText < string > ( ' abc ' ); str . split ( '' ); const login = logText < boolean > ( true ); 이렇게 하면 str은 string, login은 boolean타입이 되어 각각 원하는 API나 관련 타입으로 이용이 가능하다고 하셨는데요. 그렇다면 아래 처럼 이렇게 하면 파라미터 반환값 모두 string형태인걸 자스도 알고 있는데 왜 length를 사용할 수 없나요? 자스에서 string에 string.length 속성이 있으니 사용할 수 있어야 하지 않나요? 그리고 타입 제한 수업 끝 부분에 function logTextLength < T > ( text : T ) : T { console . log (text . length ); return text; } logTextLength ( ' hi ' ); string을 자스가 알지 못하니 파라미터와 반환값에 배열을 넣어 타입 힌트를 주는게 타입 제한이라고 하셨는데요. 우리가 호출하고 싶은건 logTextLength('hi'); hi라는 string인데 왜 배열을 힌트로 알려주나요? 힌트를 줄거면 string이라고 힌트를 줘야 하지 않나요? string글자가 char의 array형태이기 때문에 배열 힌트를 준건가요? 미리 감사합니다. 선생님!!!

  • es6
  • javascript
  • typescript
masichyun77 댓글 1 좋아요 2 조회수 281

권한 요청드립니다

미해결

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

인프런 아이디 : guinness987@gmail.com 인프런 이메일 : guinness987@gmail.com 깃헙 아이디 : guinness987@gmail.com 깃헙 Username : kimchulyeon

  • es6
  • javascript
  • vuex
  • vuejs
댓글 1 좋아요 1 조회수 197

메일 확인 부탁드립니다!

미해결

풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]

메일 확인 부탁드립니다!

  • es6
  • HTML/CSS
  • javascript
장준 댓글 1 좋아요 0 조회수 176

ES6 문법 문제

미해결

자바스크립트 : 기초부터 실전까지 올인원

ES6 문법 문제 1번 문제를 replit으로 하니깐 let name = "noona's fruit store" let fruits = [ "banana" , "apple" , "mango" ] let location = "Seoul" let store = { name , fruits , location } console . log ( store ) 요렇게 하니 Identifier 'location' has already been declared. 에러가 납니다. 그래서 변수 선언을 let 에서 var로 바꾸고 locatin 을 var loca로 바꾸니깐 실행이 되었습니다. 왜 에러가 나는 걸까요? var name ="nonna's fruit store"; var fruits =["banana","apple","mango"]; var loca ="Seoul"; var store = {name, fruits, loca} console.log(store)

  • javascript
  • es6
  • HTML/CSS
유관희 댓글 1 좋아요 0 조회수 245

타입 단언 관련 질문이 있습니다!

해결됨

타입스크립트 입문 - 기초부터 실전까지

안녕하세여 강의잘보고있습니다! 타입 단언에 대해 궁금한점이있습니다. as 로 타입 단언을 해주면 null 같은 예외처리를 안해줘도 되는 건가여? as 로 단언 해도 null이 들어올 수 있는거아닌가요??(빨간 경고줄이 사라져서 여쭈어봅니다..) 아니면 단언을 한다는 것이 무조건 이것만 들어온다? 이런 느낌으로 받아 들이면될까요??..

  • es6
  • javascript
  • typescript
JSTS 댓글 1 좋아요 1 조회수 258

Component name "Modal" should always be multi-word. 에러

미해결

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

Vue 버전이 달라서 그런지 이제는 Vue파일을 생성할때 한 단어로는 파일 생성이 안되면서 Component name "Modal" should always be multi-word. 이러한 에러가뜹니다;; "Modal" 뒤에 다른 단어를 하나더 써 주었더니 해결되긴 하였습니다만 앞으론 이 규칙을 지키면 되는 건가요? 아님 헤제가 가능할까요?

  • javascript
  • vuejs
  • vuex
  • es6
Roy H 댓글 2 좋아요 5 조회수 1831

this의 scope

미해결

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

안녕하세요! this의 scope가 이해되지 않아 문의드립니다~ 모든 컴포넌트가 App.js에 등록되어 있고, App.js가 똑같은 Vue instance를 가르키고 있기 때문에 this를 거슬러 올라가면 똑같은 instance를 가르키고 있기 때문에 input에서 가르키는 this는 TodoInput 컴포넌트를 가르킨다. 이렇게 말씀하셨는데, 어떤 컴포넌트에서 this를 사용하면 거슬러 올라가면서 해당 객체(newTodoItem)를 찾는데 가장 가까운 객체를 찾는건가요? 아니면 해당 객체가 포함된 컴포넌트 안에서 찾는건가요? 만약 컴포넌트 안에서 찾는거라면 모든 컴포넌트가 App.js를 참조하고, App.js가 Vue instance를 참조하는 것과 무슨 관련이 있는건지 이해가 되지 않습니다. 답변 부탁드립니다 ^.^

  • this
  • javascript
  • vuejs
  • es6
  • vuex
초록곤룡용용이 댓글 1 좋아요 2 조회수 343

버전 차이!

미해결

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

현재 vuejs.org 에 접속하면, vue3 기준으로 나오기 때문에 아래 링크를 강의 하단에 첨부하셔서 강사님과 같은 코드를 사용할 수 있게 해주시면 감사하겠습니다:) https://v2.vuejs.org/v2/examples/modal.html

  • vuex
  • es6
  • vuejs
  • javascript
달세이 댓글 2 좋아요 2 조회수 534

순서가 뒤죽박죽

미해결

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

등록도, 삭제도 잘 되는데 새로고침하면 등록했던 순서대로 보여지는 것이 아니라 위치가 바뀌기도 하네요. 이런 건 어떻게 수정해주는 게 좋은가요?

  • vuejs
  • javascript
  • vuex
  • es6
달세이 댓글 1 좋아요 1 조회수 314

unknown mutation type: addOneItem

미해결

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

안녕하세요 좋은강의 감사합니다 다름이 아니라 잘되고 있었는데 모듈화 하고 난뒤부터 unknown mutation type: addOneItem 이에러가 나는데 혹시 어떻게 해결하면될까요? store.js todoApp.js 감사합니다

  • vuex
  • es6
  • vuejs
  • javascript
빙빙빙 댓글 2 좋아요 2 조회수 1013

밑줄 안생길때 해결법

해결됨

타입스크립트 입문 - 기초부터 실전까지

질문은 아니지만 도움될까해서 올려요 코드에 밑줄 안쳐지시는분들은 먼저 아래에 질문/답변 글에 나와있는 설정 다 따라 하신 후에 상단에 let todoItems 옆에 노란 글씨로 eslint is disabled since its execution has not been approved or denied yet .. 어쩌고 뜨는 곳 그 밑에 줄에 조그만 파란 전구 눌러서 무슨 창 나오면 allow 누르면 생깁니다. 참고하세요

  • javascript
  • typescript
  • es6
mozzzi.__ 댓글 1 좋아요 2 조회수 624

인기 태그

인프런 TOP Writers

주간 인기글