Learn to Code lessons Show All Sort By Views

What's the difference between graphic design and web development? In this lesson, learn about starting out as a web developer, or the person that makes a webpage, based on the designer's aesthetic. In this lesson, learn about building a web page in HTML using Sublime Text, get comfortable with tags, and learn how to apply attributes. And all of this work is done in free software! Give this lesson a try and learn the basics of web development!


Assignment:
13:31
14
9
2
2
2 of 3

Now that you are familiar with basic commands in jQuery, keep developing your skills and learn how to do event binding in this lesson! Events happen whenever a user clicks, hovers, drags, types, or does pretty much anything to interact with an HTML element. Learn about using jQuery to easily write a program to listen to these JavaScript events and modify the webpage in real time to create a professional-looking dynamic website!


Assignment:
6:34
83
69
5
9

Now that you have written the basic HTML structure for your website, in this lesson, learn how to style your page! Learn how to write CSS (Cascading Stylesheet) syntax, and learn the use this syntax to create a stylesheet to apply to the page. Learn to define basic features for your website, including color, position and decorative details. Finally, learn about using classes and Ids to create primary and secondary features to the sheet.


Assignment:
15:32
5
6
0
1
20 of 24

The CSS display property is a simple, useful tool for maximizing flexibility and responsiveness between web page elements. Even the simplest page can have multiple containers, such as divs and spans, that play by different display rules. Learn to Program covers the essential display values and how containers react to them in this valuable lesson.


Assignment:
9:42
6
59
0
0
3 of 3

It’s time to start DRYing up your javascript code! What does that mean? Don’t repeat yourself! In this lesson, learn how to DRY out your code in jQuery by making the existing 20 lines of code into 4 lines of code! And the best part is that the shorter code is better code! Learn how to do this by selecting HTML elements using classname and getting a custom HTML5 attribute value with jQuery.


Assignment:
6:43
42
50
1
2

It’s time to refine the style of your website! You started the CSS style sheet, but what should you do if you want to create columns? How about adding a footer? In this lesson, learn how to build these webpage elements with CSS syntax! Learn about adding a footer, header, padding text, and adding a border. Review how to effectively use semantic tags, and adjust the alignment of text with CSS display elements.


Assignment:
20:54
7
3
0
0
22 of 24

When all else fails, elements on a web page can be floated using CSS—that is, removed from the normal flow of content. Floating is a great alternative to tools such as absolute and fixed positioning; however, it has some quirks. In this lesson, Learn to Program gives you the lowdown on when to use float, how it works, and what oddities you can expect to encounter.


Assignment:
14:57
6
59
0
0
12 of 21

Elif statements allow you to stretch your data comparisons into infinity! Sandwiched between if and else statements, elifs allow you to check for multiple conditions, provided that the if statement’s condition is not met. Once you have mastered if, else and elif statements with this tutorial by Learn to Program, you will be on your way to making useful, flexible Python code.


Assignment:
2:49
22
173
0
0
17 of 24

Transforms allow you to manipulate elements in three dimensions. Dive into one of the most groundbreaking features of CSS3 in the second installment of this two-part lesson, which introduces you to 3D concepts such as perspective. Learn also how to provide maximum browser support for transform modules that are still in development - to help ensure that your elements look consistent across Firefox, Chrome, Safari, Internet Explorer, and other browsers.


Assignment:
9:24
4
59
0
0

If you are an HTML scripting enthusiast, and you use JavaScript, try this lesson to make your work easier! In this introductory jQuery lesson for beginners, learn how to get jQuery on your page and get up-to-speed with basic jQuery commands. Even beginners to JavaScript can write jQuery within minutes! It's also the most universally used JavaScript library in the world, so odds are your next employer will be using it. In this lesson, learn about showing and hiding, fading, and sliding.


Assignment:
7:49
66
89
2
2
16 of 19

Does your program need to interact with real world people? If so, learn how to work with strings—one of the most important objects in JavaScript! In this lesson from Learn to Program, discover string methods, regular expressions, and the relationship between strings and characters. Mark demonstrates how to use the length property, charAt, charCodeAt, indexOf, replace and split methods. With this knowledge you’ll be working with real world data in no time!


Assignment:
12:15
13
130
0
0
12 of 24

The box model is essential to understanding your web page elements at a technical level. The content area, padding, borders, margins and outlines are all great CSS attributes to know about when creating organized pages with flexible content. This tutorial by Learn to Program—invaluable for later lessons—walks you through each component and its importance.


Assignment:
9:58
6
59
0
0
13 of 24

Once you’ve mastered the box model, it is time to get down to customizing each individual part. This tutorial by Learn to Program explores the content area (literally, the space that displays your HTML input) and how it behaves differently for text and image elements. You will also learn about the concept of overflow and its CSS values.


Assignment:
10:30
6
60
0
0
15 of 21

Having trouble with the concept of loops, or iterations, in Python? Generally speaking, a loop is a statement that runs through a set of data until its conditions no longer apply. One of the easiest types of loops to understand is the while loop. Watch this tutorial by Learn to Program, and you’ll be programming your own while loops in no time!


Assignment:
3:18
23
173
0
0
19 of 24

With the advent of CSS3, you don’t need to learn JavaScript to create capable animations for your web page. Using several new attributes, you will learn one of the most flexible, detail-oriented CSS tools out there. This lesson from Learn to Program covers key frames, iteration counts, timing functions, and other functions to create both simple and complex animations.


Assignment:
18:28
15
63
0
0
21 of 24

Once you have mastered the display property, add another layer of CSS wizardry with this lesson, which teaches you how to use positioning. Positioning allows you to define the point-of-reference with which your element’s placement is defined. Learn to Program discusses static, relative, absolute and fixed positioning as well as the four offset properties.


Assignment:
10:01
15
65
0
0

We use fonts every time we type, but do we really understand them? In this first in a series of typography lessons from Yes I'm a Designer, get an introduction to the wonderful world of fonts. You'll learn how to use InDesign to view the full range of glyphs in a font (beyond the characters you're used to seeing on your keyboard), discover how fonts are stored on your computer, and unravel the mystery of unicode.


Assignment:
5:15
675
760
7
25
24 of 24

With the rise of sophisticated web browsing on mobile devices, it is more important than ever to learn the basics of styling CSS for smaller screens. In this comprehensive lesson, Learn to Program shows you how to craft a website that adapts to mobile devices, desktops and everything in between. You will learn about media values, the meta tag and dinosaur protection, while gaining a sense of how mobile browsing is changing the future of web design.


Assignment:
22:17
95
79
1
2
23 of 24

Want to make your website mobile-friendly? You’ll need to create and test CSS that works for smaller and narrower Android or iPhone screens. Don’t worry: by installing and running a mobile device emulator, you can successfully test your mobile CSS code on any computer. Learn to Program walks you through the steps necessary to get your emulator testing CSS in no time. Note: you will need an emulator to follow along with the next video in this series.


Assignment:
7:11
12
61
0
1
Failed to load more lessons. Please try again.
Get started!
Save
Enroll Purchase Start -day FREE Trial Claim your
Enroll Purchase Start your FREE days Claim your

Please show this teacher your appreciation:

Leave comment
Love this lesson
Tip $1
Tip $2
Tip $5
500 characters left
Thank You
Thank you for your generosity!
No thanks
Continue
Whoops!
Your free trial of Curious+ has expired