Join for Free
Log In

艺术与人文
商务
计算机科学
数据科学
信息技术
健康
数学和逻辑
个人发展
物理科学与工程
社会科学
语言学习
學位
證書

瀏覽 Coursera 的全部課程

瀏覽
搜索
企業版
登錄
免費加入

Guided Practice with HTML Form Validation, Part 1

Loading...

Introduction to Web Development

加州大学戴维斯分校

4.6（478 個評分） | 47K 名學生已註冊

This course is designed to start you on a path toward future studies in web development and design, no matter how little experience or technical knowledge you currently have. The web is a very big place, and if you are the typical internet user, you probably visit several websites every day, whether for business, entertainment or education. But have you ever wondered how these websites actually work? How are they built? How do browsers, computers, and mobile devices interact with the web? What skills are necessary to build a website? With almost 1 billion websites now on the internet, the answers to these questions could be your first step toward a better understanding of the internet and developing a new set of internet skills. By the end of this course you’ll be able to describe the structure and functionality of the world wide web, create dynamic web pages using a combination of HTML, CSS, and JavaScript, apply essential programming language concepts when creating HTML forms, select an appropriate web hosting service, and publish your webpages for the world to see. Finally, you’ll be able to develop a working model for creating your own personal or business websites in the future and be fully prepared to take the next step in a more advanced web development or design course or specialization.

查看授課大綱

您將學習的技能

Css Code, Html, JavaScript, Cascading Style Sheets (CCS)

審閱

4.6（478 個評分）

5 stars
348 ratings
4 stars
99 ratings
3 stars
22 ratings
2 stars
3 ratings
1 star
6 ratings

MS

Feb 20, 2019

This course deals with all client side fundamentals of web development. It starts from teaching of HTML to javascript validation of HTML forms. Overall this course is a must for beginners.

RS

Jun 12, 2018

I am not new in coding, but in here I found something useful. I really recommend this course for new people, because it is very easy steps of how to make some coding or personal web page.

從本節課中

Creating Web Applications

In our final module, we're going to explore the basics of designing web applications - programming useful and dynamic webpages that allow our users to interact with them. By the end of this lesson you'll be able to: distinguish between client and server-side development; apply advanced JavaScript programming skills to create logic with selection and iteration; create new features for applications; create more advanced HTML forms; and practice and learn additional troubleshooting and problem-solving techniques. The module wraps with a final peer review activity that will draw upon all of the skills you've learned in this course.

Module 6 Introduction1:42

Client-side versus Server-side Application Development4:28

Features in Web Applications: The While Loop5:16

Features in Web Applications: The For Loop5:02

Creating New Features in Web Applications3:37

Guided Practice with HTML Form Validation, Part 15:42

Guided Practice with HTML Form Validation, Part 27:44

教學方

Daniel Randall
Senior Architect at Composer Solutions and Instructor

腳本

[MUSIC]

Hi and welcome to the lesson.

Last time, we talked about an approach for creating new features in web applications.

And in this lesson, we'll be doing some guided practice for

the development of your HTML forms with validation.

This practice should be helpful while you're working on your project for

this course.

So the first thing I think you should do

is spend a little time thinking about what kind of form you want to create.

You can look at forms on the internet but I recommend

considering both how you want the form to look and what it's purpose will be.

For instance, will it be a customer service form,

will it be a form that's specific to some business.

Will it be an order form for ordering a product?

Will it be a form for submitting a recipe online?

There are many possibilities for your form, so give us some thought.

Next, I recommend starting with a template that we looked at a few different

templates in this class.

And you can use any of those or you can use one that you developed along the way.

But it's usually a good idea to avoid

coding the parts of your form from scratch each time.

Now early on it may be good practice, but

eventually we begin to make typos and things that we really do know how to do.

So the typos just slow us down and we weren't learning anything new.

So starting with a template of sorts to save yourself some typing and

mistakes is a good idea.

So here I have a page that we've worked with before at least a version of it.

And I have my HTML tag, my head tag,

I have a title, I have on line 7 a link from my CSS.

On line is not within 13.

I have my script tags and I have a pretty good idea that these are working.

This will save you time if you aren't doing it already,

you should give us a try.

Now because I know I want to go to form, I have form text.

And I have more elements that I really need

from our previous example, and here it is.

So, you could start with something like this if you had it available and

merely add and delete as needed.

The advantage here is that the quotes are in the right places.

You have some of your events ready made.

You'll get a little reminders on the syntax based on what you've done before.

So start with something like this and get all the elements of your form in place.

Now, if you miss one or change your mind at some point of course you can make

one of occasions but I recommend you work methodically on this and

get your form elements all into place.

Next I recommend that you work on your CSS.

Now we talked about in a previous lesson how

it's a good idea to give just a very basic version of your CSS working so

that you know your file is connected properly for your project.

So here we have basic.css, it has just a few items,

it colors the page its style is H1 and gives a test class.

You can do this or even at lest just to get it working initially.

And as we can see here, it is working properly.

At each point make sure it works.

Now, this word has come up brings us to another point.

And that's to ones you have your

script syntax in place put a little bit of JavaScript something that's going to be

visible to you in place to make sure this is working.

So for instance this tells you that there isn't some typo in your tags at each

step you want to find a way to test it.

So, notice that I tested styles I verify that I could see the elements of my form.

I tested, the JavaScript is working, do each one of these things in turn and

get it working to your satisfaction before you move on to the next point.

And avoid the temptation to do too much at once,

changing too many elements before you're able to save the file and test.

Save regularly and test regularly.

This will save you a lot of time because you'll know when something stops working

that it was a change you made in the last few moments that is probably the culprit.

If you instead work for 30 minutes or even 60 minutes,

between tests and your form no longer works.

You'll have a difficult time knowing what exactly you did that

made it stop working or worked differently than it did before.

So this is all previous lessons we'll continue with the same guided practice and

add our JavaScript functions for validation in the next lesson.

探索我們的目錄

免費加入並獲得個性化推薦、更新和優惠。

Coursera 致力於普及全世界最好的教育，它與全球一流大學和機構合作提供在線課程。

© 2019 Coursera Inc. 保留所有權利。

通過 App Store 下載

通過 Google Play 獲取

Coursera
關於
管理團隊
工作機會
目錄
證書
MasterTrack™ 證書
學位
企業版
政府版

社區
Learners
Partners
Developers
Beta Testers
Translators

連接
博客
Facebook
領英
Twitter
Instagram
YouTube
技術博客

更多
條款
隱私
幫助
內容訪問
媒體
聯繫我們
目錄
附屬公司