Buying for a Team? Gift This Course
Wishlisted Wishlist

Please confirm that you want to add Web Application Development - Learn by Building 3 Web Apps to your Wishlist.

Add to Wishlist

Web Application Development - Learn by Building 3 Web Apps

Use the power of HTML5 and jQuery to develop 3 Latest Web Apps! It's a pathway to Game Development and User Interfaces !
3.7 (16 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
1,688 students enrolled
Created by Akshay Nagpal
Last updated 12/2016
$10 $30 67% off
5 days left at this price!
30-Day Money-Back Guarantee
  • 1 hour on-demand video
  • 5 Articles
  • 4 Supplemental Resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Have a coupon?

A Certificate of Completion will be sent to all students after completing this course.

The world is filled with developers who know multiple web programming languages but haven't applied them anywhere. Just knowing the syntax does not matter.

What matters is TO APPLY that knowledge to build something. Easy or tough doesn't matter, you should just make something out of your knowledge.

"Web Application Development - Learn by Building 3 Web Apps" will make you LEARN HTML5 and jQuery and also APPLY them to make 3 amazing Web Applications! All this in just 90 Minutes! So what are you waiting for?

This course will teach you the most frequently used functions and techniques of HTML5 and jQuery and by the end of the course you will be having your own :

1. Animated keyboard controllable snake game.

2. A magnifier application which is used in major E-commerce stores like Ebay and Amazon.

3. An interactive web form with progress bar.

The course includes :

  1. Explanatory in-depth Videos.
  2. Presentations.
  3. Source code files of all the programs discussed and projects made.
  4. Supplementary Material for better understanding
  5. Quizzes at the end of section to revise and know how much you have learnt.
  6. Complete support material for all technical problems

Course Structure :

The course is divided into 7 sections given below:

  1. Course Summary and Supplementary Material

  2. New Features of HTML5

  3. jQuery Fundamentals

  4. Application 1: Making a web form with progress bar

  5. Application 2: Making the Magnifier Application

  6. Application 3: Making the Snake Game

  7. Bonus Lectures

Why take this Course :

After completing this course you will be able to

  1. Master most used functions of HTML 5 and j-Query.
  2. Make your own 2-D games.
  3. Make interactive websites with increased functionality.
  4. Design better User Interfaces
  5. Increase your grasping of web development technologies.

Course Requirements:

  1. Google Chrome (or any other modern web browser)
  2. Sublime Text Editor or any other text editor.
Who is the target audience?
  • School or College students.
  • Web Developers
  • Freelancers
  • User Interface Designers
  • Entrepreneurs
  • Anyone who wants to learn.
Students Who Viewed This Course Also Viewed
What Will I Learn?
Learn Basic and Advanced Level jQuery
Learn the new concepts introduced by HTML5
Make a snake game from jQuery and HTML5
Make a Magnifier Application for E-commerce websites
Make an Interactive Web form with Progress bar
View Curriculum
  • Basic knowledge of HTML, CSS will be helpful
  • Google Chrome (or any other modern web browser)
  • Sublime Text Editor ( or any other text editor.
Curriculum For This Course
Expand All 29 Lectures Collapse All 29 Lectures 01:27:32
Course Summary and Supplementary Material
3 Lectures 02:47

This is the promo video for the lecture.

Preview 02:47

Must read for all your doubts. Questions are added regularly as per student suggestions and requirements.

Preview 5 pages

This tells about the software needed to proceed with the course.

Preview 1 page
New Features of HTML5
6 Lectures 08:51

A brief account of the history and aims of HTML5.

Preview 00:34

Explains the initial DOCTYPE declaration of HTML5 so that browsers can detect it.

Preview 00:20

This lecture explains the canvas element which is used for drawing and animation in HTML5.

Preview 03:24

New element datalist which has improved the select element.

Preview 01:23

Using HTML5 Input Types to Enhance The User Experience on Mobile

Preview 2 pages

In this lecture you will learn how to make a feedback meter to give feedback from 1 to 10.

Live Coding: Range Input Type

HTML5 Quiz!
3 questions
jQuery Fundamentals
6 Lectures 21:07

In this lecture you will learn about the basic syntax of jQuery and how to include it in your HTML page.You will also learn about loading jQuery at the correct time to avoid any errors.

Getting Started with jQuery

jQuery selectors are used to "find" (or select) HTML elements based on their id, classes, types, attributes, values of attributes and much more. It's based on the existing CSS Selectors, and in addition, it has some own custom selectors.

Selectors and Events in jQuery

With jQuery, you can hide and show HTML elements with the hide() and show() methods.

Effect 1: Show / Hide

With jQuery you can fade elements in and out of visibility.

Effect 2: Fading

The jQuery slide methods slides elements up and down.

Effect 3: Sliding

The jQuery animate() method lets you create custom animations.

Basics of Animation

jQuery Quiz!
3 questions
Application 1: Making a web form with progress bar
3 Lectures 14:05

In this lecture we will create a simple yet attractive web form with user validation.

Designing the Form using HTML5

In this lecture we will connect the form to the progress bar so that it shows the progress in percentage when the user fills the form.

Linking the Progress Bar with User Input using jQuery

Progress Form Source Code
Application 2: Making the Magnifier Application
4 Lectures 08:37

In this lecture we will create the canvas and then draw the image and magnifier on it.

Initialising the Image and Magnifier

In this lecture we will toggle the visibility of the magnifier according to the image size.

Toggle Visibility of the Magnifier

In this lecture we will give motion to the magnifier and it will move with the cursor.

Making the Magnifier move with Cursor

Magnifier Source Code
Application 3: Making the Snake Game
6 Lectures 14:59

Learn how to make an animated and keyboard controllable snake game with rules and score.

It also has start and game over screens.

About the Snake Game

We will draw the game region and snake using canvas function and jQuery.

Making the Snake and Game Area

We will design game rules for

1.Making the snake eat food.

2.Increasing the score

3.Game over conditions

Designing Game Rules

We will make the snake controlled by arrow keys on the keyboard.

Making the Snake Keyboard Controllable

Contains source code of the snake game.

Snake Source Code

You did it!
Bonus Lectures
1 Lecture 00:00

This lecture will cover the following features of HTML5.

  1. Geolocation API
  2. Drag and Drop
  3. HTML5 Web Storage
  4. HTML5 Web Worker
  5. HTML5 Audio
  6. HTML5 Video

Some More features of HTML5...
9 pages
About the Instructor
3.7 Average rating
16 Reviews
1,688 Students
1 Course
Software and Web App Developer

Akshay Nagpal is a Computer Scientist having a keen interest in web development, Search Engine Optimization, Blogging and Wordpress. He's been actively developing projects in C, C++, Java, HTML5, CSS3,Javascript ,Jquery, PHP & MySQL since 2010.

He loves open source projects and you can view his Github Profile.

He works as a professional Web Designer for college websites and events. He also teaches and encourages people to start web development.You can follow him on Twitter to know more!

Report Abuse