🔥2022년 새로운 자바스크립트 마스터리 (ES6+ 최신문법) 강의가 런칭 되었어요. 유튜브보다 체계적으로 꼼꼼하게 기본&고급 내용 전부 배워보고 싶으시다면 → academy.dream-coding.com/courses/javascript 요즘 올림픽 경기 재밌게 보고 계신가요? 몇년동안 땀흘리며 열심히 준비한 선수들을 응원하면서, 나도 더 열심히 살아야겠다고 자극 받고 있어요 🔥 여러분들도 아자아자! 📒 예제 코드 깃 리파지토리 ⇢ github.com/dream-ellie/learn-javascript 📓 자바스크립트 재생 목록: ua-cam.com/play/PLv2d7VI9OotTVOL4QmPfvJWPJvkmv6h-2.html
우울증이 심해져 무언가 집중할 만한 일을 찾던 중 우연히 엘리님 영상을 보고 낯선 개발 공부를 시작하게 되며 용기를 얻곤했는데, 다시 자신감도 사라지고 모두 포기하고 싶어진 요즘에도 틈틈히 올라오는 엘리님 영상을 보니까 그때 첫 마음도 떠오르고 포기하지 말아야겠다는 생각이 드네요. 항상 이렇게 밝은 에너지로 힘이 되고 도움이 되는 영상들을 올려주셔서 항상 너무너무 감사드립니다! 영원한 제 멘토세요!
9:37 이렇게 하면 item에 detail 값이 들어가고 shirt0 === item이므로 item 객체가 오염되는 것을 원치 않으려면 Object.assign({}, item, detail)으로 써야합니다! 11:40 concat은 지금까지 기존 배열에 다른 배열의 값을 추가하는 것으로 알고 있었는데 알고보니 새 배열을 반환한 것이었군요 12:52 person.job?.title에서 job이 없을때 정확히는 undefined 입니다. 따라서 nullish polishing이 가능한 것이죠. 13:25 backtick키는 물결표와 같은 키를 쓰죠 16:43 하지만 배열 API들도 내부적으로는 각 원소들에 하나씩 연산하기 위해 루프가 사용되는데요, 이 예시도 루프를 3번 돌기 때문에 썩 좋은 코드는 아닙니다. 루프는 최소화시켜서 한번만 돌리는 것이 좋으므로, 꼭 재활용이 필요하지 않다면 배열 API도 하나만 쓰는 것이 좋습니다. 본 예제같은 경우에는 items.reduce((sum, num) => (num % 2)? sum : sum + num * 4, 0)으로 합칠 수 있습니다. 각 원소별로 2의 나머지가 있는지 확인하고 2의 나머지(1)가 있는 홀수는 더하지 않고 기존 합을 그대로 다음 원소로 넘기고 나머지(0)가 없는 짝수는 합에서 원소에 4를 곱한 값을 더하고 넘깁니다. 2번째 인자의 0은 초기값으로 첫 원소에서는 합의 값을 0으로 받습니다. 초기값을 설정하지 않으면 첫 원소가 합으로 넘어가서 두번째 원소부터 반복을 돕니다. 마지막 원소까지 연산이 끝나면 마지막에 넘긴 값이 반환됩니다. 17:34 async/await을 사용하기 어려울 때 Promise를 깔끔하게 쓰고 싶다면 새로운 promise를 이전 promise의 then 콜백 함수(then의 인자로 들어가는 함수; Promise 작업이 완료되면 실행됨)에서 리턴해주고 이전 promise에서 then을 이어서 해당 콜백에서 새 promise 작업이 완료될 때 실행할 작업을 작성해 주면 됩니다. 이런 식으로요: function displayUser() { let user; fetchUser().then(usr => { user = usr; return fetchProfile(usr); }).then(profile => updateUI(user, profile)) // profile 안에 user값이 포함되어 있다면 let으로 변수를 별도로 등록하는 대신 그것을 씁시다 } async/await가 나오기 이전에는 then 콜백 안에 콜백을 넣지 않고 이렇게 콜백 밖에 then을 이어주는 것이 Promise의 정석이었습니다. 사실 Promise가 나오기 이전에는 then 메소드로 따로 빼지 않고 비동기 함수에서 콜백함수를 바로 인자로 받았는데요, 당시에는 연속되는 비동기 작업의 콜백함수도 그 콜백함수 안에 넣어서 함수가 깊어져 (시각적으로는 들여쓰기가 무한히 들어가) 가독성이 떨어지는 콜백 지옥에서 벗어나기 위해 연속된 콜백을 따로 빼는 Promise가 나온 것이지요. 따라서 저렇게 then then then 들어가는 것은 금물입니다.
와 포인트 정리 감사합니다! 🔥 다른 분들께 도움이 될 것 같아 📌 핀 해 둘께요 :) 16:43에 대해서 중요한 포인트를 찝어 주셨어요! 배열마다 루프를 도는것도 문제지만 함수들마다 각각 다른 배열을 만들기 떄문에 메모리도 많이 차지하죠 지금 예제 같은 경우는 심플하게 하나 안에서 충분히 작성할 수 있기 때문에 하나로 작성하는 것이 좋고, 재사용 가능하거나, 정말 가독성이 중요한 경우에는 저렇게 따로 작성하는것도 좋아요 🤓
엘리가 최고에요♥ 엘리님 강의 듣고 JS 사랑하게 되었어요 추가+) 브라우저101 강의 진짜 꼭 들으세요 여러분... 유료인건 유료인 이유가 있습니다. 유튜브에 올려주신 무료 js 강의 쭈르륵 듣고 브라우저101 강의 구매해서 들으면... 내 안에서 문제를 해결할 힘이 생긴다는게 어떤 기분인지 알게됩니다.
엘리님~ 오랫만에 들렀어요 죄송;;^^ 웹디자인 자격증을 공부하면서 코딩에 관심이 생겼었는데 취업해서 다른 업무로 바쁘다보니 관심이 조금 멀어진 상태에서 이 영상을 다시 보게됐네요. 미래를 위해서라도 코딩을 꼭 배워두고 싶은데 엘리님 영상 모두 시청하면 제가 실전에 나가서도 일할 수 있을까요 ??
역시 간결 명료 명쾌 엘리선생님 bb 처음에 자바스크립트 문법 강의들을때 긴가민가했었는데, 리액트 강의 수강하고 계속 따라쳐보니까 완벽히 이해가 되었어요. 코딩은 머리가 아닌 손으로 익히는게 맞나봅니다. 마지막 퀴즈처럼 자료구조 관련해서도 다뤄주셨으면 좋겠어요. 응원합니다. :)
마지막 퀴즈 짚고 넘어가야할 점이 있습니다. 파이썬의 경우 최근 버전은 dict(objcet)를 이용해서 배열의 중복을 제거해도 아이템들의 순서가 바뀌지 않습니다. 그런데 set는 기본적으로 원소의 순서는 보장되지 않는걸로 알고 있습니다. 자바스크립트도 순서를 유지하는 것을 보장하며 중복이 제거 되는 우아한 코드를 알고 싶네요. 영상에 나온 예제는 순서가 유지된것 같습니다. 개가 몇마리 없어서...
드림코딩 nodejs 강의 듣다가 모르는 자바스크립트 문법이 많이 나와서 찾아왔어요 😵 제가 얼마나 💩 같은 코드를 쓰고 있었는지 깨닫고 가요 ㅎ.ㅎ 한번 더 영상 복습하면서 내것으로 소화하고 강의로 돌아가야겠어요. 🐾 async, await은 엘리쌤 강의를 들으며 무한 반복하다보니 처음엔 1도 이해안갔는데 어느 순간 저도 모르게 구현하고 있을 때 쾌감!!을 느껴요 ㅎㅎㅎ 다른 문법들도 제것으로 소화하겠습니다 (꿀꺽 🤸♀️)
선생님 정말 감사합니다. $("#tbl").on("click",".title #chkAll",function(){ if($(this).is(":checked")){ $("#tbl .chk").prop("checked",true); }else{ $("#tbl .chk").prop("checked",false); } }) 라는 구문을 $("#tbl").on("click",".title #chkAll",function(){ return $(this).is(":checked") ? $("#tbl .chk").prop("checked",true) : $("#tbl .chk").prop("checked",false) }) 로 정말 간단하게 바꿨습니다. 제이쿼리로 먼저 개념을 배우고 있는데, 순수 자바스크립트는 제이쿼리로 기본 CRUD를 구현할 수 있을 때부터 배우면 될까요? 바닐라 JS가 많이 어렵다는 이야기가 많아서 걱정되는데 어떤가요?
감사합니다ㅎㅎ ts 에서 너무 많은 실무적 팁을 얻어갑니다ㅎㅎ 질문이 있는데, 팁4에서 array를 spread operator로 풀어서 push, unshift를 재현하는 로직은 push에 비해 성능적으로 불리하지 않나요? 저도 예전에 고민해봤던 것인데, 기능 다운에 비해 push 에 비해 많은 가독성의 이점이 크게 없는것 같다는 생각이 드네요
엘리쌤~ 혹시 언젠가 제너레이터 함수에 대해서도 다뤄주시면 안될까요..? 지금 하는 프로젝트에서 오만군데에서 *붙은 제너레이터 함수들이 튀어나오는데 코드 이해하기가 난해해요ㅠㅠ promise 나 async 와 같은 비동기 코드 처리하는 코드들과 제너레이터 함수가 작동하는 원리에 차이점이 있을까요? 그리고 일반적인 비동기처리 방식이 아닌 제너레이터 함수를 써야하는 이유가 무엇인지 궁금해요..
항상 좋은 정보 감사드립니다 엘리님! 엘리님은 코딩 입문하실때 Imposter Syndrome 겪으신적 있으신가요? 있었으면 그때 어떻게 뛰어넘었나요? 요즘 미국에서 계속 이력서를 넣고 있는데 계속 reject email 만 오네요 ㅋㅋㅋㅋㅋ 물론 이게 정상이라고 생각합니다만 다른 사람들은 이 시기를 어떻게 넘기는지 궁금하네요!
솔직히 Imposter Syndrome 항상 겪고 있어요 하하 그리고 제 주변에 많은 개발자들이 동일한것 같아요 :) 그게 개발 실력이든, 저마다 자신이 처한 레벨에서 부족한 것들에 대해 특히 그렇게 느끼는것 같아요. 그 부분에 대해서 한번 다음에 영상으로 나눠볼께요 :)
안녕하세요~ 엘리님 7:56 에서 function displayPerson2(person){ const {name, age} = person; displayAvatar(name); displayName(name); displayProfile(name, age); } 이렇게 데이터값을 읽을수가 있다고 하셨는데 displayProfile(name, age); 를 호출해서 출력하는 방법은 뭔가요?
안녕하세요 2년차 병아리 개발자입니다 :) 두번째 팁 ?? 대신 || 를 주로 쓰곤 했는데, 차이점이 궁금해서 바로 F12눌러서 테스트 해보니, ?? 는 빈스트링 ("") 과 0은 true 처리 되고 || 는 빈스트링은 false 처리 되는군요. 라고 써놓고 테스트 후에 영상을 계속 보니 이미 설명해주셨군요 ㅋㅋㅋㅋ 암튼 잘 써먹(?)겠습니다. :) 감사합니다 선배님!
🔥2022년 새로운 자바스크립트 마스터리 (ES6+ 최신문법) 강의가 런칭 되었어요. 유튜브보다 체계적으로 꼼꼼하게 기본&고급 내용 전부 배워보고 싶으시다면 → academy.dream-coding.com/courses/javascript
요즘 올림픽 경기 재밌게 보고 계신가요? 몇년동안 땀흘리며 열심히 준비한 선수들을 응원하면서,
나도 더 열심히 살아야겠다고 자극 받고 있어요 🔥 여러분들도 아자아자!
📒 예제 코드 깃 리파지토리 ⇢ github.com/dream-ellie/learn-javascript
📓 자바스크립트 재생 목록: ua-cam.com/play/PLv2d7VI9OotTVOL4QmPfvJWPJvkmv6h-2.html
이렇게 열심히 살아 오셨는데 이제 소풍 좀 많이 다니심이~
엘리님은 항상 열심히 사셔서 제가 본 받을점이 많은분 입니다! :)
저도 파이팅 해야겠어요! :)
안녕하세요 군더더기 없는 깔끔하고 고퀄리티 영상 잘 보고있습니다. 비전공자 입니다. 미래를 고민하다 보니 개발자로 전향을 고민하게되는데 41세라는 나이가 걸림돌이 되는것 같습니다 41세 입문해서 향후 비전을 생각할 때 어떤 조언을 해주실 수 있으신요?
41세 나이는 숫자에 불과 하다. 원하는것을 꿈꾸고 하나라도 시작하다 보면, 처음엔 내가 생각하지도 못했던 상상하지도 못했던 그곳에 와있게 된다는. 정말 뻔한 말밖에 해드리지 못할 것 같아요. 그런데 저는 그걸 강하게 믿고 사는 사람입니다 :)
우울증이 심해져 무언가 집중할 만한 일을 찾던 중 우연히 엘리님 영상을 보고 낯선 개발 공부를 시작하게 되며 용기를 얻곤했는데, 다시 자신감도 사라지고 모두 포기하고 싶어진 요즘에도 틈틈히 올라오는 엘리님 영상을 보니까 그때 첫 마음도 떠오르고 포기하지 말아야겠다는 생각이 드네요. 항상 이렇게 밝은 에너지로 힘이 되고 도움이 되는 영상들을 올려주셔서 항상 너무너무 감사드립니다! 영원한 제 멘토세요!
구구콘님 파이팅 입니다!!
포기 하지 않으면 다 잘될거에요~!
파이팅입니다
화이팅하세요🔥🔥
힘내세요! 어제보다 더 나은 개발자가 되었다면 충분히 잘하시고 계십니다! 화이팅
파이팅입니다!
9:37 이렇게 하면 item에 detail 값이 들어가고 shirt0 === item이므로 item 객체가 오염되는 것을 원치 않으려면 Object.assign({}, item, detail)으로 써야합니다!
11:40 concat은 지금까지 기존 배열에 다른 배열의 값을 추가하는 것으로 알고 있었는데 알고보니 새 배열을 반환한 것이었군요
12:52 person.job?.title에서 job이 없을때 정확히는 undefined 입니다. 따라서 nullish polishing이 가능한 것이죠.
13:25 backtick키는 물결표와 같은 키를 쓰죠
16:43
하지만 배열 API들도 내부적으로는 각 원소들에 하나씩 연산하기 위해 루프가 사용되는데요, 이 예시도 루프를 3번 돌기 때문에 썩 좋은 코드는 아닙니다.
루프는 최소화시켜서 한번만 돌리는 것이 좋으므로, 꼭 재활용이 필요하지 않다면 배열 API도 하나만 쓰는 것이 좋습니다.
본 예제같은 경우에는 items.reduce((sum, num) => (num % 2)? sum : sum + num * 4, 0)으로 합칠 수 있습니다.
각 원소별로 2의 나머지가 있는지 확인하고 2의 나머지(1)가 있는 홀수는 더하지 않고 기존 합을 그대로 다음 원소로 넘기고 나머지(0)가 없는 짝수는 합에서 원소에 4를 곱한 값을 더하고 넘깁니다. 2번째 인자의 0은 초기값으로 첫 원소에서는 합의 값을 0으로 받습니다. 초기값을 설정하지 않으면 첫 원소가 합으로 넘어가서 두번째 원소부터 반복을 돕니다. 마지막 원소까지 연산이 끝나면 마지막에 넘긴 값이 반환됩니다.
17:34 async/await을 사용하기 어려울 때 Promise를 깔끔하게 쓰고 싶다면 새로운 promise를 이전 promise의 then 콜백 함수(then의 인자로 들어가는 함수; Promise 작업이 완료되면 실행됨)에서 리턴해주고 이전 promise에서 then을 이어서 해당 콜백에서 새 promise 작업이 완료될 때 실행할 작업을 작성해 주면 됩니다. 이런 식으로요:
function displayUser() {
let user;
fetchUser().then(usr => {
user = usr;
return fetchProfile(usr);
}).then(profile => updateUI(user, profile)) // profile 안에 user값이 포함되어 있다면 let으로 변수를 별도로 등록하는 대신 그것을 씁시다
}
async/await가 나오기 이전에는 then 콜백 안에 콜백을 넣지 않고 이렇게 콜백 밖에 then을 이어주는 것이 Promise의 정석이었습니다.
사실 Promise가 나오기 이전에는 then 메소드로 따로 빼지 않고 비동기 함수에서 콜백함수를 바로 인자로 받았는데요, 당시에는 연속되는 비동기 작업의 콜백함수도 그 콜백함수 안에 넣어서 함수가 깊어져 (시각적으로는 들여쓰기가 무한히 들어가) 가독성이 떨어지는 콜백 지옥에서 벗어나기 위해 연속된 콜백을 따로 빼는 Promise가 나온 것이지요. 따라서 저렇게 then then then 들어가는 것은 금물입니다.
와 포인트 정리 감사합니다! 🔥 다른 분들께 도움이 될 것 같아 📌 핀 해 둘께요 :)
16:43에 대해서 중요한 포인트를 찝어 주셨어요! 배열마다 루프를 도는것도 문제지만 함수들마다 각각 다른 배열을 만들기 떄문에 메모리도 많이 차지하죠
지금 예제 같은 경우는 심플하게 하나 안에서 충분히 작성할 수 있기 때문에 하나로 작성하는 것이 좋고,
재사용 가능하거나, 정말 가독성이 중요한 경우에는 저렇게 따로 작성하는것도 좋아요 🤓
이분이 제대로 짚어주셨네..
Single responsibility rule이 성능보다 더 이득인 경우가 많았던거 같아요. 머신러닝 돌리거나 하는것 아니면..ㅎㅎ
현재 현업에서도 자주 쓰던 것도 있고 처음 알게 된 것도 있어서 너무 유익한 강의였어요 ㅎㅎ
오늘도 좋은 강의 해주셔서 감사합니당 🥰
도움이 되셨다니 감사합니다 🥳
진짜 설명 너무 잘하시는거 같아요..
잘보고 있습니다!
좋게 봐주셔서 감사해요 😆
정말 유익한 강의 감사합니다ㅎㅎ 현재 블록체인 스타트업에서 프론트엔드 개발하고 있는데 많이 도움되고 있어요!!
너무 효율적인 팁들이에요.. 잘 정리된 유용한 지식 공유 항상 감사합니다 :-) 🧡
항상 감사합니다 😊
엘리님 덕에 인턴 면접 잘 받습니다. 감사합니다. CSR vs SSR 차이점. 브라우저 storage 설명. CORS 설명. TS 설명 등등 정말 답변을 잘한 것 같습니다. 정말 감사합니다.
오호! 인턴 면접 잘 보셨다니 좋은 소식 기다리고 있을께요 🚀 아, 그리고 평소에 유튜브에서 제가 알려드린 내용들이 나왔다니 너무 좋아요 😆
@@dream-coding 유튭도 그렇고 이번 node.js 강의에서 XSS와 CSRF, CORS가 도움이 정말 많이 되었어요. 그리고 인턴은 합격했답니다~
@@dream-coding 올 때 React, React query, recoil, graphql과 aws amplify를 공부해 오라고 해서 엘리님 리엑트를 듣고 있고요. 빨리 TS 강의도 들으려고 합니다~
자바스크립트 기초 강의 목록을 전부 훑으면서 많은 것들을 얻어갑니다. 정말 감사합니다.
엘리님 !! 프론트엔드 강의 잘 듣고 있습니다 영상 올려주셔서 감사해요🥰
항상 시청해주셔서 감사합니다! 🙆♀️
서호주 퍼스에서 늦은 나이로 일을 시작하게된 초보개발자 입니다. 영상 보면서 도움 많이 받고있습니다. 드림코딩 강의도 전부다 수강해서 공부하고 연습하는게 목표입니다. 올해 안에 전부 마스터해서 좋은 소식 들려드리도록 하겠습니다. 감사합니다
응원하겠습니다!🙆♀️
와 backtick랑 async await 빼고 다 모르고 있었는데 너무 좋은 강의 감사합니다😭 항상 엘리님한테 엄청 많이 배우는 것 같아요
많은걸 알아가신다니 다행이예요 😍
그동안 궁금했었던 정보였는데 한방에 궁금증을 날려버리는 영상이네요 ㅎㅎ 영상들이 너무 재밌어요ㅎ
취업전에도 도움받구 후에도 도움받구 당신이란 사람.. 최고라요!!
ㅇ ㅏ 취업에 도움 되셨다니 정말 다행이예요 😆
지금까지 주로 백엔드 작업만 해서 프론트 지식이 얕았는데, 엘리쌤 강의 듣고 많이 배워갑니다. 감사합니다.
진짜 너무 꿀팁을 깔끔하게 정리해주셔서 감사합니다!
저도 항상 감사합니다 🙆♀️
좋은 영상 감사합니다🙏🏻
영상 내에서 쓰신 마우스 드로우는 어떤 프로그램인지요! 넘 예뻐요ㅎㅎㅎ
ua-cam.com/video/2UaKfAz-eEI/v-deo.html 여기에서 알려드렸어요 :) 맥용 ScreenBrush입니당
이렇게 깔끔한 편집을 하는 개발자 채널은 처음봐요 :)
아 좋은 피드백 정말 감사합니다 🙆♀️
유용한 팁 감사합니다!! :)
엘리님 덕분에 항상 좋은 팁과 지식을 얻어 가네요 ~ :)
도움이 되신다니 다행이예요 🥳
좋은 영상 정말 감사합니다!!! 엘리님 덕분에 놓치고 있던 것들 잘 배워갑니다 :)
도움이 되셨다니 너무 좋아요 🙆♀️
정말 큰 도움이 됩니다 개발 20년차인데.. 정말 제가 얇은 지식으로 밥벌이 하고 있었네요
엘리가 최고에요♥ 엘리님 강의 듣고 JS 사랑하게 되었어요
추가+)
브라우저101 강의 진짜 꼭 들으세요 여러분... 유료인건 유료인 이유가 있습니다. 유튜브에 올려주신 무료 js 강의 쭈르륵 듣고 브라우저101 강의 구매해서 들으면... 내 안에서 문제를 해결할 힘이 생긴다는게 어떤 기분인지 알게됩니다.
ㅇ ㅏ.. 제일 좋은 피드백이예요 🥳
@@dream-coding 엘리쌤 정말 고맙고 너무너무 감사합니다 ㅠ.ㅠ 이미 멋지고 탄탄한 강의 만들어주신거에서 그치지 않고 아렇게 꾸준히 너무나도 유익하고 탄탄한 영상들 만들어주셔서 정말정말 감사해요
너무 이해하기 쉬운 설명입니다
감사합니다
엘하요♡ 엘리님 열정과 정성이 그저 존경스러울 따름입니다👍 건강하셔서 오래오래 볼 수 있기를😄
항상 응원감사합니다 ❤️
자바스크립트공부하는데 하나하나이해안갔던것들, 그냥그렇구나넘겼던것들이 엘리님영상보면거 아 !!! 이거였구나!!! 할수있어서 자바스크립트가 더 재밌어졌어요 ㅜㅜ 넘감사해요 💕💕
아 그리고 깃허브 브랜치 현업에서 어떻게 쓰시는지도 너무 궁금해요 브랜치건드릴때마다 너무떨려요ㅠ
언제나 엘리님 영상 넘 유용하게 보고있어용🤭👍🏻👍🏻✨✨
항상 감사합니다😊
자바스크립트 강의를 다 듣고도 이해가 잘 안되고 못 사용하던 것들이 있었는데
이 영상을 보고 다시 정리가 됩니다~! 잘 배워갑니다 감사합니다 😁
도움이 되셨다니 다행이예요 😍
엘리님~ 오랫만에 들렀어요 죄송;;^^
웹디자인 자격증을 공부하면서 코딩에 관심이 생겼었는데 취업해서 다른 업무로 바쁘다보니 관심이 조금 멀어진 상태에서 이 영상을 다시 보게됐네요.
미래를 위해서라도 코딩을 꼭 배워두고 싶은데 엘리님 영상 모두 시청하면 제가 실전에 나가서도 일할 수 있을까요 ??
엘리님이 만들어주신 동영상을 꾸준히 봐서 그런지 말씀해주신 거의 대부분 팁을 현업에서 사용하고 있네요 :)
뭔가 잘하고 있다는 느낌을 받아서 정말 기분이 좋네요^^
오늘도 좋은 컨텐츠 감사합니다! 👍
오웃! 대부분을 이미 현업에서 실전 프로젝트에서 사용하신다니 최고예요 👍
아 진짜 나도 개발자인데...엘리님 강의보면 현타오네 ㅋㅋ
이번에도 깔끔하게 정리해주셔서 감사합니다.
신입개발자를 뽑게되어, 보라고 링크 주었네요!
오웃 공유해 주셔서 감사합니다 😍
엘리님은 정말 설명 천재입니다~! 💜💘💜💘
이렇게 쫙~ 설명해주시니 19분이 1분처럼 후다닥 지나가네요. 🙈
앗! 19분이 1분처럼 느껴지셨다니 정말 다행이예요 😍
2년전 영상이라 배울 내용이 없을거라고 생각했는데 오산이었네요.
당장에 고치고싶은 코드들이 많이 떠올라서 설레는 반면에
제 배움이 몇년이나 뒤쳐져있다고 생각하니 아직도 갈 길이 머네요.
잘 봤습니다.
유익한 영상 오늘도 잘 봤어요!!😍 낼부터 바로 현업에 적용해 볼거에요!
감사합니다🙂
엘리님 백엔드 개발자인데도
디자인이 부족한 것같아서 html css 강의 듣습니다 ㅋㅋ
지금 프론트엔드, 앱 클라이언트쪽 배워두시면 나중에 더 좋은 서비스 API 만드시는데도 분명히 도움이 되실거예요 🙌
알기 쉽게 잘 설명해주셔서 감사해요😊
좋은 영상 감사드려요!
취준하면서 항상 코드보면서 감 잃지않으려고 해요!
응원하겠습니다!🙌
요즘 매일 고민하는 클린코드인데 너무좋은강의에요ㅜㅜ
도움이 되셨다니 정말 좋아요 👍
다 아는 내용들이구만!
항상 깔끔한 정리 감사합니다!
다 아신다니 멋져요 😍
나쁜예 좋은예를 함께 보여주셔서 이해가 더 잘되는 것 같아요!! 감사합니다~~
열심히 준비한 영상 이렇게 잘 봐주셔서 감사해요😍
너무 좋은 영상입니다!!
실제 현업에서 너무나 자주 사용 되는 것들인데 이번기회에 한번 더 상기시키고 갑니다!
항상 유익한 영상 감사합니다.
상기하실 수 있는 시간이 되었다니 정말 다행이예요 🙆♀️
리펙토링 하던 중에 이걸 보다니 ㅋㅋㅋ 정말 유용합니다. 감사해요...
봐주셔서 감사합니다! 😍
알려주신 스크립트문법들은 브라우져버전 및 자바스크립트 버전상관없이 사용이가능한가요?
사수 없으면 배우기 쉽지 않은 강의네요. 리펙토링 책을 보려고 해도 시간이 없어서 못 보는중..ㅠㅠ 늘 감사합니다.
도움이 되셨다니 너무 좋아요 😍
여윽시 믿고보는 엘리쌤👍 항상 감사합니다:)
락다운시간.. 빡공으로 이겨내보겠습니다^^
락다운 힘든 시간, 우리 열정으로 불태워 봐요 🔥
헉 대박사건…
nullish-coalescing을 잘못 기억하고 있었네요..😭!!! (세상에!!)
엘리님 강의 들으면 머리가 틔이고 똑똑해지는 기분이 들고 너무 좋습니다.. 이번 편은 정리하면서 다시 들어야겠어요 너무 소중해요..❤️ 감사합니다!!
하하 감사합니다~ 오랜만에 오셔서 몇가지 영상을 다 보시고 코멘트도 달아 주셨네요 😍
정말 좋은 팁이네요ㅎㅎ 코드를 가독성 있고 효율적으로 짜는데 정말 도움이 많이 됐습니다!
까먹을 때마다 다시 봐야겠습니다ㅋㅋ
도움이 되셨다니 너무 좋아요 😍
개발 공부를 시작한지 얼마 안되었지만 항상 엘리님 영상 유익하게 보고 있습니다!! 엄청난 꿀팁이네요!! 감사해요 ^ㅁ^
강의영상 너무 좋아요 늘 감사합니다💛💛
도움이 되셨다니 너무 좋아요 😍
실제 프론트엔드 업무 중에 자주 쓰는 신택스들인데 제가 이미 알고있다는게 많이 성장했다고 느끼게 해주셨습니다 감사합니다
다 알고 계시는 분들이 있어서 저는 정말 뿌듯합니다 🚀
영상 구간 나누어져 있는거 너무편하네요!! 영상 잘보고 있어요~
그쵸?ㅋㅋ 작년에 유튜브가 추가한 기능중 제일 잘한것 같아요 ✨
갓갓갓갓엘리님 ㅠㅠㅠㅠ 엘리님 덕분에 진짜 쏙쏙 이해하고 갑니다💙
감사합니다 😍
마지막 필터 말고 셋 생각도 못했네여 공부해야겠다ㅠㅠ
왕.. 코드가 진짜 간단해지네요! 프로는 이런거군요...😂
역시 간결 명료 명쾌 엘리선생님 bb 처음에 자바스크립트 문법 강의들을때 긴가민가했었는데, 리액트 강의 수강하고 계속 따라쳐보니까 완벽히 이해가 되었어요. 코딩은 머리가 아닌 손으로 익히는게 맞나봅니다. 마지막 퀴즈처럼 자료구조 관련해서도 다뤄주셨으면 좋겠어요. 응원합니다. :)
오! 리액트 수강하시면서 자바스크립트도 단단해 지신다니 정말 다행이예요 🙌
좋은 영상 항상 감사합니다!!
Java 백엔드에서 프론트엔드에 관심이가 자바스크립트 영상을 엘리님 영상으로 많은 꿀팁들을 얻어가고있습니다~ 항상 질좋은 영상 올려주셔서 감사합니다~!! 댓글달고싶었어요 ㅎㅎ
ㅇ ㅏ.. 감사해요 😍 이런 댓글 정말 힘이 됩니다!
역시나 도움이 많이 됐습니다. 늘 감사합니다!
저도 늘 감사합니다 🤎
진짜 요즘 엘리님 덕분에 자바스크립트 열심히 하고있어요 ㅠㅠ 뭔가 엄청 재미없는 언어라고 생각했는데 하다보니까 자바보다 더 재밌어지는거 같기도하고! 감사해요!! 엘리님 영상 다 보고 101도 꼭 들을꺼에요!! 진짜 유익한 영상 올려주셔서 너무너무 감사합니다! :)
저도 처음에는 이게 뭐야! 이랬는데 자바보다 더 재밌는것 같아요 🚀
마지막 퀴즈 짚고 넘어가야할 점이 있습니다. 파이썬의 경우 최근 버전은 dict(objcet)를 이용해서 배열의 중복을 제거해도 아이템들의 순서가 바뀌지 않습니다. 그런데 set는 기본적으로 원소의 순서는 보장되지 않는걸로 알고 있습니다. 자바스크립트도 순서를 유지하는 것을 보장하며 중복이 제거 되는 우아한 코드를 알고 싶네요. 영상에 나온 예제는 순서가 유지된것 같습니다. 개가 몇마리 없어서...
엘리님!!
저에게 너무나도 어려운 자바스크립트 공부를 놓치지않게끔 끊임없이 유익한 영상 올려주셔서 너무 감사해요!! 끝까지 포기 하지않고 열심히 따라가 보겠습니다!(๑˃̵ᴗ˂̵)و
손상님 항상 봐주시고 코멘트 남겨 주셔서 감사해요 🙆♀️
const result = array.filter(
(value, index, array) => index === array.lastIndexOf(value)
);
한참을 고민했는데 Set한방에 해결되네요. 허탈합니다 ㅋㅋ
좋은 강의 감사합니다.
근데 list에서 push대신 배열로 기존의 과일 리스트에 사과 및 포도를 추가하는건 강의를 위해 하신건가요?
만약 저대로만 한다면 새로 메모리 할당에 복사가 일어나면서 성능에 조금 안좋을거 같아서요
쌤 구독자 10만 축하드려요 🎉
축하해 주셔서 감사합니다 🙌
감탄만 나오네요..
감사합니다 🔥
최고! 고맙습니다.
저도 항상 감사합니다 🙆♀️
좋은 강의 너무 감사합니다.
또 복습하게 되네요! 감사합니다.
함께 해주셔서 감사합니다 😆
실무에서 너무 잘 쓰고 있습니다 감사해요
어떻게 마우스 커서로 화면에 그리시는건가요? 맥에서 무슨 프로그램을 써야 하는지 궁금합니다! 윈도우에서는 Bandicam 썻었는데
드림코딩 nodejs 강의 듣다가 모르는 자바스크립트 문법이 많이 나와서 찾아왔어요 😵 제가 얼마나 💩 같은 코드를 쓰고 있었는지 깨닫고 가요 ㅎ.ㅎ 한번 더 영상 복습하면서 내것으로 소화하고 강의로 돌아가야겠어요. 🐾
async, await은 엘리쌤 강의를 들으며 무한 반복하다보니 처음엔 1도 이해안갔는데 어느 순간 저도 모르게 구현하고 있을 때 쾌감!!을 느껴요 ㅎㅎㅎ 다른 문법들도 제것으로 소화하겠습니다 (꿀꺽 🤸♀️)
돌아돌아 역시 코딩젤리..
안녕하새요 엘리님 항상양질의강의감사합니다 보실지모르겠지만 해외취업에 대해고민이라 엘리님의 해외취업시하신 resume작성팁이랑 테크니컬관련 영어인터뷰준비등 어떻게하신지궁금해요 :)
이력서 작성팁! 여기 채널에 있어요 :)
자바스크립트 중급편두 드림코딩아카데미에 하나 더 개설해주세요ㅠㅠㅠㅠㅠㅠㅠㅠㅠ
꺄아~ 중급편 (까다로운 내용) 정리 해서 유튜브에 한번씩 올렬볼께요 🔥
@@dream-coding 너무 감사합니다ㅠㅠㅠㅜㅜ💗
액기스만 모아 모아.. 좋아요를 더 누르고 싶은데.. 방법이 없네요~ 감사합니다^^
선생님 정말 감사합니다.
$("#tbl").on("click",".title #chkAll",function(){
if($(this).is(":checked")){
$("#tbl .chk").prop("checked",true);
}else{
$("#tbl .chk").prop("checked",false);
}
})
라는 구문을
$("#tbl").on("click",".title #chkAll",function(){
return $(this).is(":checked") ?
$("#tbl .chk").prop("checked",true) : $("#tbl .chk").prop("checked",false)
})
로 정말 간단하게 바꿨습니다.
제이쿼리로 먼저 개념을 배우고 있는데, 순수 자바스크립트는 제이쿼리로 기본 CRUD를 구현할 수 있을 때부터 배우면 될까요? 바닐라 JS가 많이 어렵다는 이야기가 많아서 걱정되는데 어떤가요?
꿀팁입니다!! 감사합니다
감사합니다ㅎㅎ ts 에서 너무 많은 실무적 팁을 얻어갑니다ㅎㅎ 질문이 있는데, 팁4에서 array를 spread operator로 풀어서 push, unshift를 재현하는 로직은 push에 비해 성능적으로 불리하지 않나요? 저도 예전에 고민해봤던 것인데, 기능 다운에 비해 push 에 비해 많은 가독성의 이점이 크게 없는것 같다는 생각이 드네요
www.measurethat.net/Benchmarks/Show/4223/0/array-concat-vs-spread-operator-vs-push
저도 궁금해서 찾아 봤는데 테스트 한 번 해보셔요
테스트 링크 감사해요 🙆♀️
오 이런게 있네요 spread가 제일 빠르군요. 자바 기준으로 생각했는데 다른가 보네요. 감사합니다ㅎㅎ
안녕하세요 엘리님.. 혹시 vscode 어떤 테마를 쓰시는지 궁금하네요
ua-cam.com/video/bS9yTI2fC0w/v-deo.html 여기서 알려드린것 같아요 :)
안녕하세요 현개발로 갑자기 유튭추천 영상추천이 와서 처음 봤는데 너무좋습니다 덕분에 공부잘하고 갑니다~
구독 좋아요 는 기본
하하 감사합니다 🙆♀️
3항연산자는 현업에서 협업시에 아주아주 매우매우 주의 하라던데 아닌가 보군요ㅎㅎ
엘리쌤~ 혹시 언젠가 제너레이터 함수에 대해서도 다뤄주시면 안될까요..? 지금 하는 프로젝트에서 오만군데에서 *붙은 제너레이터 함수들이 튀어나오는데 코드 이해하기가 난해해요ㅠㅠ promise 나 async 와 같은 비동기 코드 처리하는 코드들과 제너레이터 함수가 작동하는 원리에 차이점이 있을까요? 그리고 일반적인 비동기처리 방식이 아닌 제너레이터 함수를 써야하는 이유가 무엇인지 궁금해요..
제너레이터 만들고 싶은 영상 목록에 추가해둘께요 🙌
아름다운 강의 ^^
안녕하세요. 바벨을 사용못하고 순수 자바스크립트를 사용하는 프로젝트가 있는데요.
저런 최신문법을 사용하기위해선 자바스크립트 최신 min 파일을 다운받아서 사용하면 되는걸까요??
마지막 퀴즈에서 소름 돋았어요!ㅋㅋㅋㅋ 재밌어요👍
코딩 퀴즈에 소름이 돋는다는 그대는 진정한 찐 개발자 🙆♀️
환상적인 코딩입니다.
이런 꿀팁들을 무료로 볼 수 있게 해주셔서 너무나도 감사할 따름입니다ㅜㅜ
엘리님 영상은 뭐든 좋아요부터 누르고 시작합니다
우아, 고마워요 😊
유용한 지식 항상 감사합니다~^^
저도 항상 감사합니다 🙆♀️
07:48 저런식으로 작성하는 것을 한국어로 비구조화 할당이라고 합니다. 배열, 객체에서 사용가능합니다.
타임라인으로 한국어 정리 해주실부운~~? 🙌 가끔 한국어 용어가 더 어려운것 같아요 하핫;
@@dream-coding 했읍니다 ^^7
오늘도 잘 보겠습니다:)
항상 감사해요 🙆♀️✨
항상 좋은 정보 감사드립니다 엘리님! 엘리님은 코딩 입문하실때 Imposter Syndrome 겪으신적 있으신가요? 있었으면 그때 어떻게 뛰어넘었나요? 요즘 미국에서 계속 이력서를 넣고 있는데 계속 reject email 만 오네요 ㅋㅋㅋㅋㅋ 물론 이게 정상이라고 생각합니다만 다른 사람들은 이 시기를 어떻게 넘기는지 궁금하네요!
솔직히 Imposter Syndrome 항상 겪고 있어요 하하 그리고 제 주변에 많은 개발자들이 동일한것 같아요 :)
그게 개발 실력이든, 저마다 자신이 처한 레벨에서 부족한 것들에 대해 특히 그렇게 느끼는것 같아요.
그 부분에 대해서 한번 다음에 영상으로 나눠볼께요 :)
안녕하세요~ 엘리님 7:56 에서
function displayPerson2(person){
const {name, age} = person;
displayAvatar(name);
displayName(name);
displayProfile(name, age);
}
이렇게 데이터값을 읽을수가 있다고 하셨는데 displayProfile(name, age); 를 호출해서 출력하는 방법은 뭔가요?
안녕하세요 2년차 병아리 개발자입니다 :)
두번째 팁 ?? 대신 || 를 주로 쓰곤 했는데,
차이점이 궁금해서 바로 F12눌러서 테스트 해보니, ?? 는 빈스트링 ("") 과 0은 true 처리 되고 || 는 빈스트링은 false 처리 되는군요.
라고 써놓고 테스트 후에 영상을 계속 보니 이미 설명해주셨군요 ㅋㅋㅋㅋ
암튼 잘 써먹(?)겠습니다. :) 감사합니다 선배님!
하하하 ㅋㅋㅋ 네네 사실 원하는건 && 동작인데 || 차이점을 몰라서 항상 || 로 쓰다가
생각치도 못한곳에서 사용자 🐛 버그가 발생하는 경우가 있어요. || 연산자는 항상 조심해서 써야 한답니다.
이 부분을 강조 했어야 하는데 영상에서 강조하지 못해서 아차 했네요 🤣
대한민국 미래의 개발자 수준을 올려주실 분입니다.
엘리님 ♡♡♡♡♡♡ 항상 감사드려요!!!
감사합니다 🚀
뱌암 오늘도 잘배우고갑니다요
뱌암! 항상 감사합니다 😍
마지막 퀴즈 Set ㅋ 멋지네요
9:37 이건 댓글에서도 써져있지만 실수하신것 같네요.. 빈 오브젝트를 안넘겨주면 item에 detail에 있는 key value를 assign하는거라서 item 객체가 변경되게 됩니다
넘나 도움 많이 되네요ㅎㅎ
고맙습니다~!!^-^/
항상 감사합니다 🙆♀️