Об этом курсе: Do you realize that the only functionality of a web application that the user directly interacts with is through the web page? Implement it poorly and, to the user, the server-side becomes irrelevant! Today’s user expects a lot out of the web page: it has to load fast, expose the desired service, and be comfortable to view on all devices: from a desktop computers to tablets and mobile phones. In this course, we will learn the basic tools that every web page coder needs to know. We will start from the ground up by learning how to implement modern web pages with HTML and CSS. We will then advance to learning how to code our pages such that its components rearrange and resize themselves automatically based on the size of the user’s screen. You’ll be able to code up a web page that will be just as useful on a mobile phone as on a desktop computer. No “pinch and zoom” required! Last but certainly not least, we will get a thorough introduction to the most ubiquitous, popular, and incredibly powerful language of the web: Javascript. Using Javascript, you will be able to build a fully functional web application that utilizes Ajax to expose server-side functionality and data to the end user.
Для кого этот курс: WE ARE NOT COVERING RUBY ON RAILS IN THIS COURSE AND NO RUBY ON RAILS KNOWLEDGE IS REQUIRED TO COMPLETE IT! This course is geared to ANYONE who is interested in starting in Web Development. It starts with the basics and methodically goes to a fair amount of depth on each of the subjects. Most importantly, it allows the students to follow a real-world project with a real client from beginning of talking to the customer to fully coding their website. The portion on Javascript does require you to be at least familiar with some programming concepts like looping, variable storage, etc.
Автор: Университет Джонса Хопкинса
Преподаватели: Yaakov Chaikin, Adjunct Professor, Graduate Computer Science
Whiting School of Engineering
| Основные сведения | Course 4 of 6 in the Ruby on Rails Web Development Specialization |
| Выполнение | 5 weeks of study, 4-6 hours/week |
| Язык | English |
| Как пройти курс | Чтобы пройти курс, выполните все оцениваемые задания. |
| Оценки пользователей |
Программа курса
НЕДЕЛЯ 1
Introduction to HTML5
In this module we will learn the basics of HTML5. We'll start with instructional videos on how to set up your development environment, go over HTML5 basics like valid document structure, which elements can be included inside other elements and which can not, discuss the meaning and usefulness of HTML5 semantic tags, and go over essential HTML5 tags.
18 видео, 6 материалов для самостоятельного изучения, 11 practice quizzes
- Reading: How Grading and Being Late on Assignments Works
- Reading: Recommended Books
- Reading: CHECK OUT MY SITE!
- Reading: ALL of the EXAMPLE SOURCE CODE for this Course
- Practice Quiz: Optional Practice Quiz
- Видео: Welcome to Module 1: Introduction to HTML5
- Видео: Development Environment Setup, Part 1
- Видео: Development Environment Setup, Part 2: MacOS
- Видео: Development Environment Setup, Part 2: Windows
- Practice Quiz: Optional Practice Quiz
- Видео: Development Environment Setup, Part 3: Github and Browser Sync
- Видео: Resources for Asking Questions
- Видео: Lecture 1: What is HTML?
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 2: Relevant History of HTML
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 3: Anatomy of an HTML Tag
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 4: Basic HTML Document Structure
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 5: HTML Content Models
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 6: Heading Elements (and some new HTML5 semantic comments)
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 7: Lists
- Видео: Lecture 8: HTML Character Entity References
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 9: Creating Links
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 10: Displaying Images
- Reading: Frequently Asked Questions
- Practice Quiz: Optional Practice Quiz
- Reading: CONNECT WITH ME!
- Видео: Module 1 Wrap-Up
Оцениваемый: Module 1 Quiz
НЕДЕЛЯ 2
Introduction to CSS3
A lot of people "tinker" with CSS. In this module, we'll take you from the very basics of CSS3 to some fairly advanced concepts like floating and CSS rule conflict resolution. We'll go over the 'box model', background property, etc. We'll finish off the module with learning about Responsive Design using our own CSS code as well as start introducing Twitter Bootstrap with its essential Grid System.
27 видео, 4 материалов для самостоятельного изучения, 14 practice quizzes
- Reading: Recommended Books
- Reading: ENTER RAFFLE (ends April 23rd, 2017)
- Видео: Lecture 11: Power of CSS
- Видео: Lecture 12: Anatomy of a CSS Rule
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 13: Element, Class, and ID Selectors
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 14: Combining Selectors
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 15: Pseudo-Class Selectors
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 16: Style Placement
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 17, Part 1: Conflict Resolution
- Видео: Lecture 17, Part 2: Conflict Resolution
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 18, Part 1: Styling Text
- Видео: Lecture 18, Part 2: Styling Text
- Reading: CONNECT WITH ME!
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 19, Part 1: The Box Model
- Видео: Lecture 19, Part 2: The Box Model
- Видео: Lecture 19, Part 3: The Box Model
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 20: The background Property
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 21: Positioning Elements by Floating
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 22, Part 1: Relative and Absolute Element Positioning
- Видео: Lecture 22, Part 2: Relative and Absolute Element Positioning
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 23, Part 1: Media Queries
- Видео: Lecture 23, Part 2: Media Queries
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 24, Part 1: Responsive Design
- Видео: Lecture 24, Part 2: Responsive Design
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 25, Part 1: Introduction to Twitter Bootstrap
- Видео: Lecture 25, Part 2: Introduction to Twitter Bootstrap
- Видео: Lecture 26, Part 1: The Bootstrap Grid System
- Видео: Lecture 26, Part 2: The Bootstrap Grid System
- Practice Quiz: Optional Practice Quiz
- Reading: Frequently Asked Questions
- Видео: Module 2 Wrap-Up
Оцениваемый: Module 2 Coding Assignment
НЕДЕЛЯ 3
Coding the Static Restaurant Site
Ready for some REAL fun? This module is it! We'll go over some basics of interacting with a client when managing a web site project and then go visit a real client at their place of business (a Chinese restaurant), help the owner figure out what she wants in a site, and get acquainted with the restaurant in general. We'll spend the rest of the module building a real web site for this business from scratch and you'll get to sit next to me and watch as the site comes together.
24 видео, 3 материалов для самостоятельного изучения, 5 practice quizzes
- Reading: Recommended Books
- Видео: Lecture 27, Part 1: Visit with the Client
- Видео: Lecture 27, Part 2: Visit with the Client (Field Trip)
- Reading: ENTER RAFFLE (ends April 23rd, 2017)
- Видео: Lecture 28: Design Overview
- Видео: Lecture 29: Some Ground Rules and Overview of Setup
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 30, Part 1: Coding Basics of Navbar Header
- Видео: Lecture 30, Part 2: Coding Basics of Navbar Header
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 31: Coding Button for Future Collapsible Menu
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 32, Part 1: Coding Nav Menu Buttons
- Видео: Lecture 32, Part 2: Coding Nav Menu Buttons
- Видео: Lecture 33, Part 1: Fixing Navbar Layout, Text, and Dropdown Menus
- Видео: Lecture 33, Part 2: Fixing Navbar Layout, Text, and Dropdown Menus
- Видео: Lecture 34: Coding the Jumbotron
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 35, Part 1: Coding Navigation Tiles
- Видео: Lecture 35, Part 2: Coding Navigation Tiles
- Видео: Lecture 36, Part 1: Coding the Footer
- Видео: Lecture 36, Part 2: Coding the Footer
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 37, Part 1: Coding the Menu Categories
- Видео: Lecture 37, Part 2: Coding the Menu Categories
- Видео: Lecture 38, Part 1: Coding the Single Menu Category Page
- Видео: Lecture 38, Part 2: Coding the Single Menu Category Page
- Видео: Lecture 38, Part 3: Coding the Single Menu Category Page
- Видео: Lecture 39: Testing the Mobile Version on a Real Phone
- Reading: Frequently Asked Questions
- Видео: Module 3 Wrap-Up
Оцениваемый: Module 3 Coding Assignment
НЕДЕЛЯ 4
Introduction to Javascript
What fun would a web site be if there was no functionality to it? In this module, we are going to concentrate on learning the fundamentals of the Javascript language. A lot of even seasoned developers “tinker” with Javascript without really understanding how the language works. That leads to viewing the language as more of a nuisance instead of a powerful tool. That is why we are going to concentrate not only on the “how” but also on the “why”, so you are empowered by the Javascript language features, not confused by them. We’ll cover just about everything - from common language constructs and Javascript types to objects, functions, arrays, closures, and scope isolation.
24 видео, 3 материалов для самостоятельного изучения, 9 practice quizzes
- Reading: Recommended Books
- Видео: Lecture 40, Part 1: Adjusting Development Environment for Javascript Development
- Видео: Lecture 40, Part 2: Where to Place Javascript Code
- Видео: Lecture 41, Part 1: Defining Variables, Function, and Scope
- Видео: Lecture 41, Part 2: Defining Variables, Function, and Scope
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 42, Part 1: Javascript Types
- Видео: Lecture 42, Part 2: Javascript Types
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 43, Part 1: Common Language Constructs
- Видео: Lecture 43, Part 2: Common Language Constructs
- Видео: Lecture 43, Part 3: Common Language Constructs
- Видео: Lecture 44: Handling Default Values
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 45, Part 1: Creating Objects Using 'new Object()' Syntax
- Видео: Lecture 45, Part 2: Creating Objects Using Object Literal Syntax
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 46: Functions Explained
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 47, Part 1: Passing Variables by Value vs. by Reference
- Видео: Lecture 47, Part 2: Passing Variables by Value vs. by Reference
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 48: Function Constructors, prototype, and the 'this' Keyword
- Видео: Lecture 49: Object Literals and the 'this' Keyword
- Reading: ENTER RAFFLE (ends April 23rd, 2017)
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 50, Part 1: Arrays
- Видео: Lecture 50, Part 2: Arrays
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 51: Closures
- Видео: Lecture 52, Part 1: Fake Namespaces
- Видео: Lecture 52, Part 2: Immediately Invoked Function Expressions (IIFEs)
- Practice Quiz: Optional Practice Quiz
- Reading: Frequently Asked Questions
- Видео: Module 4 Wrap-Up
Оцениваемый: Module 4 Coding Assignment
НЕДЕЛЯ 5
Using Javascript to Build Web Applications
In this module, we are going to take all those newly learned Javascript language skills and learn how to utilize them within the context of a web page. We’ll start by learning how to properly manipulate the web page components using the Javascript Document Object Model API. We will then move on to learning one of the most popular ways of serving up data to a web site - Ajax. We'll learn about the protocol that the language of the web speaks in (HTTP), how to set up and handle Ajax requests and responses, as well as how to process JSON data. We'll finish the module by connecting our restaurant web site from Module 3 to a real backend service that will allow us to pull the data for the restaurant menu dynamically from the server without having to reload the entire page.
17 видео, 6 материалов для самостоятельного изучения, 3 practice quizzes
- Reading: Recommended Books
- Видео: Lecture 53, Part 1: DOM Manipulation
- Видео: Lecture 53, Part 2: DOM Manipulation
- Видео: Lecture 54: Handling Events
- Видео: Lecture 55: The 'event' Argument
- Reading: CONNECT WITH ME!
- Practice Quiz: Optional Practice Quiz
- Видео: Lesson 56: HTTP Basics
- Видео: Lesson 57, Part 1: Ajax Basics
- Видео: Lesson 57, Part 2: Ajax Basics
- Видео: Lesson 57, Part 3: Ajax Basics
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 58: Processing JSON
- Practice Quiz: Optional Practice Quiz
- Видео: Lecture 59: Fixing Mobile Nav Menu Automatic Collapse
- Видео: Lecture 60: Dynamically Loading Home View Content
- Видео: Lecture 61, Part 1: Dynamically Loading Menu Categories View
- Видео: Lecture 61, Part 2: Dynamically Loading Menu Categories View
- Видео: Lecture 62: Dynamically Loading Single Category View
- Видео: Lecture 63: Changing 'active' Button Style Through Javascript
- Reading: Check out the final deployed site
- Reading: Frequently Asked Questions
- Reading: ENTER RAFFLE (ends April 23rd, 2017)
- Видео: Course Wrap-Up
- Reading: CONNECT WITH ME!
Оцениваемый: Module 5 Coding Assignment
Часто задаваемые вопросы
Как это работает
Coursework
Each course is like an interactive textbook, featuring pre-recorded videos, quizzes and projects.
Help from Your Peers
Connect with thousands of other learners and debate ideas, discuss course material, and get help mastering concepts.
Certificates
Earn official recognition for your work, and share your success with friends, colleagues, and employers.
Авторы
Университет Джонса Хопкинса
The mission of The Johns Hopkins University is to educate its students and cultivate their capacity for life-long learning, to foster independent and original research, and to bring the benefits of discovery to the world.
Стоимость
| Приобрести курс | |
|---|---|
| Получить доступ к материалам курса | Доступен |
| Получить доступ к оцениваемым материалам курса | Доступен |
| Получить итоговую оценку | Доступен |
| Earn a shareable Course Certificate | Доступен |
Рейтинги и отзывы
It's a wonderful and funny journey!
Investing 2-3 hours everyday on this course, you will get pretty much changes.
Very good course to start in web developing
Great Course !! Learn Lot from this course..
Coursera делает лучшее в мире образование доступным каждому, предлагая онлайн-курсы от ведущих университетов и организаций.
© Coursera Inc., 2018 Все права защищены.
Loved the course!