LeeCroft at 19:51, 24 January 2016

2016-01-24T19:51:22Z

← Older revision		Revision as of 19:51, 24 January 2016
Line 23:		Line 23:
	</html>		</html>
	</source>		</source>

			===Student Notes===
			====Assignment 1====
			NOTE: The solutions for assignment 1 are posted on the wiki

			*In the async version "Finished" should be output using a callback function for <code>wrtieFile()</code> so that it only runs when the work is truly complete
			**Note that writing <code>fs.writeFile('output.txt', data, console.log('Finished'));</code> will not use the <code>console.log()</code> as a callback. Instead, this passes the return value of the <code>console.log()</code>, which is undefined, as the callback.
			*If you want something to happen after a specific function you have to use a callback
			*Values given to the arguments of callback functions come from the function that calls the callback, in other words, the function to which the callback was passed as an argument
			*To find out what the specific arguments for a given callback are you can check the documentation for that function
			*Always cite any sources you use!!
			*Don't use fancy things that you don't understand while coding. It is a bad habit and can lead to errors that you won't know how to solve
			*There might be a midterm question about the <code>filter()</code> method

			====Quick Talk About Functions====
			*Functions can be written in different ways
			<code>function theFunction(a,b){...}</code>

			<code>function(err, param){...}</code> --> anonymous function

			<code>var theFunction = function(a,b){...}</code> --> this syntax is a reminder that functions are just objects
			*Anonymous functions are useful for one time use
			*You can make your own callback functions

			====Forms====
			What is a form used for?
			*A form is used when you want to send information to the server
			*The HTML syntax for a from is simply
			<code><pre>
			<form action="someAction" method="GET or POST">
			What is your name? <input type="text" name="theName"/>
			<input type="submit" value="Done!"/>
			</form>
			</pre></code>

			*A form has a method attribute and an action attribute
			**The method is used to specify the type of HTTP request that will be sent when the form is submitted (usually either a POST or a GET)
			***POST is used to send data to the server
			***GET is used to ask the server for data
			**The action is similar to a path on the server where the request is sent
			*Tinywebserver.js can't handle data being sent to it (can't handle POST)
			*Tinywebserver.js can currently only handle GET requests
			**There is no code in it that can process POST requests
			**Only processes files
			*A form also has nested input tags
			**A self closing tag (<code><input ... /></code>) can be used when there is no content that would appear between the opening and closing tags
			**An input tag (of type text) displays an input field that the user can use to enter data
			**For example, after the question "What is your name?" there is an input tag, which is being used to display an input field
			**The second input tag, <code><input type="submit"...></code>, is used to display a button that will submit the data to the server
			**The 'name' attribute of the input tag identifies the name of the input
			***This becomes part of the URL (when the method is GET) and is paired with the data that was entered in the input field
			***The name of the field gets sent to the server along with the value
			***Ideally we don't want this to all be in the URL
			****By using a POST request instead, the data is stored elsewhere in the request when it is sent to the server
			****You can see what is sent by using the developer tools on your browser and looking under 'Params'
			*We need code in the Web server to handle forms
			*The first way to process forms was by using Perl
			**The problem with Perl is that it's not efficient
			**Need to run Perl for every incoming request
			**Solution was to run Perl continuously and integrate it into the server
			*Then PHP was used
			**People liked PHP in the beginning because it was integrated with HTML
			***PHP allowed for programmatic parts to be added to HTML documents
			**A lot of the modern Web uses PHP (Facebook, Wordpress)
			***They have separate files that are just PHP, it is not embedded in the webpage.
			*Why is PHP not a good thing?
			**It is messy because there is code mixed in with the document
			*The modern solution is to separate the code and the HTML by leaving place holders in the document

			====Jade====
			*Has PHP-like functionality
			*This is a template engine that we will be using in class
			*It uses HTML and its own embedded programming language
			*Instead of nesting Jade uses indentation
			*Instead of start and end tags Jade has only starts tags and without angle brackets
			*The server runs the Jade code
			*The browser only sees HTML
			*Anything that can be done in HTML can be done in Jade

			====Express====
			*This is a Web application framework we will be using in class
			*This is useful because we won't have to work from scratch
			*Node.js is the platform that Express runs on

Soma: /* formtest.html */

2016-01-22T18:02:43Z

formtest.html

← Older revision		Revision as of 18:02, 22 January 2016
Line 7:		Line 7:
	===formtest.html===		===formtest.html===

	<source lang="~~html~~">		<source lang="html4strict">
	<html>		<html>
	<head>		<head>

Soma: Created page with "==Video== The video from the lecture given on January 21, 2016 [http://homeostasis.scs.carleton.ca/~soma/webfund-2016w/lectures/comp2406-2016w-lec05-21Jan2016.mp4 is now avai..."

2016-01-22T18:02:31Z

Created page with "==Video== The video from the lecture given on January 21, 2016 [http://homeostasis.scs.carleton.ca/~soma/webfund-2016w/lectures/comp2406-2016w-lec05-21Jan2016.mp4 is now avai..."

New page

==Video==

The video from the lecture given on January 21, 2016 [http://homeostasis.scs.carleton.ca/~soma/webfund-2016w/lectures/comp2406-2016w-lec05-21Jan2016.mp4 is now available].

==Notes==

===formtest.html===

<source lang="html">
<html>
<head>
<title>A simple web page</title>
</head>
<body>
<h1>A SIMPLE WEB PAGE (really)</h1>
<p>It isn't so bad.</p>
<form action="useName" method="POST">
What is your name?
<input name="theName" type="text"></input>
<input type="submit"value="Done!" />
</form>
</body>
</html>
</source>

WebFund 2016W Lecture 5 - Revision history

LeeCroft at 19:51, 24 January 2016

Soma: /* formtest.html */

Soma: Created page with "==Video== The video from the lecture given on January 21, 2016 [http://homeostasis.scs.carleton.ca/~soma/webfund-2016w/lectures/comp2406-2016w-lec05-21Jan2016.mp4 is now avai..."