WebFund 2016W Lecture 10: Difference between revisions

From Soma-notes
Created page with "==Video== The video from the lecture given on February 9, 2016 [http://homeostasis.scs.carleton.ca/~soma/webfund-2016w/lectures/comp2406-2016w-lec10-09Feb2016.mp4 is now avai..."
 
LeeCroft (talk | contribs)
No edit summary
 
Line 2: Line 2:


The video from the lecture given on February 9, 2016 [http://homeostasis.scs.carleton.ca/~soma/webfund-2016w/lectures/comp2406-2016w-lec10-09Feb2016.mp4 is now available].
The video from the lecture given on February 9, 2016 [http://homeostasis.scs.carleton.ca/~soma/webfund-2016w/lectures/comp2406-2016w-lec10-09Feb2016.mp4 is now available].
==Student Notes==
===Assignment 3 Solutions===
*Solutions to the assignment questions have been posted on the [assignment 3 page http://homeostasis.scs.carleton.ca/wiki/index.php/WebFund_2016W:_Assignment_3]
*Below is a review of these solutions
====Q1====
*What is the type of:
**<code>line</code>: lines may be classified as an object but more specifically it is an array
**<code>rawContents</code>: rawContents is of type string
**<code>split()</code>: is a function. It is also acceptable to say that it is a method
====Q2====
*Line 24 should be printed first
*Since JavaScript is single threaded there is a high guarantee it is printed first since the program runs asynchronously
*In general, you can consider the program to do all of its main sequential work first and to then check for callback functions from asynchronous calls that must be run
====Q3====
*A one line change would be adding a line at line 42 by setting <code>status = 404;</code>
*We can also change the docroot but it's an unsafe way
====Q4====
*Just before line 92 we can add another if statement
*We check to see if the user-agent headers exists and whether it contains iPhone as a substring
**If the condition is met, we respond with 403
====Q5====
=====A=====
*By commenting out this line, <code>app</code> will no longer be defined
*Anything referencing app will produce a reference error so the program crashes on the first line that uses app
======Important Point======
*What is the difference between JavaScript's <code>require</code> and C's <code>include</code>?
**In C <code>include</code> looks similar to a <code>require</code> but in reality it’s a very different mechanism.
**The <code>include</code> in C pre-processes the included file to put all of its code into the file that included it
***Symbols are thus defined for us but there is no visible code! We cant tell what kind of symbols include has brought in
**In JavaScript the file we require is pure JavaScript code!
***The required script will run and put some value into its module.exports which is then returned via the require call
***We know what symbol we are working with because we assign the return value of the require call ourselves
=====B=====
*Setting var port = 3000;
*It works perfectly fine but we can no longer change the port using the PORT environment variable
=====C=====
*Since we change the directory, it can no longer find “views”
*This means that the server will not be able to find any templates to render
=====D=====
*Commenting out line 24
*We are no longer exporting anything from the file
*Any calls to require the file will not get an expected return value from the require call and so the server will not work properly
=====E=====
*This line acts as a placeholder for child templates to put content into the body of this template
*By removing it, the child templates have nowhere to put the content in the body
=====F=====
*When we indent the code in this way, the submit button is no longer a part of the form
*The button will therefore not cause the form to be submitted
*Essentially, the button no longer does anything
===Possible questions for the Midterm===
*What is the purpose of app.post? What if <code>app.post(‘/add’, ...)</code> were be changed to <code>app.get('/add', ...)</code>?
**Answer: The server will no longer know how to deal with any incoming POST requests for /add so it will not properly handle the form submission
***Instead, the server could handle an incoming GET request for the form submission (but there are some other problems that would need to be fixed for parsing the incoming data)
*How can we keep it a get and still make it work?
**Answer: Change the method in the form from method “post” to “get”
***POST requests have the form data in their body whereas a GET request stores it in a query strings
***So we can change <code>req.body</code> to <code>req.query</code> in the routing function to access the data properly
<br>
*What is <code>app.use()</code>?
**What happens when we comment out the line <code>app.use( ‘logger'..)</code>?
***The server no longer logs incoming request to the console
**What if we comment out <code>app.use(body.parser...)</code>?
***The program would crash because it wouldn’t be able to find <code>req.body</code> since the body of the request has no been parsed
**What is the purpose of <code>app.use(express.static...)</code>?
***Its tells the server to use a static web server to serve basic webpages and other static resources
*So <code>app.use()</code> is telling the server to use a given module to do something with the incoming requests

Latest revision as of 15:29, 10 February 2016

Video

The video from the lecture given on February 9, 2016 is now available.

Student Notes

Assignment 3 Solutions

Q1

  • What is the type of:
    • line: lines may be classified as an object but more specifically it is an array
    • rawContents: rawContents is of type string
    • split(): is a function. It is also acceptable to say that it is a method

Q2

  • Line 24 should be printed first
  • Since JavaScript is single threaded there is a high guarantee it is printed first since the program runs asynchronously
  • In general, you can consider the program to do all of its main sequential work first and to then check for callback functions from asynchronous calls that must be run

Q3

  • A one line change would be adding a line at line 42 by setting status = 404;
  • We can also change the docroot but it's an unsafe way

Q4

  • Just before line 92 we can add another if statement
  • We check to see if the user-agent headers exists and whether it contains iPhone as a substring
    • If the condition is met, we respond with 403

Q5

A
  • By commenting out this line, app will no longer be defined
  • Anything referencing app will produce a reference error so the program crashes on the first line that uses app
Important Point
  • What is the difference between JavaScript's require and C's include?
    • In C include looks similar to a require but in reality it’s a very different mechanism.
    • The include in C pre-processes the included file to put all of its code into the file that included it
      • Symbols are thus defined for us but there is no visible code! We cant tell what kind of symbols include has brought in
    • In JavaScript the file we require is pure JavaScript code!
      • The required script will run and put some value into its module.exports which is then returned via the require call
      • We know what symbol we are working with because we assign the return value of the require call ourselves
B
  • Setting var port = 3000;
  • It works perfectly fine but we can no longer change the port using the PORT environment variable
C
  • Since we change the directory, it can no longer find “views”
  • This means that the server will not be able to find any templates to render
D
  • Commenting out line 24
  • We are no longer exporting anything from the file
  • Any calls to require the file will not get an expected return value from the require call and so the server will not work properly
E
  • This line acts as a placeholder for child templates to put content into the body of this template
  • By removing it, the child templates have nowhere to put the content in the body
F
  • When we indent the code in this way, the submit button is no longer a part of the form
  • The button will therefore not cause the form to be submitted
  • Essentially, the button no longer does anything


Possible questions for the Midterm

  • What is the purpose of app.post? What if app.post(‘/add’, ...) were be changed to app.get('/add', ...)?
    • Answer: The server will no longer know how to deal with any incoming POST requests for /add so it will not properly handle the form submission
      • Instead, the server could handle an incoming GET request for the form submission (but there are some other problems that would need to be fixed for parsing the incoming data)
  • How can we keep it a get and still make it work?
    • Answer: Change the method in the form from method “post” to “get”
      • POST requests have the form data in their body whereas a GET request stores it in a query strings
      • So we can change req.body to req.query in the routing function to access the data properly


  • What is app.use()?
    • What happens when we comment out the line app.use( ‘logger'..)?
      • The server no longer logs incoming request to the console
    • What if we comment out app.use(body.parser...)?
      • The program would crash because it wouldn’t be able to find req.body since the body of the request has no been parsed
    • What is the purpose of app.use(express.static...)?
      • Its tells the server to use a static web server to serve basic webpages and other static resources
  • So app.use() is telling the server to use a given module to do something with the incoming requests