개발 · 프로그래밍

/

프론트엔드

Amazing JavaScript - 입문

프런트엔드 개발을 위해 필요한 자바스크립트 기초 지식. 실무자로서 꼭 알아야 하는 필수 지식들을 쉽고 빠르게 설명해 줍니다. 2024년 현대 프런트엔드 개발 트렌드를 반영한 기본 강의.

(5.0) 수강평 62개

수강생 2,711명

Thumbnail

입문자를 위해 준비한
[프론트엔드, JavaScript] 강의입니다.

이런 걸
배워요!

  • 자바스크립트 개발

  • JavaScript 기본 문법

  • ES6+

프런트엔드 개발의 첫 걸음: 자바스크립트

React, Vue 등 프레임워크를 배우기 전에 꼭 알아야 하는 자바스크립트 기본, 최신 문법들을 짧은 시간 안에 압축적으로 배울 수 있는 강의입니다. 최신 프런트엔드 프레임워크로 웹 애플리케이션을 개발할 때 딱 필요한 만큼만 배우실 수 있도록 강의를 구성했어요 :)

이런 분들께 추천해요

프런트엔드 개발을
시작하는 입문자

FE 개발을 시작할 때 뭐부터 배워야 할지 모르겠어요. 자바스크립트는 어느정도 알아야 하나요?

자바스크립트 문법
알듯 말듯 아리송한 사람들

React, Vue는 배웠는데 자바스크립트 문법을 정확히 모르겠어요. export default, async await, ..., then & catch, () => {} 😵‍💫

렉시컬 스코프, 프로토타입
때문에 머리가 아픈 분들

실무에서는 이런 개념들 몰라도 충분히 개발할 수 있습니다. 필요한 개념만 실용적으로 배워요 :)

수강 후에는

  • 프레임워크를 사용하기 위해 필요한 자바스크립트 기본, 최신 문법을 마스터합니다.

  • 실무 개발에서 가장 중요한 배열 다루기, 비동기 처리, 모듈화 문법의 기본기를 다질 수 있어요.

  • 자바스크립트가 그렇게 어려워 보이진 않을 거예요. 쉬운데 필수인 문법만 쉽게 알려드립니다 :)

이 강의의 특징

01j0vy9fgwmz5x59g26bh87xrh

수업 내용보다 더 방대한 웹 교안으로 학습과 복습

수업에서 배운 내용을 쉽게 복습할 수 있게 웹 사이트 교안을 제공합니다. 더 공부하고 싶은 부분들은 무료로 더 공부하실 수 있어요

설명은 짧게 실습은 쉽고 충분하게

아무리 쉽게 설명해도 어려운 건 어렵습니다. 설명은 필요한 부분만 최대한 짧게 얘기하고, 코드로 쉽게 풀어서 설명해 드려요 😄

이런 내용을 배워요

1. 자바스크립트 기본 문법

자바스크립트를 다룰 때 가장 기본이 되는 변수, 함수, 반복문, 조건문, 객체, 배열 등을 배웁니다. 자바스크립트의 가장 큰 특징 중 하나인 일급 함수에 대해서도 쉽게 배울 수 있어요 :)

2. 자바스크립트 최신 문법(ES6+)

최신 문법은 기존의 자바스크립트 문법을 더 간결하고 빠르게 작성하기 위해 고안되었습니다.
단순히 문법을 외우는 게 아니라 왜 이렇게 작성하는지 배경도 설명해 드려요.

자바스크립트의 중요한 개념인 비동기 처리도 콜백부터 async, await까지 정주행 해보실 수 있어요 :)

이 강의를 만든 사람👨‍💻

장기효 (캡틴판교)

"인프런이 만난 사람" 인터뷰


궁금한 점이 있나요?

Q1. 인프런에서 8년만에 처음으로 무료 강의를 올리신 것 같은데 어떤 계기가 있었나요?

기존에 자바스크립트 강의를 별도로 만들지 않았던 건 Vue.js 강의 로드맵 중간중간에 필요한 자바스크립트 문법을 다 설명드렸기 때문인데요. 이번에 React 학습 로드맵도 제작하면서 자바스크립트 기본, 필수 문법을 설명해 주는 영상이 필요하겠다고 생각했어요.

저도 처음에 자바스크립트를 학습할 때 CodeSchool, 생활코딩 등의 무료 영상들에 도움을 받았던 것처럼 개발자 생태계를 위해 무료로 오픈하게 되었습니다 :)

여러분도 제가 좋은 강의로 깨달음을 얻고 재미를 느꼈던 걸 경험해 보실 수 있으면 좋겠네요

Q2. 이 강의를 듣기 위해 HTML, CSS도 알아야 하나요?

아니요. 자바스크립트의 기본 개념과 문법을 이해하는 수업이기 때문에 HTML, CSS는 모르셔도 됩니다. 자바스크립트가 HTML, CSS를 조작할 수 있는 특징이 있지만 이 점에 대해서는 강의에서 다루지 않습니다. 그래도 무료 강의니 부담 없이 수강 신청하시고 들어보셔도 될 것 같아요 :)

Q3. 자바스크립트를 좀 할 줄 아는데(주니어, 실무자) 들어도 될까요?

네. 무료 강의니 교과과정 보시고 필요한 부분만 학습하셔도 돼요. 변수, 함수, 조건문, 배열 등의 기본 문법은 이미 알고 있다면 ES6+ 최신 문법과 비동기처리 쪽을 살펴보시면 얻어가는게 있으실 겁니다 :)

Q4. 이 강의를 듣고 나면 다음 강의는 어떤 걸 듣는게 좋을까요?

강의 소개 페이지에 안내된 학습 로드맵에 따라서 React 학습 로드맵 또는 Vue 학습 로드맵을 들으시는 걸 추천드려요. 개발을 배우는 목적에 따라서 취업을 원하시는 경우 학습 로드맵을 권장드리고, 개인 사업이나 제품 개발이 목적이신 분들은 전체 강의 목록 중에서 필요하신 걸 골라 들으시면 좋을 것 같습니다 :)

Q5. 좀 더 심화된 내용을 듣고 싶어요.

Amazing JavaScript는 Amazing Spiderman을 모티브로 시리즈 이름을 지었는데요. 스파이더맨 시리즈가 여러편이 있듯이 자바스크립트도 입문, 실전, 활용 레벨로 후속 강의를 촬영할 예정입니다. 여러분의 기운과 응원을 받아서 더 빠르게 콘텐츠를 들고 올 수 있게 강의 들으시구 수강평도 잘 남겨주세요 :)

수강 전 참고 사항

실습 환경

  • 운영 체제 및 버전(OS): 강의에서 Mac을 쓰지만 Windows 관련 단축키도 모두 설명합니다.

  • 사용 도구: 별도 개발 툴을 설치하지 않고 크롬 브라우저 하나로 수업합니다.

학습 자료

  • 수업에서 배운 내용보다 더 방대한 내용을 재밌게 배울 수 있는 웹 교안블로그가 제공됩니다.

  • 수업 중간중간에 언급된 내용들을 쉽게 배울 수 있는 무료 교육 영상도 많이 안내해요 🎁

선수 지식 및 유의사항

  • C, Java, Python 등 다른 언어로 프로그래밍을 한번이라도 해보신 분이 듣기 가장 좋은 수업입니다.


띠배너

이런 분들께
추천드려요!

학습 대상은
누구일까요?

  • 프런트엔드 개발 입문자

  • 자바스크립트에 관심 있는 개발자

인프런에서 8년째 지식을 공유하고 있습니다. 🏠 기술블로그, 💻 깃헙

📗 Do it! Vue.js 입문, 쉽게 시작하는 타입스크립트, 나는 네이버 프런트엔드 개발자입니다. 책 3권 집필
📖 Cracking Vue.js, 타입스크립트 핸드북, 웹팩 핸드북. 온라인 무료 가이드북 3권 집필
👨‍💻 캡틴판교의 프론트엔드 개발 유튜브 채널 운영 - 취준생, 주니어 개발자들의 고민을 들을 수 있는 곳
🥤 캡틴판교의 카카오톡 오픈 채팅방 운영 - 프런트엔드 개발 최신 정보와 업계 동료들의 생각과 고민을 들을 수 있는 곳

커리큘럼

전체

42개 ∙ (2시간 56분)

강의 게시일: 
마지막 업데이트일: 

수강평

아직 충분한 평가를 받지 못한 강의입니다.
모두에게 도움이 되는 수강평의 주인공이 되어주세요!