자바스크립트 13. 비동기의 꽃 JavaScript async 와 await 그리고 유용한 Promise APIs | 프론트엔드 개발자 입문편 (JavaScript ES6)

[@dream-coding]

🔥2022년 새로운 자바스크립트 마스터리 (ES6+ 최신문법) 강의가 런칭 되었어요. 유튜브보다 체계적으로 꼼꼼하게 기본&고급 내용 전부 배워보고 싶으시다면 → academy.dream-coding.com/courses/javascript 📒 강의 노트 & 자주 나오는 질문: github.com/dream-ellie/learn-javascript 안녕하세요 드림코더님! 드디어 비동기 마지막편이예요 🎉 지금 회사에서 맡고 있는 프로젝트가 갑자기 급 최상위 우선순위로 올라가서 정신없는 한주를 보내고 있어요. 그리고 프론트엔드라면 꼭 알아야 하는 브라우저 + 미니프로젝트 3개 강의(귀여운 게임 하나 포함)를 준비 하고 있어요 ❤️ (아 진짜 내용 제가 봐도 너무 좋은거 같아욬ㅋㅋㅋ) 좋은 강의와 함께 그리고 미니게임편과 함께 또 찾아뵐께요 🙌 꼭 복습하고 있기예요 👍

[@TheAc3112]

기대하겠습니다~!

[@woorimit]

맞아요 너무 좋아요 ㅜㅜ 감사합니다😍😍

[@이윤아-p8j]

저 부트캠프 준비하면서 학원다니고 있는데 엘리님 강의 정말 도움 많이 되요 ㅜㅜ 좋은 강의 감사합니다!!

[@qlgks1]

이것만큼 promise, async, await 핵심만 짚는 강의는 못봤습니다.. 선배님 개쩔어요

[@dream-coding]

이런 좋은 피드백 감사해요 ❤️

[@postgres2981]

독학러인데 17분의 영상을 보며 더 깊게 공부하고 싶은 마음에 이것 저것 추가적으로 공부하다 보면 한 영상 당 4~5시간 정도 소모하는 것 같습니다. 그 중 한가지 예시를 들자면 영상에서 강의를 위해 적으신 코드 중에 delay라는 함수는 async를 쓰지 않고 new Promise를 사용했기에 초보자 입장에서 "async는 promise위에 덧 씌워진 기능이니 항상 new Promise를 써야 하는건가?"라는 의문점이 생겼습니다. 그래서 크롬에서 더 많은 자료를 찾아보게 되더군요. 양질의 영상 감사합니다.

[@도파민팡팡이]

게임기다리면서 복습을 하고 있겠습니다 이해는 가나 직접 짜보라면 무진장 어렵네요 ㅎㅎ 감사합니다

[@FuTuReiSHiSToRy01]

1-13 자바스크립트 정주행 끝 : 배운 것 요약 : - 역사, 환경설정 - script 속성에 defer 쓰세요, 바닐라 js시 use strict 쓰세요 - 데이터 타입, 사용시 유의점 - 연산자 사용법 - Function, ArrowFunction 및 파라미터 - Class 와 Object : 일반적인 OOP 프로그래밍에서의 내용을 js로 실습 ( 생성자,변수,메소드, private,public, getter,setter, 다형성, 상속 등 엄청난 분량을 짧은 시간내에 소화, 아마 엘리님의 쉬운 설명과 비유) - object : 객체 선언법, 객체 데이터 접근법, 생성자, for in, for of, 객체 복사시 주의 - Array,ArrayAPI : API 사용 예제(선언,Index,looping over the array, 추가,삭제,합침,검색)와 API 보는법(cmd + click) - Awesome 10 ArrayAPIs : 다양한 연습문제 - JSON : js 객체를 json형식으로 내보내기(stringfy), json을 js 객체로 불러오기(parse) - 콜백지옥 : 동기와 비동기의 개념, 콜백함수 설명, 콜백 지옥을 쓰면 안되는 이유 : 가독성 어렵다. 복잡해지면 이해 불가 - Promise : 콜백지옥을 벗어나기 위한 노력 ,resolve와 reject를 활용 - async.await : async,await, error처리, 병렬화 처리, 유용한 promise API 동시에 본인은 포트폴리오, 브라우저101 , 리액트 강의를 결제하고 엘리님도, 공부하시는 분들도 화이팅!

[@dream-coding]

이런 퐈이팅 넘치는 메시지 감사해요 :) 와 강의를 총정리 (압축용ㅋㅋㅋ) 해주셨네요 😍

[@kyle_ytju]

저는 C# 개발자인데 회사에서 리액트 프로젝트를 같이 진행하게 되어 자바스크립트에 대한 기본을 이해하는데 정말 많은 도움이 되었습니다. 진심으로 감사드립니다!!

[@tiejunwen2171]

핵심을 콕 집어서 내용을 선택한데다 군더더기 없이 똑 부러지는 표달로 뇌속에 쏙쏙 넣어주네요 . 대한민국강사중 중요한 인물이 될것입니다. 동영상배경음악도 진짜 마음에 듭니다 . 감사합니다. 화이팅 !!!

[@dream-coding]

하하 칭찬을 너무 정성스럽게 작성해 주셔서 감사합니다 ❤️

[@KO-nz6pj]

처음에는 영상을 봐도 잘 이해가 안돼서 괴로웠는데 포기하지 않고 영상을 몇번씩 보고 코드도 따라 쓰면서 공부하니까 이제 100% 이해가 되네요 😊 엘리님 덕분에 이전에는 잘 이해가 안됐던 함수나 promise도 이제는 다 이해할 수 있어요. 정말 감사합니다!! 지금 엘리님의 타입스크립트 강의를 듣고 있는데 객체지향 부분이 너무너무 어려워서 정말 머리가 아프지만 포기하지 않으면 언젠가 이해할 수 있는 날이 오겠죠..? 😥

[@다혜안-e1f]

11편부터 13편까지 달렸네요... ! 시리즈로 엮여있으니 흐름 끊기면 안될 것 같아 끊김 없이 들었습니다. 강의 감사해요!

[@ソンチャンド]

제가 promise랑 async, await를 엘리님 영상을 통해서 처음 접하고 그당시에는 단순히 시청개념으로 듣고 넘어갔는데 실무에서 실제로 사용하기 위해서 관련 지식 다방면으로 찾아보고 엘리님 영상을 거진 20번넘게 돌려본거 같은데 이제야 어느정도 이해가 되네요! 처음이라 다들 이해가 안되고 어렵더라도 모두들 포기하지 마시고 화이팅입니다!!!

[@김찬중-w9t]

목소리... 내용... 퀄리티... 역시 꾸준하시니깐 구독자도 급작스럽게 엄청 늘으셨네요!! 늘 엘리님을 보면서 자극받습니다. 감사합니다.

[@dream-coding]

꾸준함이 키인거 같아요 :) 어떤것을 하던지요. 응원할께요 ❤️

[@chaneo-qw2uv]

영포자라서 array API 선언 읽는 부분에서 막혀 있다가 영상과 같이 코딩하면서 다시 정주행했어요! 같이 따라 코딩하니까 훨씬 공부가 잘되는 것 같아요~ 노트도 영어로 적고 용어도 영어로 알려주셔서 공식 문서 볼때 도움이 많이 될 것 같아요ㅠㅠ 시간이 걸려도 공식 문서 읽는 연습을 열심히 하려고요! 그리고 나선임 등장할 때마다 배경음악 넘 웃겨요ㅋㅋㅋㅋ 엘리님 센스 정말 최고임니당👍 📝 Homework 📝 async function loginResult() { try { const userId = await userStorage.loginUser(id, password); const userInfo = await userStorage.getRoles(userId); alert(`Hello ${userInfo.name}, you have a ${userInfo.role} role`); } catch (error) { console.log(error); } } loginResult(); ❓ Question ❓ async 쓸 때 try나 catch에서 return 값을 꼭 정해줘야 하나요? return 값 안 정해줘도 원하는대로 동작하는데 엘리님이 영상에서 async 쓰실 때 대체로 retrun 값을 정해주시길래 궁금해져서 여쭤봅니다!

[@dream-coding]

값을 리턴하지 않아도 되면 구지 리턴하지 않으셔도 되요 :) 만약 로그인한 결과값을 전달하고 싶다면 그때 리턴을 쓰시면 되겠죠? :) 참, 숙제는 정말 잘하셨어요 🙌

[@youngho2664]

감사합니다. 오늘도 열심히 공부했네요 일, 운동하고 공부하면 12시가 넘어가지만 엘리님 강의는 시간을 투자할 만큼 값지네요 좋은 영상 정말 감사합니다!!

[@sunnykim8213]

본. 강의 중에 설명이 간결하면서도 제일 이해가 잘됐어요!! 정말 우연히 발견한 비디오인데 제 인생 첨으로 유튜브 댓글까지 남기고 싶을 정도에요!! 감사합니다 🙏

[@davidkim5641]

출첵 합니다! 몇일동안 1편부터 정주행합니다. 감사합니다!

[@dream-coding]

와 금방 보셨네요 ❤️

[@Chobyongki]

callback 어렵다고 생각했는데,, 넘쉽게 이해가 되고, promise는 알지도 못했는데 알게 되고, 비동기는 원래 어렵다고 해서 알려들지도 않았는데 오우.. 이 3가지가 연관이 되어 있는 사실을 알게 되고 한번에 꿰뚫어 설명해 버리니 시원합니다. 꼬치를 만들어 한큐에 처리 하는 느낌 감사합니다.

[@분홍이맘]

강의를 최소 3번씩은 듣게 되는데,,, 참 들을때마다 새롭네요~ 강의 감사합니다. 숙제는 지금부터 고민해봐야겠어요ㅋㅋㅋ

[@707mars3]

주말 잘 쉬고, 오늘도 출첵 해봅니다~!

[@gam.ja.3086]

오늘 강의도 감사합니다! ㅎㅎ async function getUserInfo() { try { const userId = await userStorage.loginUser(id, password); const userInfo = await userStorage.getRoles(userId); return userInfo; } catch (error) { return error; } } getUserInfo().then(console.log);

[@dream-coding]

와 깔끔하게 정리 하면서 들으시네요 🙌 getUerInfo에서 catch에서 따로 error를 잡아서 핸들링 하지 않는다면 그냥 try-catch 없이 작성하셔도 좋을 것 같아요. 그럼 getUserInfo().then(console.log).catch() // 여기서 에러 처리

[@gilbert5081]

항상 헷갈렸는데 비동기 강의 3개로 확실히 이해했습니다. 좋은 영상 만들어 주셔서 감사합니다.

[@TV-rk4gd]

샘 토다는건 아니지만 샘코드는 최대한 간결하고 아름답게 연출하려고 하는게 보이지만 프로젝트의 특성과 추후 확장성을 고려했을때 한줄코드보다는 {}안에서 리턴받는 형식의 코드가 기본이 되면 줄수만 늘어날뿐 가독성도 좋고 확장성도 유연하게 대처가능합니다. 코드는 아름다움이 최우선은 아니고 가장 우선은 확장성과 재사용 가능성이 포커스인거 같습니다 샘 너무 강의 멋집니다 사랑합니다

[@donow5924]

엘리님 덕에 promise, async, await 개념이 잡혔어요! 감사합니다 ㅎㅎ 📝숙제 😆 👉 const userStorage = new UserStorage(); const id = prompt("enter your id"); const password = prompt("enter your password"); async function checkUser() { try { const userId = await userStorage.loginUser(id, password); const user = await userStorage.getRoles(userId); alert(`Hello ${user.name}, you have a ${user.role}`); } catch (error) { console.log(error); } } checkUser(); 👈😁 숙제

[@dream-coding]

붐 :) 숙제 확인 완료! 너무 잘하셨어요 ❤️

[@donow5924]

드림코딩 by 엘리 확인 감사드립니당 💕

[@gorae3842]

강의를 보면서 같이 따라가다 보면 알겠다 싶다가도, 필기한 내용을 보면 이렇게 낯설 수가 없네요 ㅋㅋ 계속 복습해보겠습니다. 감사해요!

[@neo6357]

목소리가 좋아서 강의가 쏙쏙 귀에 들어옵니다^^

[@유부유부-e5o]

callback 부터 다시 듣고 와야겠네요.. callback과 promise 이해 했다고 생각했는데 손으로 코드가 안나오네 ㅎㅎㅎㅎㅎ 다시올께요~뿅!

[@dlgudwn00]

101듣기전에 다 듣고 101 시작합니다 좋은강의 감사드려요 자바스크립트의 새로운 모습을 보았습니다.

[@Grujam92]

분명 몇달전에 이 영상의 예제까지 다 따라했는데도 비동기에 대해 정확히 이해가 안갔었는데, 아주 복잡한 비동기 작업으로 몇주간 고생하다 다시 이 영상을 보니 두루뭉실하게 이해했던 완벽히 정리가되네요. 정말 감사합니다.

[@dream-coding]

이제 클릭! 하는 순간이 오신건가요 Code your Dream ✨

[@noelnr9173]

dont forget your code is dream! 감사합니다 이제 리액트 들으러가야겟네요

[@dream-coding]

와, 자바스크립트 완료! 🤩

[@mijilee7911]

너무 재미있으면서도, JS 문법을 들으며 내내 어렵고 이 길이 내게 맞나 고민이 많았는데, 이 마지막에 race가 나오는 순간 너무 재밌는 거 아냐라고 생각했어요. 앞으로도 고민 그만하고, 엘리님 수업 들으며 계속 어떻게 하면 더 나은 코드 만드나 그 고민만 할래요~ 감사해요~

[@hyunsikkim5976]

와 진짜 코딩중 막힐때 마다 구글링 전 혹시나 하고 엘리님 강의 켜면 언제나 답이 있어요 ㅋㅋㅋㅋ 신기하고 감사합니다 특히 현업에서 유용하게 쓰이는 팁들이 정말 도움 됩니다.

[@helloWorld-p5r]

엘리 ㅠㅠㅠ 드디어 여기 까지 왔습니다! 저는 python만 사용해보다가 front에 관심이 생겨서 이렇게 배우고 있는데요. 처음에는 정말 사전 지식이 없어서 힘들었어요. 어떤 강의는 이해가 안되어서 8번도 넘게 본적도 있고, JS 관련 서적들도 사서 읽었어요 그런데 어느 순간 갑자기 퍼즐이 맞추어지듯이 promise도 이해가 되었고 여기까지 오게 되었네요! 강의 넘 감사합니다 이해하면서 다시 엘리의 강의 보니깐, 와... 참 깔끔하게 잘 설명해주셨다! 라고 느꼈습니다! 그리고 함수 포기하지마 강의도 보면서, 저같은 사람들의 멱살을 잡고 같이 가주셔서 고마웠습니당ㅋㅋ ㅎㅎ

[@전형준-h9d]

비동기 처리 부분 출석합니다. 함께 콜백지옥을 만들고, Promise와 async와 await을 배운다음 이를 이용해서 콜백지옥을 간단하게 만드는 방법을 배우니까 쏙쏙 들어오네요. 그리고 유용한 Promise API들도 배우게 되어서 도움이 많이 될 것 같아요. 이제 다음 영상이 올라올 때까지 복습하면서 기다려야겠어요. 항상 좋은 강의 감사드립니다!

[@dream-coding]

전 이렇게 좋은 점 나열해서 피드백 주시는 분들이 제일 좋아요 ❤️ 감사해요 🥰

[@하세요안녕-m4t]

영상 하나 보고 바로 구독눌렀습니다. 영어공부도 같이 되는 듯한 이 신선함이란...감사합니다

[@allenkim4776]

엘리선생님 강의 감사히 잘 들었습니다. 새해에도 건강하시고 복 많이 받으세요~

[@professeo]

오늘로 자바스크립트 13강까지 다 들었네요 :D 이해하기 쉽게 잘 설명해주시구 항상 하나라두 더 알려주시려고 해주셔서 정말 감사합니다! 받는 그릇이 아직 작아서 다 담지는 못했지만 코딩공부 포기하지않고 끝까지 할 수 있게 도와주셔서 감사해요 🥰🙌

[@dream-coding]

저 장담하건데, 그 그릇이 매일 매일 조금씩 커질꺼에요 :)

[@professeo]

@@dream-coding 감사합니다 :^) 🙌

[@박박박-p5t1w]

fetch로 데이터 가져오면서 async await에 대해 궁금한점이 생겨서 듣다가 11~13강 다 들었네요 이제 이해가 되는것 같습니다ㅜㅜ 👍

[@주먹밥쿵야-j2l]

자바스크립트 입문 영상(1~13) 완강했습니다..! 완전 처음 배우는 언어지만 조금씩 눈에 익히고 있어요, 앞으로 차근차근 알아가보겠습니다. 좋은 강의 감사합니다 ^^

[@jisupark5714]

1~13 수강완료! 몇번씩 다시보기도 하고 게으름도 좀 하다 보니 이제 강의 완료했네요. 추가 강의 4개 듣고(전애 봤지만 한번더 봐야할 것 같아요 ) 드림코딩 아카데미로 넘어갑니다. ^^

[@sputnik11]

프론트엔드 작업하게 되면 개념없이 늘 눈치껏(?) 해왔는데 이런 기초개념 교육 너무 좋네요. 101 강의도 수강신청했습니다.

[@dream-coding]

감사합니다 🙌 우리 강의에서도 만나요

[@범인부부]

열심히 듣고 있습니다! 코딩의 신이 될게요~!

[@Dodikwjssopfp28]

출석했습니다! 마지막 두 편은 정말.... 어려웠네요 ㅠㅠ 복습하고 엘리님 유료 강의 들으러 출발합니다!

[@한도윤-f7s]

안녕하세요 오늘도 좋은 강의 감사드립니다!! 오늘 내주신 숙제 밑에 코멘트 참고해서 겨우 풀어냈네요...뿌듯합니다!!!ㅎㅎㅎ 유튜브 강의 다 보면 드림코딩 아카데미로 꼭 넘어갈 예정이니 기다려주세요!! 아래는 수업한 내용 숙제 코드입니다. 엘리님 덕분에 코딩이 너무 재밌습니다. 비전공자여도 짜릿해요~~!!! 여러분 1일 1 Ellie 하세요!!!! //Callback Hell example class UserStorage{ async Userlogin(id, password){ const user = await this.loginUser(id, password); const role = await this.getRoles(user); return role; } loginUser(id, password){ return new Promise((resolve, reject) =>{ setTimeout(() => { if( (id === 'doyun' && password === 'dream') || (id === 'coder' && password === 'academy') ) { resolve(id); } else{ reject(new Error('not found')); } }, 1000); }) } getRoles(user){ return new Promise((resolve, reject) => { setTimeout(() => { if (user ==='doyun'){ resolve({name: 'doyun', role: 'admin'}); } else{ reject(new Error('no access')); } }, 2000); }); }; } const userStorage = new UserStorage(); const id = prompt('enter your id'); const password = prompt('enter your pw'); userStorage.Userlogin(id, password) .catch(console.log) .then(user => alert(`hello ${user.name}!, you have a ${user.role}`));

[@김태수-j6p]

아무리 찾아 공부해도 선생님 영상이 제일 도움 많이 됩니다 ㅠㅠ 감사합니다

[@jangkyungsoo]

정주행 완료~!!! 좋은 강의 진심으로 감사드립니다.

[@dream-coding]

감사합니다 ❤️

[@좋케해]

드디어 끝났네요, 엘리님의 자바스크립트 강의가 없었으면 정말 난감했을 것 같아요. ㅋㅋㅋ 감사합니다!! :) 그리고, 자바스크립트가 다른 언어에 비해서 문법이 간결해서 쉬워 보였는데, 깊게 들어가면 들어갈수록 무시무시한 언어였네요 ㅋㅋㅋㅋ (그래도 매일매일 앨리님 영상을 보고 공식 문서를 읽으면서 이해도를 높여가고 있습니다 :))

[@soja0524]

갑자기 node.js 서버 할 일이 생겨서 예전에 쌓아둔 기억들을 끄집어내고 있는 중입니다ㅠㅠ 그 와중에 엘리님 강의 들으니 이해 쏙쏙이네용ㅎㅎㅎ 감사해요

[@sehoony9332]

정말 좋은 강의라고 생각해서 주변 친구들한테 엘리님 강의 홍보하고 다니고 있습니다ㅎㅎ 자바스크립트 기본 강의는 이제 2번째 보는데, 볼 때마다 정말 대단한 강의구나 생각드네요!! 진심으로 감사합니다!!! 또 좋은 강의 기대하고 있을게요!! [Homework] class UserStorage{ delay(ms){ return new Promise(resolve => setTimeout(resolve,ms)); } async loginUser(id, password){ await this.delay(2000); if(id === 'sehoon' && password==='950723'){ return id; } else{ return new Error('not found'); } } async getRoles(user){ await this.delay(1000); if(user==='sehoon'){ return {name : 'sehoon', role : "captain"}; } else{ return new Error('no access'); } } } const userStorage = new UserStorage(); const id = prompt('enter your id'); const pwd = prompt('enter your pwd'); userStorage.loginUser(id, pwd) .then(user => userStorage.getRoles(user)) .then(user => alert(`${user.name}님은 ${user.role}입니다.` ));

[@soo7960]

드림코딩 강좌 40% 밖에 못했는데, 유튜브 강좌도 많이 올라왔네요.! 크헐~~ 드디어 리딩윅이 왔어요! 마무리 하겠습니다! ㅠㅡㅠ 그간 학교과제가 너무 많아서 엄두를 못냈어요. I will 정주행!

[@dream-coding]

학교 과제 하면서 들으시면 힘드시죠? 화이팅!

[@sonsy-]

우와 드디어 HTML, CSS, HTML+CSS, JS 1~13강 까지 다 들었네요. 생각보다 오래 걸렸지만 강의를 잘하시니 그래도 여기까지 올 수 있었네요! 감사합니다!!!

[@MIA-hf7ck]

여러번 반복해가면서 조금씩 느릿느릿 이해하고 있으니 오히려 역으로 이렇게 헷갈리는 개념을 쉽고 간결하게 설명해주기 위해서 엘리님이 얼마나 정성을 쏟으셨는지가 느껴져요 ㅠㅅㅠ 감사히 듣고 갑니다.

[@dream-coding]

좋은 피드백 남겨 주셔서 정말 감사해요 🤩

[@soja0524]

어떻게 콜을 날려야 가장 효율적일지 계속 고민하다가, 디자인만 구성했는데 엘리님 강의보고 정확한 방법을 찾아갑니다! 감사해요 :)

[@dream-coding]

오웃!:) 좋은 아이디어를 얻어 가신다니 💡

[@kyeongminkim3414]

너무 너무 너어어어어무 (글로 표현할 수 없을만큼) 좋았습니다. 감사합니다.

[@구구-m7y]

출석! 13. 비동기 소중한 강의 감사합니다.!

[@hoicryu1226]

븀 ~~~ 뱜~~~~ 이해도 잘되고 재미있는 엘리쌤 수업!!

[@kainy_21]

엘리언니, 너무 깔끔하게 설명해주시네요... 진짜 좋아용

[@eungikim184]

13강까지 수강 완료했습니다. 감사합니다~! ^^

[@hohan9654]

잘 이해하지 못하고 있던 내용을 잘 설명해주셔서 고맙습니다

[@박호성-g7o]

오오~ async & await 이해 1도 안갔었는데...진짜 너무 꿀같은 강의였습니다!! 강의 영상 쭈욱 올려주세요!! 감사합니다

[@choybe9074]

드뎌 13강 !! 다시 1강부터 들으러 가겠습니다!!!

[@dream-coding]

출석체크 확인 완료 😎 열심히 공부해 주셔서 감사해요, 화이팅!

[@ldh3319]

정말 너무 잘 봤습니다!! 급하게 프로젝트에 들어가게 되었는데 엘리님의 강의가 큰 도움이 될 것 같습니다!! 정말 감사합니다!!!

[@dream-coding]

프로젝트에서 문법때문에 막히는 일이 없었으면 좋겠어요 ❤️

[@재원이-x2h]

데이터 불러오는거랑 콜백지옥-promise-async/await까지 완강했습니다!! 드디어 저혼다 플젝할때 데이터 불러와서 적용시키는걸 성공했어요 ㅠㅠ 너무감사합니다!!

[@suhyeonkim2253]

아무것도 모르는 상태에서 엘리쌤 강의를 아마 올해 4월부터 들었을거예요 5월달에 비동기 시리즈 들었을때 그냥 이해가 하나도 안갔어요 ㅠㅠ 한글자도 못적고 어버버 했었는데 지지난달 브라우저 101 완강하고 지금 리액트 라우터부분 듣고 있어요 ㅎㅎ 리액트 듣다가 async쓰는거보고 갑자기 생각나서 차마 5월에 못끝냈던 이 강의 들으러 왔어요:) 그리고 이렇게 문제 풀었답니다!! 항상 감사한 마음에 finally에 감사인사를 ~^^ 멘토가 되주셔서 감사합니다. 포기하지않는 존버는 승리하나봅니다 !! class UserStorage{ delay(ms){ return new Promise(resolve => setTimeout(resolve, ms)) } async loginUser(id, password){ if( (id === 'coder' && password === 'world') || (id === 'jenny' && password === 'coding') ){ await this.delay(1000) return id }else{ throw new Error('😥 Username and password do not match') } } async getRoles(user){ if(user === 'coder'){ await this.delay(1000) return ({name:'coder', role:'admin'}) }else if(user === 'jenny'){ await this.delay(1000) return({name:'jenny', role:'mentor'}) }else{ throw new Error('😥 Username and password do not match') } } } const userStorage = new UserStorage() const id = prompt('enter your id') const password = prompt('enter your password') async function loginSystem(){ const userLogin = await userStorage.loginUser(id, password) const rolesGet = await userStorage.getRoles(userLogin) return alert(`welcome ${rolesGet.name}! you are a ${rolesGet.role} role!`) } loginSystem().then().catch(console.log).finally(console.log('Thank you Ellie!')) //try와 catch사용 async function loginSystem(){ try {const userLogin = await userStorage.loginUser(id, password) const rolesGet = await userStorage.getRoles(userLogin) alert(`welcome ${rolesGet.name}! you have a ${rolesGet.role} role!`)} catch(error){alert(error) }finally{ console.log('Thank you Ellie!') } } loginSystem()

[@GeunChangAhn]

기초를 잡는데 많은 도움이 되었습니다. 감사합니다

[@jwchoi3538]

드디어 자바스크립트 13강까지 도달하게 됐네요. ㅠㅠㅠㅠ 복습이 부족한 탓에 완벽하게 다 알지는 못했어도, 꾸준히 다시 메모 확인하고 복습해 나가면서 제 것으로 만들어야겠죠. 엘리님 덕분에 저의 첫 자바스크립트의 개념과 습관 등을 정립해나갈 수 있어 즐거웠습니다. 덕분에 어려워도 포기하지 않고 계속 함께 할 수 있다는 기분 좋은 응원까지 얻어가는 것 같습니다. 비록 제가 코딩을 늦게 시작한 탓에 작년 영상을 오늘에야 보게 됐지만, 이제는 복습과 함께 엘리님 최근 영상까지도 모두 기분 좋게 보고 빨리 따라 잡을게요. 우선, 저는 복습하면서 드림코딩도 결제하러 가야겠어요. 오늘도 출석체크해요! 감사합니다~

[@ioue98]

감사합니다 벌써 13번째 강의라니 너무 재밌어서 시간가는 줄 모르게 다 들었습니다.

[@ioue98]

async function changeAsync() { try { const user = await userStorage.loginUser(id,password); const userRole = await userStorage.getRoles(user); console.log(`Hello ${userRole.name}, you have a ${userRole.role} role`) } catch (error) { console.log(error); } } changeAsync().then(console.log);

[@jinan159]

우와아.... 제가본 강의중에서 promise, async, await을 가장 간결하고 깔끔하게 설명해주는 강의네요👍👍

[@dream-coding]

감사합니다 🙆‍♀️

[@stephenyou8373]

프론트엔드 개발자셔서 그런지 영상미가 너무 좋슴당 !

[@dream-coding]

아, 그런가요? 지난 모바일 개발자로 살아온 센스랄까요? 하하 감사합니다 ❤️

[@Dan-qn3go]

당장 컨텐츠 확인 못해도 항상 좋아요 먼저 누르고 갑니다. 매번 좋은 강의 해주셔서 감사합니다, 엘리님.

[@dream-coding]

우와 이런 선코멘트 남겨주시는것도 일일텐데 감사해요 ❤️

[@sangtaepark2050]

이해하기가 힘들었는데 쉽게 해결했습니다... 많은 도움 감사합니다... 건강하세요^_^

[@김준영-e4d]

감사합니다! 학원에서 처음으로 정식프로젝트중인데 도움이 정말 많이 됩니다ㅜㅜ

[@dream-coding]

감사합니다 ❤️

[@awesomeo1843]

정말 이해가 안돼서 미칠것 같았는데 영상 정말 많이 도움 되었습니다. 너무 감사드립니다

[@투준아빠]

너무 쏙쏙들어오네요 쓰면서도 이해못한부분이 있었는데 정확히 이해하는데 큰도음이 되었습니다

[@오도독-j4n]

엘리님 제가 udemy에서 유명한 사람들 강의 정말 많이 보고, velog도 참고해서 공부해봤지만 이렇게 엘리님처럼 명쾌하고 이해하기 쉽게 가르치는분 처음입니다.!!! 드림코딩 아카데미 강의를 다 들어야 겠다는 확신이드네요 정말 강의 컨텐츠가 알차고 좋은거 같습니다. 항상 감사합니다.!!!

[@dream-coding]

아이쿠 이런 좋은 피드백 정말 감사해요 ❤️

[@mulder3062]

잘 정리해주셨네요. 목소리 👍 ...귀에 쏙쏙...

[@mhl9901]

1~13 한바퀴 정주행했습니다 뒤로 갈수록 어렵네요.. 한번 쭉 정주행했으니 반복해서 듣고 연습하면 발전할거라는 생각으로 공부합니다!

[@박기호-x3z]

좋은 강의 덕분에 Promise, async, await를 쉽게 이해할 수 있었습니다. 정말 감사드립니다.

[@wishkim6157]

하루만에 다들었어요...너무 유익해요ㅠㅠㅠㅠ

[@이유승-p5e]

비동기 마지막편 수강하러 왔습니다 정말 영상이 재미있어서 여기까지 온거 같아요 좋은 영상 감사합니다(꾸벅)

[@khs-jk4mm]

IE가 지원종료되니, ES6 기술들을 사용할 수 있게 되어서 좋네요. 좋은 강의 감사합니다. 붐!

[@minuet86]

자바스크립트 인강도 많이 들어보고 여기저기 많이 찾아봤는데도 뭔가 계속 어려움이 있었어요.. 그러다가 검색검색 하다가 유튜브 추천에 엘리님 강의가 떠서 보게 되었습니다! 첨 1-2강 듣고서 넘 설명이 쏙쏙 들어와서,, 아 이거 이해 못하면 평생 자바스크립트 이해 못하겠다는 생각이 들었어요. (제가 본 중 젤 저한테 이해가 잘되는 강의여서..ㅋㅋ) 그래서 지금까지 수업 설명이랑 코딩을 손으로 연습장에 다 쓰면서 여기까지 왔습니다! 손으로 코드를 썼더니 또 느낌이 다르고 이해가 더 잘되는 것 같아요!! 앞으로 남은 강의도 하루 2강씩 꾸준히 듣고, 다 들으면 코딩도 해보고 몇번씩 반복해 볼 생각입니다 ㅎㅎ 좋은 강의 넘 감사해요 엘리 ㅠ.ㅠ 💖💖 이 강의가 무료라니.. 저를 이곳으로 보내준 유튜브 알고리즘에게도 감사를 표합니다 ㅋㅋ

[@dream-coding]

Code your Dream ✨

[@HwangByungChun]

강의가 너무 좋습니다... 진심 감사합니다

[@sixinco]

오늘도 영상보고 잘 배워갑니다 감사해요!

[@이성태-g5u]

다른 강의 듣다가 아 왜 이분은 뿜! 안 하시지 하면서 생각이 날 것 같아요 너무 좋은 강의여서 이해가 정말 잘 됐습니다 나름대로 풀어봤습니당 async function login() { try{ let userId = await userStorage.loginUser(id, password); userId = await userStorage.getRoles(userId); return alert(`Hello ${userId.name}, you have a ${userId.role} role`); } catch(error) { return console.log(error); } } login().then().catch();

[@choisooim9306]

늘 감사합니다. 정말 좋은 강의였어요!

[@jun6992]

12.프로미스부터 어려워서 12,13을 2~3번 반복해서 봤으나 역시 이해가 잘 가지 않네요 몇몇 분들도 어려워 하시는걸 보니, 역시 좀 어려운 단원인가 봅니다 좋은 강의 감사합니다 ^^

[@seyonappa]

드디어 다 들었습니다. callback 부터 async, await 까지 개념정리를 확실히 시켜주시는 군요. 이제 리액트 들으러 갑니다. 아 드디어 유료네요. 그리고 혹시 swift 강의는 하실 계획 없으신가요?

[@최윤호-w2z]

안녕하세요. 계속 듣고있습니다. 너무 재밌어서 댓글도안쓰고 끝까지 봤네요 ㅠㅠ 죄송합니다. 좋은 강의 감사합니다 ㅎㅎ

[@dream-coding]

지금이라도 남겨주셔서 감사합니다 ❤️

[@parandle4438]

웹 세상에 얼마전에 입문해서 헤매고 있었는데 이런 좋은 영상이 있어서 너무 도움이 많이 되고 있어요. 좋은 영상 계속 만들어주세요~ 열심히 구독하겠습니다~

[@thfqkd]

마지막강의 출석체크 합니다! 퀄리티 높은 강의 감사합니다.

[@KwonPodo]

13강까지 수강 완료했습니다! 마지막 숙제가 안풀려 하루종일 혼자 붙잡고 있었는데도 잘 안되네요 ㅠㅠ 항상 좋은 강의 감사합니다

[@fishyou3567]

덕분에 비동기 이해했습니다. 이제 실제 서버와 통신까지 구현해보고싶습니다. 감사합니다!!

[@jjongsoo_]

열심히 정주행중입니다!

[@박지용-k3k6w]

then . then . then . 남발하다가 갑자기 안되서 어? 어? 어? 하면서 영상 한번 더 봤어용~ 영상 넘 잘만드셔서 좋아유~

[@dream-coding]

감사합니다 ❤️

[@jungkyunyang5184]

안녕하세요. 항상 좋은 강의 감사드립니다. 주말에 13강까지 시간가는줄 모르고 즐겁게 시청하였습니다. 아래와 같이 숙제를 제출합니다. --- delay = (ms) => { return new Promise((resolve, reject) => setTimeout(resolve, ms)); }; class UserStorage { loginUser = async function(id, password){ await delay(2000); if ((id === "ellie" && password ==="dream") || (id === "coder" && password ==="academy")){ return id; } else{ throw 'not found'; } } getRoles = async function (user){ await delay(1000); if(user === 'ellie'){ return {name: 'ellie', role:"admin"}; } else{ throw 'no access'; } } } const userStorage = new UserStorage(); const id = prompt('enter your id'); const password = prompt('enter your password'); async function login(id, password){ user = await userStorage.loginUser(id, password); userWithRole = await userStorage.getRoles(user); return userWithRole; } login(id,password).then(user => alert(`Hello ${user.name}, you have a ${user.role} role`));

[@xuhlelinonh]

Javascript의 비동기 처리에 대해 잘못 알고 있던 부분이 많았네요ㅠ 감사합니다!

[@신동열-x7p]

async function practiceAsync() { const login = await userStorage.loginUser(id, password); const user = await userStorage.getRoles(login); return alert(`Hello ${user.name}, you have a ${user.role} role`); } practiceAsync().then(console.log); 항상 좋은강의 감사드립니다. 슨생님! 마지막에 답을 가르쳐주 주시던데 이번에는 아예..풀어보라고 다음편에 ㅋㅋㅋㅋ 한번 열심히 풀어봤습니다.. 동작은 하는데 제대로 코드를 작성한건지 잘모르겠네요...ㅎㅎㅎㅎ;; 틀린부분있으면 수정하겠습니다...

[@dream-coding]

어웃!!! ❤️ 저랑 비슷하게 작성하셨네요! 🙌 class UserStorage { // 이거 추가함 async getUserWithRole(user, password) { const user = await this.loginUser(user, password); const role = await this.getRoles(user); return role; } } // 그리고 쓸때는 // promise chaining -> ✨ async/await ✨ userStorage .getUserWithRole() // .catch(console.log) .then(console.log);

[@金成柱김성주]

구독자수가 벌써 2만명 넘어섰네요~ 축하드려요~! 초창기부터 생각했는데... 역시 엘리님은 마음만 먹으면 뭐든 잘해내시네요, 여기 유튜브에서 뿐만아니라 직장에서도, 가정에서도~~ 같은 분야는 아니지만 항상 저의 본보기랍니다~

[@dream-coding]

성주님 항상 좋은 말씀 감사해요 🙌 저두 성주님과 똑같이 회사 일과 하고 싶은 것들 사이에서 왔다 갔다 바쁘게 생활하고 있어요 :) 우리 모두 화이팅!

[@proghjy]

프로미스 듣고 넘어 왔어요 ㅎㅎ 13번째 영상도 감사 감사 감사합니다 엘리님!

[@qwee9512]

감사합니다 다른 강의도 열심히 볼게요!