Difference between revisions of "Mean Stack"

From CSE330 Wiki
Jump to navigationJump to search
(Created page with '__NOTOC__ Module 7 builds upon the JavaScript skills you learned in Module 6. == Reading == The following articles on the online class wiki textbook contain information that w…')
 
Line 11: Line 11:
 
== Individual Assignments ==
 
== Individual Assignments ==
  
−
=== Stock Ticker ===
+
=== Install Node.JS ===
 +
 
 +
Install Node.JS from Apt or Yum according to the instructions in the [[Node.JS]] guide.
 +
 
 +
=== Static File Server ===
 +
 
 +
The individual portion of Module 7 is short in order to give you enough time to complete the group portion.
 +
 
 +
# Copy the example code from the Node.JS guide into a file called ''static_server.js'' or something of that nature.  Save it on your EC2 instance (but not in a place that Apache can serve!).
 +
#: Ensure that you understand what the static file server script is doing… this might show up on a quiz!
 +
# Make a directory parallel to ''static_server.js'' named ''static''.
 +
# Change "<STATIC DIRECTORY NAME>" on line 11 of the static fileserver example code to reflect the name of the directory you just made.
 +
# Save the following files in your ''static'' directory:
 +
#* ''hello.txt'', a text file containing "Hello World"
 +
#* ''skyline.jpg'', an image file you can download from here: <span color="red">TODO</span>
 +
#* ''city.html'', an HTML document based on the [[HTML and CSS#Quick and Easy HTML Layout|Quick and Easy HTML Layout]] containing an image tag pointing to ''skyline.jpg''
 +
#* ''phpinfo.php'', a PHP file containing the phpinfo command that generates a diagnostic of the server:
 +
#: <source lang="php"><?php  phpinfo();  ?></source>
 +
# Boot up your Node.JS static fileserver and load all four of the files you created in step 4.
 +
#: Which ones work and which ones don't?  Why might this be the case?
  
 
== Group Project ==
 
== Group Project ==
Line 21: Line 40:
 
We will be grading the following aspects of your work.  There are 100 points total.
 
We will be grading the following aspects of your work.  There are 100 points total.
  
−
# '''Cloud Instance and Web Server (30 Points):'''
+
# '''Individual Portion (15 Points):'''
−
#* You can SSH into your instance using your own custom username (15 points)
+
#* Node.JS is installed on your EC2 instance (4 points)
−
#* Your custom username is able to perform SUDO commands (5 points)
+
#* The hello.txt, skyline.jpg, and city.html files all load successfully (3 points each)
−
#* The time zone is correct on your instance (5 points)
+
#* You can explain to the TA why phpinfo.php loads the way it does through Node.JS (2 points)
−
#* The UserDir Apache module is working (5 points)
+
 
−
# '''PHP Calculator (15 Points):'''
 
−
#* The calculator is able to perform all four functions (2 points each)
 
−
#* Each function is given as a radio button choice (4 points)
 
−
#* The calculator page passes the W3C HTML validator (3 points)
 
 
# '''File Sharing Site (40 Points):'''
 
# '''File Sharing Site (40 Points):'''
 
#* '''''File Management (15 Points):'''''
 
#* '''''File Management (15 Points):'''''

Revision as of 02:18, 11 April 2013

Module 7 builds upon the JavaScript skills you learned in Module 6.

Reading

The following articles on the online class wiki textbook contain information that will help you complete the assignments.

Individual Assignments

Install Node.JS

Install Node.JS from Apt or Yum according to the instructions in the Node.JS guide.

Static File Server

The individual portion of Module 7 is short in order to give you enough time to complete the group portion.

  1. Copy the example code from the Node.JS guide into a file called static_server.js or something of that nature. Save it on your EC2 instance (but not in a place that Apache can serve!).
    Ensure that you understand what the static file server script is doing… this might show up on a quiz!
  2. Make a directory parallel to static_server.js named static.
  3. Change "<STATIC DIRECTORY NAME>" on line 11 of the static fileserver example code to reflect the name of the directory you just made.
  4. Save the following files in your static directory:
    • hello.txt, a text file containing "Hello World"
    • skyline.jpg, an image file you can download from here: TODO
    • city.html, an HTML document based on the Quick and Easy HTML Layout containing an image tag pointing to skyline.jpg
    • phpinfo.php, a PHP file containing the phpinfo command that generates a diagnostic of the server:
    <?php   phpinfo();   ?>
  5. Boot up your Node.JS static fileserver and load all four of the files you created in step 4.
    Which ones work and which ones don't? Why might this be the case?

Group Project

Socket.IO Pong Game

Grading

We will be grading the following aspects of your work. There are 100 points total.

  1. Individual Portion (15 Points):
    • Node.JS is installed on your EC2 instance (4 points)
    • The hello.txt, skyline.jpg, and city.html files all load successfully (3 points each)
    • You can explain to the TA why phpinfo.php loads the way it does through Node.JS (2 points)
  1. File Sharing Site (40 Points):
    • File Management (15 Points):
      • Users can upload and delete files (4 points)
      • If a file is "deleted", it should actually be removed from the filesystem (3 points)
      • Existing files can be viewed (5 points)
      • The directory structure is hidden (3 points)
    • Image Groups (10 Points):
      • An image may be associated with a group (5 points)
      • All groups are listed on the home page (5 points)
    • Best Practices (10 Points):
      • Code is well formatted and easy to read (3 points)
      • All pages pass the W3C validator (3 points)
      • CSRF tokens are passed when uploading, re-categorizing, and deleting images (4 points)
    • Usability (5 Points):
      • Site is intuitive to use and navigate (4 points)
      • Site is visually appealing (1 point)
  2. Creative Portion (15 Points) (see below)

Creative Portion

This module, and all future modules, will require that you invest some time into creating additional features for your group project. Plan to invest at least 60 minutes of your time into the creative portion.

  • The creative portion is an opportunity for you to learn material of your own interest.
  • You will not earn credit for a creative-portion feature that simply rehashes something you've already done in a previous module.

If you need ideas for a creative portion, or if you want to know whether or not your creative portion idea is "hard enough", ask a TA.

Retrieved from "http://classes.engineering.wustl.edu/cse330/index.php?title=Mean_Stack&oldid=1280"