Introduction
to
Programming

WWW

World Wide Web is an information system that supports specially formatted documents and it provides the path to connect to content anywhere in the world.

HTML

Hypertext Markup Language is the “hidden”code that helps us communicate with others on the World Wide Web.

Browser

Browser is a software (Internet Explorer, Firefox etc.) used to access the Internet.

Servers

Servers are computers that provide data to other computers HTML Markups and Tags.

Tags

Void Tags

Void Tags don’t require a closing tag. Examples include:

Elements

An HTML Element is everything from the opening tag to the closing tag.

Attributes

HTML links are defined with the tag. The link address is specified in the "href" attribute. To find out more about the href attribut go to this link.

Inline and Block Elements

The div element is a block-level element. A block-level element creates an “invisible box” around the content enclosed within the opening and closing tags (<p>, <div>).
The span element is an inline element that allows you to separate things from other elements around them within a document and it does not cause a line break (<b>, <em>, <img>, <br>, <span>).

HTML, CSS and Java are all languages.
HTML is responsible for the structure of the webpage.
CSS controls how the webpage looks (style) and Java referrs to the interactive components of the webpage.

HTML vs CSS

HTML is the language for building webpages. This language has a specific syntax and specific rules. The basic word in html is "tag" and the internet browser turns these tags into elements that form a tree. CSS (Cascading Style Sheets) allows to use specific syntax and rules to change how the elements look on the page.

DOM

DOM (Document Object Model) is how the browser interprets the HTML files. DOM translates the elements in HTLM text document into elements in tree-like structure.

Boxes

Webpages are simply seen as boxen inside other boxes. Boxes consist of title, content and style.The content can consist of images, headers, text as well as other elements.

Text Editors

Avoiding Repetition

When using CSS, one of the most common errors that web designers come across is the repetition. Using a lot of repetition can lead the programmer to make a lot of errors.

CSS

CSS (Cascading Style Sheets) is a code written to control the “style” of HTML elements. There are several CSS files or sheets that will be referenced in HTML. Cascading means that the most specific rule will be applied to every element.

Inheritance is a key feature in CSS and it relies on the ancestor-descendant relationship to operate. Click on the link to read a more detailed description of Inheritance.

Box Sizing and Positioning

All HTML elements can be considered as boxes. In CSS, the term "box model" is used when talking about design and layout.
The Box consist of 4 elements: Considering that there are so many elements to each box and so many boxes in an HTML document, it could be difficult sometimes to size and position the box just right. There are two ways to deal with Box Sizing. One way is to use percentage as opposed to pixels to set the size of the box and the second way is to utilize the box sizing border`s box attribute. When it comes to Box Positioning, DIV is known as block-level element and it takes up the whole space. You can think of it as a whole block that prevents other elements to share the same space. Adding the rule "display: flex;" to the appropriate CSS will override the behavior and let DIVs appear next to each other.

Computer Sience

Computer Science is about how to solve problems like building a search engine, by breaking it into smaller pieces and precisely and mechanically describing a sequence of steps, that you can use to solve each piece. Those steps can be executed by the computer. A lot of machines (like a toaster) are designed to do few things. These machines will be able to do only these few things, unless you alter them physically. Computers are different. We can program computers to do anything we want, as long as we are able to write a program that specifies a specific sequence of instructions.

Computer Program

A computer Program is a list of instructions that tells the computer what to do. The Program has to be a very precise sequence of steps. The power of the computer helps to execute these steps very fast. Programs are the core of computer programming and the computer is basically useless without them.

Python

Python is a high level computer language that we can use to write programs. Python is called an Interpreter, it runs the programs , interprets them and executes them. Python emphasizes code readability.

Computer Language

A Computer Language is a language that is designed to communicate instructions to a computer. The “Normal” language can not be used in programming, because it is ambiguous and verbose. Programming language has a grammar just like the human language. A grammar specifies what is “correct” and what is “incorrect”. The main difference between these two types of grammar is that the program’s grammar is not forgiving any mistakes, whereas you can still easily understand a spoken language with few mistakes.
An example of Computer Language is the Backus-Naur Form. John Backus was the lead designer of Fortran Programming Language (1950’s). The purpose of BNF is to be able to precisely describe exactly the language in a way that it is very simple and very precise.

Python Expressions

In Python an “expression” is a statement that tells the computer to perform a specific function. In Python the coding must match the language grammar exactly. It will fail if it is not written correctly.
For example:

print 2 * 2 + 6 is a valid expression
print 2 * 2 + is not a valid expression

Difference between 1 and 1.0 in Python

If you are getting 0 when running your code, try changing the values to decimals.
When you divide an integer by another integer, Python will do something called an integer division, where it ignores the decimal part of the answer.
For example, 3/2 will give you 1instead of 1.5.

In order to force Python to give you an answer with the decimal, you will need to make one of the numbers into a decimal by putting a decimal point after it.
For example, 3/2.0 will give you 1.5.

As the name implies, a Variable is something that can change. Variable names in Python are case sensitive. Variables give programmers a way to assign names to values.
It is very useful to assign a value to a variable. This helps a lot when dealing with huge amount of confusing and meaningless numbers. We can assign the value 5 to the variable my_age by writing this code: my_age = 5. The value of the variable can be re-assign or changed into a different value at any point.
Variables can be useful to programmers in many ways because:

Strings

Strings are a sequence of characters surrounded by quotes that are encased either between opening single or double quote sign and ending single or double quote sign.

The Different Meaning of =

= means an assignment rather then an equal sign. You should think of it as an error, where you should put whatever value the right side evaluates to, into the name on the left side.

What is Function?

Functions take input, do something to it and then they produce output.

Difference between making and using functions

Function start with a keyword def and it is followed by the function parameters in parentheses. When the function is used, these parameters will be later replaced by actual values.
The following code could be the definition of a function called "square"
For example:

def square(n)
return n * n,
print square(5)
>>>25

How Functions Help to Avoid Repetition

When programmers create a function once, they never have to define it again and they can reuse it forever.

What if a Function doesn’t have a return statement?

The return tells Python what function it should produce as an output. If a function doesn't have the return statement, then there will be no output and nothing will happen.

Making Decisions

Python provides different operators that we can use in comparison, such as <, >, != (not equal to) and many more. These signs operate on numbers and any number can be used for comparison. We use == to compare and = means an assignment. The output is a Boolean number that is either True or False.
For example:

print 1<2
result True
print 2>1
>>>False

If and Else Statements

If statements are used in order to control which code will get executed when conditions are met and while loops are used to perform repetitive tasks.
For example:

def bigger(a,b):
if a>b:
return a
else:
return b

While Loops

While loop make code that performs the same task many times. It will keep going as long as the text expression is True and a False expression stops it. A loop that never ends is called an “infinite” loop.
For example:

def print_numbers(n):
i=1
while i<=n:
print i
i=i+1
print_numbers(3)
>>> 1,2,3

Breaktime!

The Break statement gives us a way to stop the loop if it is True.
For example:

def print_numbers(n): i=1
while True:
if i > n:
break
print i
i = i + 1

Debugging

Debugging is a way to locate and correct errors.
  1. Examine error messages when programs crash
    The last line of Python Tracebacks tells you what line it crashed on, what file it was running and how it got there.
  2. Work from example code
    After you modified your code and it still does not work, comment it out and do step-by-step modifications to the example code until it does what you want.
  3. Make sure examples work
    Check the example code that you are using in order to make sure that it works as you want it to.
  4. Check print intermediate results
    When your code does not crash, and yet doesn't work as you want it to, add print statements to your program to see where in the code things stop working correctly.
  5. Keep and compare old versions
    When you have a working version of your code, save it before you add anything to the code. This will give you something to go back to.

Nested Lists

Nested lists are elements that can be anything (characters, strings, numbers, other lists, etc.) and they can hold anything we want. Lists are more powerful than strings.
For example:

beatles = [[‘John’, 1940], [‘Paul', 1942], [‘George’, 1943], [‘Ringo’, 1940]]
print beatles

Mutation

Unlike strings, lists support mutation. Mutation means changing the value of an object so we can change the value of a list after we created it. All the other things that we have seen so far (numbers, strings and tuples) are immutable so their contents cannot be changed.

Aliasing

Aliasing can be thought of as two names that refer to the same object. Aliasing is very useful but at the same time it is also very confusing. Any changes made to the state of one object will affect the state of the object for all names that refer to that object.

List Operations

There are many build-in operations on lists and some of them include:

Loops on Lists

For loop is the second type of loop that is frequently seen in Python. The loop goes through each element of the list in turn, assigning that element to the <name> and evaluating the <block>.

for <name> in <list>:
<block>

For example:

def print_all_elements(p):
for e in p:
print e

Index

Index is another way to define find_element and it is a build-in list operation that makes it easier to write find_element.
The index method is invoked on a list by passing in a value, and the output will be the first position where that value sits in the list, otherwise it will produce an error message.

<list>.index(<value>) -> <position> or error

For example:

p = [0,1,2]
print 3 in p
>>>False print 1 in p
True

How to Solve Problems

Object Oriented Programming

Object Oriented Programming (OOP) does not only structures programs in a better way, but it also helps structure the programming tasks. As programs become bigger and more complicated, the problem of managing the programs also increase. Object-Oriented approach offers ways of dealing with this complexity, not just in design, but also in the organization of the work. It helps with things such as collaboration, design, separating the interface from the implementation, keeping the interface simple, dividing the work into modules, reusing tested codes, inheriting generic code, and making decisions dynamically.

Modules allow to organize the python code. Grouping related code into a module helps in making the code easier to understand as well as to use. In Python a Module is an object with arbitrarily named attributes that you can bind. Simply put, a Module is a file consiting of Python code, that can be defined as functions, classes and variables.

There are many reasons as to why Object-Oriented Programming is important:

OOP Vocabulary

Network

A Network is a group of entities (computers, people, organizations) that can communicate, even though they are not all directly connected. There has to be at least 3 entities involved to call it a network and there hast to be a way for them to communicate, even though they are not directly connected.

Latency and Bandwith

Two main ways to measure a network are called latency and bandwidth.

Latency is the time that it takes for a message to get from the source to the destination. It is measured in seconds and for a fast network today it is measured more often in miliseconds.

Bandwidth is a measure of the amount of information that we can send and we are measuring the number of bits. In order to measure bandwidth, we need to know how many bits can we send per second. You can click on this link to go to one of the websites that allows you to measure the bandwidth that you are getting over your Internet connection.

Bit

Protocol is a set rules that people agree to and that tell you how two entities can talk to each other. For the web, the protocol gives rules about how a client and a server talk to each other. The protocol says that if you want to get the server to do something (web server), the client (web browser) has to send a message in a particular way.

Hypertext Transfer Protocol (HTTP) is the protocol that we use on the web and when you look in your browser, you will see that almost all URLs start with HTTP. This means that the protocol that you should use to talk to the server, that you are requesting a document from, is the HTTP protocol.

Get message means that the client sends a message to the server. The message says get, and then the name of that object that you want to get. In the result, the server will find the requested file in some kind of library, then run some more code to get the result, and it will send back a response which is the contents of the requested object.

URL

Query Parameters

Query parameters are also known as get parameters. If a query string is used, it follows the path component, and provides a string of information that the resource can use for some purpose (for example, as parameters for search or as data to be processed). The query string is usually a string of name and value pairs.
The format of the query parameter looks like this:

http://example.com/foo?p=1&q=neat
A cache is something that stores data so that you don’t have to retrieve it later. It can be used to make data requests faster. For more information, this page has a good explanation.LINK!!!!!!!

Another piece of URL is called a fragment. A fragment is separated from the rest of the URL by a # sign. A fragment is generally used to reference a particular part of the page you are looking at. When a fragment is used in the URL, it is not sent to the server when you make a request.The fragment purely exists in the browser. When there are query parameters in the URL, the fragment follows the query parameters and it comes last.
Fragment
In order to make an internet connection, you need two things:
localhost

HTTP

HTTP is what the browser uses to talk to the Web servers. The request from the browser for the URL www.example.com/foo begins with a request line and it will look something like this:

Request line

HTTP Responses

A basic HTTP response looks very similar to the request. For a basic request GET/foo HTTP/1.1, the response will be HTTP/1.1 200 OK. Some of the common status codes include: There are two main classifications for the type of responses that a server will make:

Forms

Forms are all over the place on the internet. They are the text boxes, check boxes, radio buttons that basically allow websites to get information from users. On Udacity.com, every quiz that you submit is a form.

Within the form object, an input will add an input box to your site. There are several options that can be used with the <input>:

The Modulus Operator

The Modulus Operator is written with a % sign. It takes a number and it maps it to the range based on the remainder when you divide that number.
The syntax is as follows:

<number> % <modulus> -> remainder
In the modulus operation the second number is the limit that the first number is being divided by to see if there is a remainder.
For example:
15 % 12 is 3


If the second number is larger than the first the answer is the first number because there would be no remainder.
For example:

3 % 4 is 3

Dictionaries

Dictionaries are sets of key : value pairs in {} brackets. They are mutable.
d[k] where k is a key value associated with k in d. To replace the value of k to v: d[k] = v.
The syntax looks like this:

elements = { ‘hydrogen’: 1, ‘helium’: 2, ‘carbon’: 6 }

Google App Engine lets you build and run applications on Google’s infrastructure. App engine applications are easy to create , easy to maintain and easy to scale as you traffic, and data storage needs change. With App engine, there are no servers for you to maintain. You simply upload your application and it is ready to go.

Differences Between GET and POST

GET:

POST:

GET requests should be simple requests for fetching a document. GET parameters should be used to describe what document you are looking for. POST parameters are used for making updates to the server.

Validation

Validation means verifying on the server side that what we received is what we expected.
Web applications are vulnerable if you don't practice input validation. Validating user input could prevent application attacks such as buffer overflow, SQL injection and cross-site scripting. Proper validation of form data is important to protect your form from hackers and spammers!

Purposes of Data Validation:

Data validation can help to ensure that data stored is complete and that nothing is missing. For instance, ensuring that ‘required’ fields are indeed filled out by the user ensures that there won’t be gaps (or empty strings) in a database record, which may cause problems with the incomplete data is acted upon later, for instance to follow up with a customer.
Website link

Python is a very powerful programming language. It can use functions to take in user inputs, draw web pages with strings of HTML that are rendered right from the Python file, and store user data in the URL or via the use of hidden inputs. While all these varied functions seem like an ideal way to create web pages, it has limitations.

HTML embedded in code is messy and difficult to maintain. It's better to use a templating system, where the HTML is kept in a separate file with special syntax to indicate where the data from the application appears. Google App Engine includes the Django and Jinja2 templating engines. Using HTML templates allow programmers to avoid repetition, save time and make less mistakes.

Templates Inheritance

Most web pages have a title, a footer, and some content in the middle. You might have another page that has the same title, footer but a different content. to avoid the repetition of the code, you can create a base template that can be referenced by other templates to add common elements (header, footer). Instead of placing a header at the top of 6 HTML pages, you can create one file with the header and extend it to all the other files. All changes that need to be done to the header, can be done in one file and they would affect the other 5 HTML pages. Inversely, if the content needs to change daily, this can be done without effecting the Header file.

Benefits of Using Templates: Click on this LINK!!!!! to learn more about Jinja.

A database program is a type of computer software that is designed to handle lots of data, but to store them in such a way that finding (and thus retrieving) any snippet of data is more efficient than it would have been if you simply dumped them randomly all over the place. With such database software, if you (say) keep a list of customers and their shipping addresses, entering and retrieving information about your one millionth customer will not take much longer (if at all) than entering and retrieving information about your 1st customer.

Types of Databases

None of these databases is considered the best. They all are different and they all have their place in solving different types of problems. It is not uncommon for large websites to use multiple different database products.

SQL

SQL stands for Structured Query Language and it is a language for expressing queries. SQL was invented in the 1970’s, long before the internet, the web or web applications. SQL looks something like this:

SQL

Joins

Joins are a type of SQL query that involves multiple tables. A join query will look like this:

Joins

Indexes

An index is just like an index in a book. It increases the speed of queries and the speed of database reads. Indexes are very useful in making reads simpler. There is a maintenance cost to having them in, because you have to keep them up to date when updating the rest of your database. If you have multiple indexes in your table, each time you update the table, you also need to update each of the indexes. Indexes increase the speed of database reads but they decrease the speed of database inserts.

Indexes for Sorting

ACID stands for:

It is difficult to build a database that is fully atomic, consistent, isolated and durable. There are always trade offs involved.

Google App Engine

This is the database provided by App Engine. What you have been referring to as tables are known as entities in Datastore. They serve basically the same purpose, which is how you organize things of the same data type together.

Some important things about entities: