If you want to take your website to the next level, the ability to incorporate interactivity is a must. But adding some of these types of capabilities requires a stronger programming language than HTML5 or CSS3, and JavaScript can provide just what you need. With just a basic understanding of the language, you can create a page that will react to common events such as page loads, mouse clicks & movements, and even keyboard input.
이 강좌는 Web Design for Everybody: Basics of Web Development & Coding 전문 분야의 일부입니다.
Interactivity with JavaScript
제공자:
About this Course
최근 조회 200,766회
학습자 경력 결과
41%
이 강좌를 수료한 후 새로운 경력 시작하기
31%
이 강좌를 통해 확실한 경력상 이점 얻기
11%
급여 인상 또는 승진하기
귀하가 습득할 기술
Document Object Model (DOM)JavaScriptWeb Development
학습자 경력 결과
41%
이 강좌를 수료한 후 새로운 경력 시작하기
31%
이 강좌를 통해 확실한 경력상 이점 얻기
11%
급여 인상 또는 승진하기
공유 가능한 수료증
완료 시 수료증 획득
100% 온라인
지금 바로 시작해 나만의 일정에 따라 학습을 진행하세요.
다음 전문 분야의 5개 강좌 중 3번째 강좌:
유동적 마감일
일정에 따라 마감일을 재설정합니다.
완료하는 데 약 12시간 필요
권장: 7 hours/week
영어
자막: 영어
강의 계획 - 이 강좌에서 배울 내용
완료하는 데 3시간 필요
Week One: Introduction to JavaScript
If you haven't use a traditional programming language before, this first week is key. Before we begin with the how, we will talk about the why, mainly why we want to use JavaScript. The main reason is that it is very easy for JavaScript to work with the DOM. And easy is always a great way to start. Speaking of starting out, it is also always more fun when our code actually does something we can see, so we will jump quickly into different ways we can generate output. It won't be flashy yet, but it will be a great way to get your feet wet with traditional programming. After that we go back to the basics of how a computer uses data. We begin with variables, expressions, and operators.
완료하는 데 3시간 필요
6개 동영상 (총 50분), 10 readings, 1 quiz
6개의 동영상
DOM Review with Object Oriented Programming6m
Output13m
Variables9m
Data Types8m
Operators and Expressions8m
10개의 읽기 자료
Syllabus7m
Help us learn more about you!10m
Resources4m
"What are these deadlines?"3m
Link to All of the Code for Week One3m
The Document Object Model (DOM)2m
Trying to Create and Debug Your Own Output5m
Notice for Auditing Learners: Assignment Submission10m
Optional Materials2m
The History of "Debugging"2m
1개 연습문제
Week One52m
완료하는 데 3시간 필요
Week Two: Reacting to Your Audience
If you have written HTML code in the past, hopefully you have fallen into the great habit of validating your code -- making sure that you close all of your open tags. There are other rules that you may or may not have been following as well, for instance the importance of using each id attribute only once per page. This is called writing "clean" code. The reasoning and importance of following these rules becomes clear as we begin to manipulate the different components of your webpage based on the the actions of the person interacting with your page. In particular you will learn about the JavaScript Mouse Events and Touch Events. This week's materials will end with a photo gallery example that you can create along with me.
완료하는 데 3시간 필요
7개 동영상 (총 53분), 6 readings, 2 quizzes
7개의 동영상
Code Placement6m
Folder Structure / Organizing Your Code5m
Events10m
Code With Me - Events7m
"this"9m
Photo Gallery5m
6개의 읽기 자료
Link to All of the Code for Week Two2m
Functions3m
Organizing Your Code5m
Mastering Events and Functions3m
Just a little note before the next video3m
Homework Time!!2m
1개 연습문제
Optional - Week Two Review14m
완료하는 데 2시간 필요
Week Three: Arrays and Looping
This week we will delve into more complex programming concepts: arrays and looping. Arrays allow you to represent groups of related information. Looping provides efficiency and flexibility to your programs. Using both we will expand upon the photo gallery example.
완료하는 데 2시간 필요
7개 동영상 (총 57분), 4 readings, 1 quiz
7개의 동영상
Code With Me - Arrays5m
JavaScript Iteration7m
Flow Of Control11m
Code With Me - Combining Loops and Conditionals6m
Advanced Conditionals7m
Common Errors10m
4개의 읽기 자료
Link to All of the Code for Week Three2m
A JavaScript Cheat Sheet10m
Arrays5m
Advanced Coding Techniques2m
1개 연습문제
JavaScript Review30m
완료하는 데 3시간 필요
Week Four: Validating Form Data
This week we will put a number of the concepts from this course together to tackle a new project - creating and validating input entered into an HTML5 form. Forms are extremely common elements used to input and send data to via a webpage. We will look at how you can use JavaScript to add options to your forms, to pre-fill data based on previous input, and even to check that passwords match.
완료하는 데 3시간 필요
5개 동영상 (총 46분), 7 readings, 1 quiz
5개의 동영상
Simple Forms12m
Simple Validation10m
Comparing Two Inputs8m
Checkboxes and Radio Buttons11m
Conclusion3m
7개의 읽기 자료
Link to All of the Code for Week Four5m
Introduction to Forms2m
"Cool Stuff" - Friend or Foe?4m
Using Forms on Your Site3m
More Code Examples2m
Intro to JQuery1m
Post-course Survey10m
검토
4.7
INTERACTIVITY WITH JAVASCRIPT의 최상위 리뷰
MM 제공Feb 6, 2016
I was glad to find a course that focused simply on the basics of Javascript. So many courses cover the three HTML, CSS, and JS, but don't give enough to really start working with Javascrip.\n\nThanks
LC 제공Mar 15, 2016
An excellent course, my JavaScript has improved greatly since I completed the requirements. Colleen is a fantastic teacher, I found the lectures to be highly informative and the assignments good fun.
JP 제공May 5, 2016
Good course. 1st week is a little fast. The other weeks are much better. It needs to be a longer course though covering many additional topics. Or offer it as additional courses for more JavaScript.
AB 제공Jan 13, 2016
Well done. I think Javascript is hard to start out in, it makes it hard to review the class. But it was just about right for me. The first assignment almost had me giving up, but it all ended up ok.
FF 제공Feb 7, 2018
Well explained, I learned some interactivity with HTML by learning native JavaScript (was using jQuery always)... Perhaps I expected some more advanced stuff than this (like audio, video, canvas).
FA 제공Nov 29, 2019
Great course, it starts from basic code and it is really helpful to get a basic idea about how JavaScript works. Again the code together videos are nice and well explained. Highly recommended.
SP 제공Aug 24, 2016
The teaching of the professor Colleen is wonderful and very interactive . Troy (teaching staff) is also very supportive .In short a very good course for interactive learning of Java script :)
SL 제공Feb 8, 2018
Great class. I recommend anyone who are interested in coding to take this course. It can help you understand what is JavaScript and understand what is going on in the coding language world.
미시건 대학교 정보
The mission of the University of Michigan is to serve the people of Michigan and the world through preeminence in creating, communicating, preserving and applying knowledge, art, and academic values, and in developing leaders and citizens who will challenge the present and enrich the future.
Web Design for Everybody: Basics of Web Development & Coding 전문 분야 정보
This Specialization covers how to write syntactically correct HTML5 and CSS3, and how to create interactive web experiences with JavaScript. Mastering this range of technologies will allow you to develop high quality web sites that, work seamlessly on mobile, tablet, and large screen browsers accessible. During the capstone you will develop a professional-quality web portfolio demonstrating your growth as a web developer and your knowledge of accessible web design. This will include your ability to design and implement a responsive site that utilizes tools to create a site that is accessible to a wide audience, including those with visual, audial, physical, and cognitive impairments.
자주 묻는 질문
강의 및 과제를 언제 이용할 수 있게 되나요?
강좌에 등록하면 바로 모든 비디오, 테스트 및 프로그래밍 과제(해당하는 경우)에 접근할 수 있습니다. 상호 첨삭 과제는 이 세션이 시작된 경우에만 제출하고 검토할 수 있습니다. 강좌를 구매하지 않고 살펴보기만 하면 특정 과제에 접근하지 못할 수 있습니다.
이 전문 분야를 구독하면 무엇을 이용할 수 있나요?
강좌를 등록하면 전문 분야의 모든 강좌에 접근할 수 있고 강좌를 완료하면 수료증을 취득할 수 있습니다. 전자 수료증이 성취도 페이지에 추가되며 해당 페이지에서 수료증을 인쇄하거나 LinkedIn 프로필에 수료증을 추가할 수 있습니다. 강좌 내용만 읽고 살펴보려면 해당 강좌를 무료로 청강할 수 있습니다.
환불 규정은 어떻게 되나요?
재정 지원을 받을 수 있나요?
궁금한 점이 더 있으신가요? 학습자 도움말 센터를 방문해 보세요.
