http://classes.engineering.wustl.edu/cse330/api.php?action=feedcontributions&feedformat=atom&user=MitchCSE330 Wiki - User contributions [en]2026-11-15T21:32:40ZUser contributionsMediaWiki 1.34.4http://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_6&diff=2768FAQ - Mod 62020-12-21T15:42:24Z<p>Mitch: </p>
<hr />
<div>Welcome to the frequently asked questions page for Module 6. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== Setup/Logistics ==<br />
<br />
=== Should I use a database for Module 6? ===<br />
You can store everything locally in this module. No need to use a database.<br />
<br />
=== How can I add an image to my instance? SFTP isn't working ===<br />
There are a couple different ways to load an image onto your instance. One of the easiest is to use wget. When logged into your instance, run the following command in the terminal:<br />
<br />
<source lang=bash><br />
$ wget <imageurl><br />
</source><br />
<br />
Running this command will download the image straight onto your instance!<br />
<br />
== Port 3456 ==<br />
<br />
=== What rule should I define for Custom TCP when setting up port 3456? ===<br />
When setting up the Custom TCP rule for port 3456, it's fine to use the default source of 0.0.0.0/0. The rule will look like this:<br />
<br />
Custom TCP 3456 Custom 0.0.0.0/0<br />
<br />
=== How do I access my instance at port 3456? ===<br />
All you have to do is append :3456 to the end of your instance url. Thus, the link would just be http://ec2-xx-xxx-xx-xxx.us-east-2.compute.amazonaws.com:3456/filepath <br />
<br />
== NPM/Mime ==<br />
There are a couple common errors that students run into when setting up their Node.js. One of the most common looks like this<br />
<br />
<source lang=bash><br />
ENOENT: no such file or directory, open 'home/rlav/package.json'<br />
</source><br />
<br />
The specific path may differ for your personal machine, but any path that ends in "package.json" in this error is likely a result of the same problem.<br />
<br />
This is another common error message: <br />
<br />
<source lang=bash><br />
Cannot find module 'mime' error when running static_server.js<br />
</source><br />
<br />
Both of these errors are a result of not setting up the package.json correctly. In fact, both are usually a result of not creating package.json at. After installing Node.js, you '''must''' run the following command to generate the package.json file.<br />
<br />
<source lang=bash><br />
$ npm init<br />
</source> <br />
<br />
After generating the package.json file, you must write the correct dependencies. '''Details on this are specified at the [[Node.JS]] page'''. If you follow everything on this page correctly, you should be able to set up Node.js rather smoothly.<br />
<br />
[[Category: Module 6]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=Module_6&diff=2767Module 62020-12-21T15:41:49Z<p>Mitch: /* Reading */</p>
<hr />
<div>__NOTOC__ <br />
Module 6 builds upon the JavaScript skills you learned in Module 5.<br />
<br />
== Reading ==<br />
<br />
The following articles on the online class wiki textbook contain information that will help you complete the assignments.<br />
<br />
* [[Node.JS]]<br />
* [[Socket.IO]]<br />
* [[FAQ - Mod 6]]<br />
<br />
== Individual Assignments ==<br />
<br />
=== Install Node.JS ===<br />
<br />
Install Node.JS from Apt or Yum according to the instructions in the [[Node.JS]] guide.<br />
<br />
=== Static File Server in Node.JS ===<br />
<br />
The individual portion of Module 6 is short in order to give you enough time to complete the group portion.<br />
<br />
# 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!).<br />
#: Ensure that you understand what the static file server script is doing…<br />
# Make a directory parallel to ''static_server.js'' named ''static''.<br />
# Change "<STATIC DIRECTORY NAME>" on line 11 of the static fileserver example code to reflect the name of the directory you just made.<br />
# Save the following files in your ''static'' directory:<br />
#* ''hello.txt'', a text file containing "Hello World"<br />
#* ''brookings.jpg'', an image file you can download from here: http://classes.engineering.wustl.edu/cse330/content/brookings.jpg<br />
#* ''college.html'', an HTML document based on the [[HTML and CSS#Quick and Easy Page Layout|Quick and Easy HTML Layout]] containing an image tag pointing to ''brookings.jpg''<br />
#* ''phpinfo.php'', a PHP file containing the phpinfo command that generates a diagnostic page of the server:<br />
#: <source lang="php"><?php phpinfo(); ?></source><br />
# Boot up your Node.JS static fileserver, and from your browser, load all four of the files you created in step 4.<br />
#: Which ones work and which ones don't? Why might this be the case?<br />
<br />
== Group Project ==<br />
<br />
In the group portion of Module 6 you will create a multi-room chat server using Node.JS and Socket.IO. This project must be completed using Node.JS.<br />
<br />
This chat service will contain a main lobby where users sign on with a nickname and can communicate with each other. Users may also create chat rooms for other to join. The entire app should be displayed on a single webpage, listing the room you are in, all available rooms, and the users in the current room.<br />
<br />
The single room chat server and client are provided here: [[Socket.IO]]<br />
<br />
== Grading ==<br />
<br />
We will be grading the following aspects of your work. There are 75 points total.<br />
<br />
'''Assignments (including code) must be committed to Github by the end of class on the due date (commit early and often). Failing to commit by the end of class on the due date will result in a 0. '''<br />
<br />
'''Additionally, for this module, the TA should be able to simply download your repo and start up your file server, without having to copy files or create additional subdirectories. This applies to both the individual and the creative portion'''<br />
<br />
_________<br />
<br />
# '''Individual Portion (25 Points):'''<br />
#* Node.JS is installed on your EC2 instance (5 points)<br />
#*: ''Take a screenshot of your browser visiting your EC2 instance serving up the college.html web page on port 3456, make sure the URL is visible in the screenshot.''<br />
#* The ''hello.txt'', ''brookings.jpg'', and ''college.html'' files all load successfully (4 points each)<br />
#* Visiting a file that does not exist inside the ''static'' directory results in a 404 (4 points)<br />
#* Discuss in the README.md why ''phpinfo.php'' behaves the way it does when loaded through Node.JS (4 points)<br />
#* Make sure all of your individual portion files are pushed to Github (include your node.js files, hello.txt, brookings.jpg, college.html, and phpinfo.php)<br />
<br />
# '''Multi-room Chat Server (50 Points):'''<br />
#* '''''Administration of user created chat rooms (25 Points):'''''<br />
#** Users can create chat rooms with an arbitrary room name(5 points)<br />
#** Users can join an arbitrary chat room (5 points)<br />
#** The chat room displays all users currently in the room (5 points)<br />
#** A private room can be created that is password protected (5 points)<br />
#** Creators of chat rooms can temporarily kick others out of the room (3 points)<br />
#** Creators of chat rooms can permanently ban users from joining that particular room (2 points)<br />
#* '''''Messaging (5 Points):'''''<br />
#** A user's message shows their username and is sent to everyone in the room (1 point)<br />
#** Users can send private messages to another user in the same room (4 points)<br />
#* '''''Best Practices (5 Points):'''''<br />
#** Code is well formatted and easy to read, with proper commenting (2 points)<br />
#** Code passes HTML validation (2 points)<br />
#** node_modules folder is ignored by version control (1 points)<br />
#* '''''Usability (5 Points):'''''<br />
#** Communicating with others and joining rooms is easy and intuitive (4 points)<br />
#** Site is visually appealing (1 point)<br />
#* '''Creative Portion (10 Points)'''<br />
<!-- #** Make sure to create a README.md file pointing to your server --><br />
<br />
[[Category:Module 6]]<br />
[[Category:Modules]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=Module_5&diff=2766Module 52020-12-21T15:41:32Z<p>Mitch: /* Reading */</p>
<hr />
<div>__NOTOC__<br />
In Module 5, you will learn JavaScript, the dominant client-side web language. JavaScript is the third and final programming language you will learn in CSE 330.<br />
<br />
This article contains your assignments for Module 5.<br />
<br />
'''Warning:'''<br />
<br />
''This module takes students a while. It is strongly recommended that you start early and ask questions as they come up.''<br />
<br />
<br />
== Reading ==<br />
<br />
The following articles on the online class wiki textbook contain information that will help you complete the assignments.<br />
<br />
* [[JavaScript]]<br />
* [[AJAX and JSON]]<br />
* [[jQuery]]<br />
* [[Web Application Security, Part 3]]<br />
* [[FAQ - Mod 5]]<br />
<br />
== Individual Assignments ==<br />
<br />
'''''IMPORTANT:'' Both of the individual assignments must be completed ''without'' using a JavaScript library like jQuery.''' However, you may use jQuery for the group portion.<br />
<br />
=== JavaScript Calculator ===<br />
<br />
In Module 2, you made a calculator using PHP. Now you will be making one using JavaScript.<br />
<br />
* The web page should have two input fields and a radio button group for the operation, with the 4 basic math operations represented (add, subtract, multiply, divide).<br />
* JavaScript should monitor all three fields and display the current result whenever the user changes any value in any field, without refreshing the page.<br />
*: '''Tip 1:''' Consider using either the ''change'' or the ''keyup'' event on the text fields, and either the ''change'' or the ''click'' event on the radio buttons.<br />
*: '''Tip 2:''' Re-read [[JavaScript|the JavaScript guide]] if you need help figuring our how to bind callback functions to events, or how to determine which radio button is currently selected. (There are examples for both of these!)<br />
* The calculator should be completely self-contained; i.e., you should not be making any requests to any other server-side or client-side scripts or web pages after the initial page load.<br />
<br />
'''Tip:''' You can embed JavaScript code into an HTML document like this:<br />
<br />
<source lang="html4strict"><br />
<script><br />
// your code here<br />
</script><br />
</source><br />
<br />
'''Tip:''' If your code isn't working the way you expect, use a JavaScript error console. In Chrome, for example, press Ctrl-Shift-I (or Cmd-Option-I) to open the WebKit inspector.<br />
<br />
'''Important:''' It is best practice to fully separate the content, appearance, and behavior. In previous modules, you may have lost points for using HTML tags that change the appearance of things <nowiki>(like <center> and <font>).</nowiki> In this module, make sure that you define your event listeners in JavaScript as in <code>document.getElementById("xyz").addEventListener(...)</code> and '''''not''''' in the HTML like <code><button onclick="badExample();">Bad Example</button></code>.<br />
<br />
=== Weather Widget ===<br />
<br />
In this section, you will make a web page that displays the weather forecast using AJAX requests to a weather server.<br />
<br />
# Make an empty HTML document; name it '''weather.html'''<br />
#: Refer to the [[HTML and CSS]] guide for the skeleton of an HTML document<br />
# Define a function in JavaScript; call it '''fetchWeather()'''. You may write your JavaScript in an embedded script in your HTML document.<br />
# Inside your '''fetchWeather()''' function, make an AJAX request to the weather server.<br />
#: We have a server that outputs the current weather in JSON format. The format is documented in the [[#JSON Structure]] section below.<br />
#: '''URL:''' https://classes.engineering.wustl.edu/cse330/content/weather_json.php<br />
#* '''IMPORTANT:''' Under normal circumstances, AJAX requests ''cannot'' be performed cross-domain for security reasons. We have set the <code>Access-Control-Allow-Origin</code> header on our server to allow requests from your EC2 instances, or from localhost. '''You will therefore need to upload your code to your EC2, or access it via localhost, in order for the AJAX requests to work.''' This means that you cannot, for example, complete this part of the individual portion in JSFiddle.<br />
# In your callback, process the JSON and use JavaScript to manipulate the HTML DOM to display the following information on your page:<br />
#* Location<br />
#** City, in a <nowiki><strong></nowiki> tag<br />
#** State, not in any tag<br />
#* Humidity<br />
#* Current Temperature<br />
#* Image for Tomorrow's Forecast (see [[#Weather Condition Images]] below for more information)<br />
#* Image for the Day After Tomorrow's Forecast<br />
# Finally, bind '''fetchWeather()''' to the DOMContentLoaded event so that your weather widget is automatically initialized when the page is loaded:<br />
#: <source lang="javascript">document.addEventListener("DOMContentLoaded", fetchWeather, false);</source><br />
# In addition, add a button that runs your ''fetchWeather'' function when clicked. This should update your widget with the current weather conditions.<br />
<br />
Use the following HTML:<br />
<br />
<source lang="html4strict"><br />
<div class="weather" id="weatherWidget"><br />
<div class="weather-loc"></div><br />
<div class="weather-humidity"></div><br />
<div class="weather-temp"></div><br />
<img class="weather-tomorrow" /><br />
<img class="weather-dayaftertomorrow" /><br />
</div><br />
</source><br />
<br />
Include the CSS file from here: http://classes.engineering.wustl.edu/cse330/content/weather.css<br />
<br />
When everything is working, the weather widget should look something like this:<br />
<br />
[[File:WeatherWidget.png]]<br />
<br />
'''Important:''' The widget in this section needs to work in only Firefox and Chrome. It does '''''not''''' need to work Internet Explorer.<br />
<br />
==== Tips ====<br />
<br />
===== JSON Structure =====<br />
<br />
The JSON from our server looks like this:<br />
<br />
<source lang="javascript"><br />
{<br />
"updated": "Thu, 11 Oct 2012 5:54 pm CDT",<br />
"location": {<br />
"city": "St. Louis",<br />
"state": "MO"<br />
},<br />
"wind": {<br />
"chill": "62",<br />
"direction": "150",<br />
"speed": "3 mph"<br />
},<br />
"atmosphere": {<br />
"humidity": "50",<br />
"visibility": "10",<br />
"pressure": "30.12 in"<br />
},<br />
"current": {<br />
"code": "28",<br />
"text": "Mostly Cloudy",<br />
"temp": "62°F",<br />
"date": "Thu, 11 Oct 2012 5:54 pm CDT"<br />
},<br />
"tomorrow": {<br />
"code": "29",<br />
"text": "Clouds Early/Clearing Late",<br />
"low": "45°F",<br />
"high": "61°F"<br />
},<br />
"dayafter": {<br />
"code": "30",<br />
"text": "Partly Cloudy",<br />
"low": "53°F",<br />
"high": "65°F"<br />
},<br />
"credit": "http://us.rd.yahoo.com/dailynews/rss/weather/St._Louis__MO/*http://weather.yahoo.com/forecast/USMO0170_f.html"<br />
}<br />
</source><br />
<br />
===== Weather Condition Images =====<br />
<br />
Each day's forecast has a code. There are images associated with these codes.<br />
<br />
One place to get the images is from here: <nowiki>http://us.yimg.com/i/us/nws/weather/gr/</nowiki>'''##'''<nowiki>ds.png</nowiki><br />
<br />
Replace the '''##''' with the forecast code. For example, for code 32, the URL would be: http://us.yimg.com/i/us/nws/weather/gr/32ds.png<br />
<br />
== Group Project ==<br />
<br />
I forgot if I already mentioned this, but '''start early on this project!''' It will take longer than you think, I promise!<br />
<br />
You are encouraged to use the advanced version control practices you learned in Module 5 when completing this assignment.<br />
<br />
=== Calendar ===<br />
<br />
Build a simple calendar that allows users to add and remove events dynamically.<br />
<br />
You will use JavaScript to process user interactions at the web browser, without ever refreshing the browser after the initial web page load. You may use a JavaScript library of your choice, including Ext JS, so long as that JavaScript library does not defeat the purpose of the assignment. If you have questions about this, ask. In particular, libraries like FullCalendar are unacceptable.<br />
<br />
Your application should utilize AJAX to run server-side scripts that query your database to save and retrieve information, including user accounts and events.<br />
<br />
We have also written some functions to help you get started: [[JavaScript Calendar Library]]<br />
<br />
==== Examples ====<br />
<br />
* https://calendar.google.com/<br />
* http://www.zoho.com/calendar/<br />
<br />
==== Server Side Language ====<br />
<br />
<br />
Additionally, you may use a database of your choice. MySQL is probably the logical choice since you have been using it since Module 2, but you are free to explore other databases if you like.<br />
<br />
==== Requirements ====<br />
<br />
* Support a month-by-month view of the calendar.<br />
*: Show one month at a time, with buttons to move forward or backward.<br />
*: There should be no limit to how far forward or backward the user can go.<br />
* Users can register and log in to the website.<br />
*: You may leverage your MySQL project code and database from module 3 to get started.<br />
* Unregistered users should see no events on the calendar.<br />
* Registered users can add events.<br />
*: All events should have a date and time, but do not need to have a duration.<br />
*: You do ''not'' need to support recurring events (where you add an event that repeats, for example, every monday).<br />
* Registered users see only events that they have added.<br />
*: Your AJAX should not ask the server for events from a certain username. Instead, your AJAX should ask the server for events, and the server should respond with the events for only the currently-logged-in user (from the session). Can you think of why?<br />
* Registered users can delete their events, but not the events of others.<br />
*: Again, the server should delete events based on the username present in the session. (If it deletes only based on an Event ID, an attacker could feed any arbitrary Event ID to your server, even if he/she didn't own that event.)<br />
* All user and event data should be kept in a database.<br />
* At no time should the main page need to be reloaded.<br />
*: User registration, user authentication, event addition, and event deletion should all be handled by JavaScript and AJAX requests to your server.<br />
* Your page needs to work in the versions of Firefox and Chrome installed on the lab computers.<br />
<br />
'''Tip:''' Run your database schema by a TA before implementing it.<br />
<br />
=== Web Security and Validation ===<br />
<br />
Your project needs to demonstrate that thought was put into web security and best practice. For more information, see this week's Web Application Security guide: [[Web Application Security, Part 3]]<br />
<br />
In particular:<br />
<br />
* '''Your application needs to prevent XSS attacks.''' Be careful when transmitting data over JSON that will be reflected in an event title! (Note: JSON data should be sanitized on the client side, not the server side.)<br />
* '''Perform precautionary measures to prevent session hijacking attacks.'''<br />
*: You should specify your session cookie to be HTTP-Only. However, for the means of this module, you need not test for user agent consistency.<br />
<br />
You should continue the practices that you have learned in past weeks:<br />
<br />
* Pass tokens in forms to prevent CSRF attacks.<br />
*: '''Hint:''' You will need to send your CSRF tokens in your AJAX requests. Remember that AJAX still submits forms and runs server-side scripts, just like the vanilla forms you've been using in Modules 2 and 3.<br />
* Use prepared queries to prevent SQL Injection attacks.<br />
* If storing passwords in a database, always store them salted and encrypted.<br />
* Your page should validate with no errors or warnings through the W3C validator.<br />
<br />
== Grading ==<br />
<br />
<br />
We will be grading the following aspects of your work. There are 100 points in total.<br />
<br />
'''Assignments (including code) must be committed to Github by the end of class on the due date (commit early and often). Failing to commit by the end of class on the due date will result in a 0. ''' <br />
<br />
If you do not include a link to your individual and group portion running on your instance in the respective README.md, you will receive a 0 for the missing portion<br />
<br />
_________<br />
<br />
# '''JavaScript Calculator (10 Points):'''<br />
#* Calculator successfully adds, subtracts, multiplies, and divides numbers (3 points)<br />
#* The result is automatically computed when a value in either field is changed (3 points)<br />
#* Calculator is written entirely in pure, conventional JavaScript with no external libraries (4 points)*<br />
#*: ''Note: be sure to fully separate content, appearance, and behavior. This means that you should '''not''' use the event attributes on the HTML elements like onclick, onchange, and onkeyup.''<br />
# '''Weather Widget (15 Points):'''<br />
#* Widget performs an AJAX request to fetch the current weather (4 points)<br />
#* The HTML template is filled with the correct information, including an image (4 points)<br />
#* Button to reload the weather widget (2 points)<br />
#* Widget is written entirely in pure, conventional JavaScript with no external libraries (5 points)*<br />
# '''AJAX Calendar (60 Points):'''<br />
#* '''''Calendar View (10 Points):'''''<br />
#** The calendar is displayed as a table grid with days as the columns and weeks as the rows, one month at a time (5 points)<br />
#** The user can view different months as far in the past or future as desired (5 points)<br />
#* '''''User and Event Management (25 Points):'''''<br />
#** Events can be added, modified, and deleted (5 points)<br />
#** Events have a title, date, and time (2 points)<br />
#** Users can log into the site, and they cannot view or manipulate events associated with other users (8 points)<br />
#**: ''Don't fall into the Abuse of Functionality trap! Check user credentials on the server side as well as on the client side.''<br />
#** All actions are performed over AJAX, without ever needing to reload the page (7 points)<br />
#** Refreshing the page does not log a user out (3 points)<br />
#* '''''Best Practices (20 Points):'''''<br />
#** Code is well formatted and easy to read, with proper commenting (2 points)<br />
#** If storing passwords, they are stored salted and hashed (2 points)<br />
#** All AJAX requests that either contain sensitive information or modify something on the server are performed via POST, not GET (3 points)<br />
#** Safe from XSS attacks; that is, all content is escaped on output (3 points)<br />
#** Safe from SQL Injection attacks (2 points)<br />
#** CSRF tokens are passed when adding/editing/deleting events (3 points)<br />
#** Session cookie is HTTP-Only (3 points)<br />
#** Page passes the W3C validator (2 points)<br />
#* '''''Usability (5 Points):'''''<br />
#** Site is intuitive to use and navigate (4 points)<br />
#** Site is visually appealing (1 point)<br />
# '''Creative Portion (15 Points)'''<br />
#* '''Additional Calendars Features (worth 15 points):''' Develop some additional features for the calendar, a few examples are provided below.<br />
#** Users can tag an event with a particular category and enable/disable those tags in the calendar view. (5 points)<br />
#** Users can share their calendar with additional users. (5 points)<br />
#** Users can create group events that display on multiple users calendars (5 points)<br />
#* '''Make sure to save a description of your creative portion, and a link to your server in your README.md file.'''<br />
''* These points can be earned only if at least 3 other points have been earned in that category. This is to prevent these points from being "free."''<br />
<br />
[[Category:Module 5]]<br />
[[Category:Modules]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_6&diff=2765FAQ - Mod 62020-12-21T15:34:59Z<p>Mitch: /* NPM/Mime */</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 6. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== Setup/Logistics ==<br />
<br />
=== Should I use a database for Module 6? ===<br />
You can store everything locally in this module. No need to use a database.<br />
<br />
=== How can I add an image to my instance? SFTP isn't working ===<br />
There are a couple different ways to load an image onto your instance. One of the easiest is to use wget. When logged into your instance, run the following command in the terminal:<br />
<br />
<source lang=bash><br />
$ wget <imageurl><br />
</source><br />
<br />
Running this command will download the image straight onto your instance!<br />
<br />
== NPM/Mime ==<br />
There are a couple common errors that students run into when setting up their Node.js. One of the most common looks like this<br />
<br />
<source lang=bash><br />
ENOENT: no such file or directory, open 'home/rlav/package.json'<br />
</source><br />
<br />
The specific path may differ for your personal machine, but any path that ends in "package.json" in this error is likely a result of the same problem.<br />
<br />
This is another common error message: <br />
<br />
<source lang=bash><br />
Cannot find module 'mime' error when running static_server.js<br />
</source><br />
<br />
Both of these errors are a result of not setting up the package.json correctly. In fact, both are usually a result of not creating package.json at. After installing Node.js, you '''must''' run the following command to generate the package.json file.<br />
<br />
<source lang=bash><br />
$ npm init<br />
</source> <br />
<br />
After generating the package.json file, you must write the correct dependencies. '''Details on this are specified at the [[Node.JS]] page'''. If you follow everything on this page correctly, you should be able to set up Node.js rather smoothly.<br />
<br />
== Port 3456 ==<br />
<br />
=== What rule should I define for Custom TCP when setting up port 3456? ===<br />
When setting up the Custom TCP rule for port 3456, it's fine to use the default source of 0.0.0.0/0. The rule will look like this:<br />
<br />
Custom TCP 3456 Custom 0.0.0.0/0<br />
<br />
=== How do I access my instance at port 3456? ===<br />
All you have to do is append :3456 to the end of your instance url. Thus, the link would just be http://ec2-xx-xxx-xx-xxx.us-east-2.compute.amazonaws.com:3456/filepath <br />
<br />
[[Category: Module 6]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_6&diff=2764FAQ - Mod 62020-12-21T02:38:16Z<p>Mitch: </p>
<hr />
<div>Welcome to the frequently asked questions page for Module 6. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== Setup/Logistics ==<br />
<br />
=== Should I use a database for Module 6? ===<br />
You can store everything locally in this module. No need to use a database.<br />
<br />
=== How can I add an image to my instance? SFTP isn't working ===<br />
There are a couple different ways to load an image onto your instance. One of the easiest is to use wget. When logged into your instance, run the following command in the terminal:<br />
<br />
<source lang=bash><br />
$ wget <imageurl><br />
</source><br />
<br />
Running this command will download the image straight onto your instance!<br />
<br />
== NPM/Mime ==<br />
There are a couple common errors that students run into when setting up their Node.js. One of the most common looks like this<br />
<br />
<source lang=bash><br />
ENOENT: no such file or directory, open 'home/rlav/package.json'<br />
</source><br />
<br />
The specific path may differ for your personal machine, but any path that ends in "package.json" in this error is likely a result of the same problem.<br />
<br />
This is another common error message: <br />
<br />
<source lang=bash><br />
Cannot find module 'mime' error when running static_server.js<br />
</source><br />
<br />
Both of these errors are a result of not setting up the package.json correctly. In fact, both are usually a result of not creating package.json at. After installing Node.js, you '''must''' run the following command to generate the package.json file.<br />
<br />
<source lang=bash><br />
$ npm init<br />
</source> <br />
<br />
After generating the package.json file, you must write the correct dependencies. Details on this are specified at the [[Node.JS]] page. If you follow everything on this page correctly, you should be able to set up Node.js rather smoothly.<br />
<br />
== Port 3456 ==<br />
<br />
=== What rule should I define for Custom TCP when setting up port 3456? ===<br />
When setting up the Custom TCP rule for port 3456, it's fine to use the default source of 0.0.0.0/0. The rule will look like this:<br />
<br />
Custom TCP 3456 Custom 0.0.0.0/0<br />
<br />
=== How do I access my instance at port 3456? ===<br />
All you have to do is append :3456 to the end of your instance url. Thus, the link would just be http://ec2-xx-xxx-xx-xxx.us-east-2.compute.amazonaws.com:3456/filepath <br />
<br />
[[Category: Module 6]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_6&diff=2763FAQ - Mod 62020-12-21T02:11:39Z<p>Mitch: Created page with "Welcome to the frequently asked questions page for Module 6. As many common questions can come up on Piazza, some of those questions are consolidated here. == Setup/Logistics..."</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 6. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== Setup/Logistics ==<br />
<br />
=== Should I use a database for Module 6? ===<br />
You can store everything locally in this module. No need to use a database.<br />
<br />
=== How can I add an image to my instance? SFTP isn't working ===<br />
There are a couple different ways to load an image onto your instance. One of the easiest is to use wget. When logged into your instance, run the following command in the terminal:<br />
<br />
<source lang=bash><br />
$ wget <imageurl><br />
</source><br />
<br />
Running this command will download the image straight onto your instance!<br />
<br />
== NPM/Mime ==<br />
There are a couple common errors that students run into when setting up their Node.js. One of the most common looks like this<br />
<br />
<source lang=bash><br />
ENOENT: no such file or directory, open 'home/rlav/package.json'<br />
</source><br />
<br />
The specific path may differ for your personal machine, but any path that ends in "package.json" in this error is likely a result of the same problem.<br />
<br />
This is another common error message: <br />
<br />
<source lang=bash><br />
Cannot find module 'mime' error when running static_server.js<br />
</source><br />
<br />
Both of these errors are a result of not setting up the package.json correctly. In fact, both are usually a result of not creating package.json at. After installing Node.js, you '''must''' run the following command to generate the package.json file.<br />
<br />
<source lang=bash><br />
$ npm init<br />
</source> <br />
<br />
After generating the package.json file, you must write the correct dependencies. Details on this are specified at the [[Node.JS]] page. If you follow everything on this page correctly, you should be able to set up Node.js rather smoothly.<br />
<br />
[[Category: Module 6]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_5&diff=2762FAQ - Mod 52020-12-21T02:09:35Z<p>Mitch: </p>
<hr />
<div>Welcome to the frequently asked questions page for Module 5. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== File Structure/Languages ==<br />
<br />
=== Can I redirect users to another page after login/for any other reason? ===<br />
For this module, you can '''not''' redirect a user to another page for login or refresh the page on logout. You should have '''one''' single html file , and any on-screen changes should be done through DOM manipulation in Javascript.<br />
<br />
=== Can/should I use PHP in this module? ===<br />
PHP should be used to access the MySQL database for this module, but you should use Javascript for most other functionality. The focus of this module is for you to learn more about Javascript and the DOM, so do not use PHP to redirect to other pages or refresh the current one.<br />
<br />
== CSRF Tokens ==<br />
<br />
=== How do I pass CSRF tokens between PHP and Javascript? ===<br />
At the end of your PHP script execution, you can send values back to where you initially called the script from. Think about how you can use this to then store the token in Javascript.<br />
<br />
<br />
== HTML Validator ==<br />
<br />
=== I'm getting a validation warning about missing an src attribute for my weather widget, what should I do about this? ===<br />
Before you fetch the data in the weather widget, you may not have a src attribute for your img tags. Your warning will likely look like this:<br />
<br />
<source lang=bash><br />
Element img is missing required attribute src<br />
</source><br />
<br />
An easy way to avoid this warning is to simply put a temporary image on the screen before you load in the weather data.<br />
<br />
[[Category: Module 5]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_4&diff=2761FAQ - Mod 42020-12-21T02:09:07Z<p>Mitch: </p>
<hr />
<div>Welcome to the frequently asked questions page for Module 4. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== Regular Expressions Cases ==<br />
<br />
=== When parsing for a string, should I look for that string exclusively or that string concatenated with other characters? ===<br />
If you are looking for a string, you should be looking for any exact occurrences of that string. This is the case regardless of what characters are appended to the beginning or the end of said string.<br />
<br />
'''Example:''' Parsing for "hello world"<br />
<br />
'''What Should Work'''<br />
<br />
hello world, hi hello world, hello worldwide, hhhello worlddd<br />
<br />
'''What Shouldn't Work'''<br />
<br />
hello weorld, hello to the world<br />
<br />
=== In RegEx exercise 2, should I accept strings that have more than three consecutive vowels? ===<br />
In this exercise, strings with three ''or more'' vowels should be accepted.<br />
<br />
'''What Should Work'''<br />
<br />
beautiful, queue, coooool!<br />
<br />
=== In RegEx exercise 3, is each line a separate input? ===<br />
Yes. Each line with a potential flight code is a separate input. Your expression does not need to account for separating each potential code.<br />
<br />
=== If a batting average ends in a 0, can I round to two decimal places? ===<br />
A batting average must always be rounded to 3 decimal places, regardless of if it ends in one (or more) zero(s).<br />
<br />
'''Expected Batting Average Outputs'''<br />
<br />
.270, .300, .050<br />
<br />
'''Unacceptable Batting Average Outputs'''<br />
<br />
.27, .3, .05<br />
<br />
== Logistics == <br />
<br />
=== Should I complete this module on my local machine or on my instance? ===<br />
Unlike other modules, this one can be completed on your local machine!<br />
<br />
=== Do I have to save the output of our python script to a .txt file or can I just print it out? ===<br />
You can just print the output of your script. No need to save it to a .txt file<br />
<br />
[[Category: Module 4]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=Node.JS&diff=2760Node.JS2020-12-21T02:08:24Z<p>Mitch: </p>
<hr />
<div>AJAX is a useful technology for web applications that need to pull periodic updates from your server. But what do you do when you have thousands of clients all requesting data that changes real-time? A PHP+AJAX approach could choke without a lot of effort on your part. It is situations like these that Node.js comes to the rescue. Node.js is a web framework, made in JavaScript, that's become extremely popular over the last few years.<br />
<br />
In general, JavaScript frameworks are very trendy right now; it can be hard to keep up with the new cool thing. In fact, there's a joke website https://dayssincelastjavascriptframework.com/, that "tracks" how long it's been since a new framework has come out.<br />
<br />
== Non-Blocking I/O ==<br />
<br />
You dabbled in the concept of non-blocking I/O when you implemented AJAX in the previous JavaScript module. Node.js uses this execution model at its core.<br />
<br />
The core idea is the use of '''''anonymous functions''''' as ''callbacks'' for processing the results of intensive operations. Consider the pseudo-code:<br />
<br />
<source lang="javascript"><br />
// Blocking I/O Pseudo-Code<br />
<br />
var data = database.query("select * from news");<br />
print data[0].title;<br />
</source><br />
<br />
The above pseudo-code queries a database, saves the result of the query in a variable named ''data'', and then prints out the first title in ''data''. The problem arises when multiple clients all want to access the server at the same time. ''In a blocking I/O model, a client needs to wait until all other clients are finished before it can start its process.'' With intensive operations and thousands of clients, this can easily crash your server!<br />
<br />
The solution is to use ''non-blocking I/O''. Consider this revised pseudo-code:<br />
<br />
<source lang="javascript"><br />
// Non-Blocking I/O Pseudo-Code<br />
<br />
database.query("select * from news", function(data){<br />
print data[0].title;<br />
});<br />
</source><br />
<br />
The revised pseudo-code achieves the same end result as the first version. However, ''it allows other clients to perform tasks while this process is waiting for the database to be queried!'' The code occurs in two parts: first, we start the query. Second, ''when the query is complete'', our '''anonymous callback function''' is executed. In Node.js, callback functions are usually passed one or more parameters.<br />
<br />
Better yet, with non-blocking I/O, you have no concurrency issues, because everything runs in just one thread. Nifty!<br />
<br />
== Installing Node.js ==<br />
<br />
Run the following commands to install Node and NPM:<br />
<br />
<source lang="bash"><br />
$ curl --silent --location https://rpm.nodesource.com/setup_12.x | sudo bash -<br />
$ sudo yum install -y nodejs<br />
</source><br />
<br />
<br />
<!-- The unofficial instructions for installing Node.js can be found here: https://gist.github.com/isaacs/579814<br />
<br />
There are several choices, but my favorite is probably ''use-nave-no-shell.sh''.<br />
<br />
The instructions at the above link have a couple bugs. If you run this sequence of commands, Node and NPM will install correctly:<br />
<br />
<source lang="bash"><br />
$ mkdir ~/.nave<br />
$ cd ~/.nave<br />
$ wget http://github.com/isaacs/nave/raw/master/nave.sh<br />
$ sudo ln -s $PWD/nave.sh /usr/local/bin/nave<br />
$ chmod a+x nave.sh<br />
$ sudo chown -R $USER:$USER /usr/local<br />
$ nave usemain stable<br />
$ curl -L https://www.npmjs.org/install.sh | sh<br />
</source><br />
<br />
--><br />
<br />
== Your First Node.js Application: Hello World ==<br />
<br />
Let's try running the example application given on the front page of nodejs.org:<br />
<br />
<source lang="javascript"><br />
const http = require('http');<br />
http.createServer(function (req, res) {<br />
res.writeHead(200, {<br />
'Content-Type': 'text/plain'<br />
});<br />
res.end('Hello World\n');<br />
}).listen(3456);<br />
console.log('Server running at http://localhost:3456/');<br />
</source><br />
<br />
Paste the example into a file named `hello.js`, and then run it by calling `node hello.js`. You should now be able to see your Hello World by visiting your server at port 3456! (Press ^C to stop the application.) '''Note:''' If you're running the code from your EC2 instance, you will need to open port 3456.<br />
<br />
Let's walk through each line in the above example.<br />
<br />
* <code>var http = require('http');</code> enables us to use Node's built-in HTTP server. We've been spoiled that languages like PHP automatically load all of the libraries that we need. However, '''''most functionality in Node.js is NOT loaded by default.''''' When you want to use any non-fundamental feature of Node, you need to ''require'' it into a variable, as this example does with the HTTP package. You should be familiar with this concept when you needed to use ArrayList and other specialty packages in Java in CSE 132.<br />
* <code>http.createServer(function (req, res) { ... }).listen(3456);</code> uses the HTTP server API to listen for HTTP connections on port 3456. The anonymous callback function will be called whenever a connection is made.<br />
* <code>res.writeHead(200, { 'Content-Type': 'text/plain' });</code> specifies the Content-Type header to be "text/plain".<br />
* <code>res.end('Hello World\n');</code> writes "Hello World" to the response.<br />
<br />
Note the use of non-blocking I/O, even in this one little example. ''Whenever a connection is made, the callback function will be called and passed parameters associated with that connection.''<br />
<br />
== A Static File Server Using Node.js ==<br />
<br />
Node.js does not automatically serve up static files in the way that an Apache/PHP does. We need to either use an extension that handles this for us, like Express, or we need to write our own code to make a simple static file server. The latter option is really not all that difficult, and it gives good insight into how a static file server works.<br />
<br />
=== Installing Packages ===<br />
<br />
In order for the example code below to work, you need to install the ''mime'' package. To do this, '''cd to the working directory where you will save your Node.js JavaScript file''' and run:<br />
<br />
<source lang="bash">$ npm install mime --save</source><br />
<br />
''npm'' is the package manager for Node.js. Unlike all of the package managers we've used up to this point, ''npm'' installs dependencies locally, ''not'' globally. This means that you can have two different projects using different versions of the same package. ''npm'' will create a ''node_modules'' directory in the CWD and will install the packages into it.<br />
<br />
'''Note:''' When using npm to install local dependencies, '''''do not use sudo'''''. It will screw up your file permissions.<br />
<br />
=== Static Fileserver Code ===<br />
<br />
The following code will make an HTTP server on port 3456 that serves up all static files in <STATIC DIRECTORY NAME> relative to app.js.<br />
<br />
'''Make an attempt to understand this code.''' It's important that you are comfortable with the non-blocking nature, as well as how we handle file I/O. <br />
<br />
<source lang="javascript"><br />
// Require the functionality we need to use:<br />
var http = require('http'),<br />
url = require('url'),<br />
path = require('path'),<br />
mime = require('mime'),<br />
path = require('path'),<br />
fs = require('fs');<br />
<br />
// Make a simple fileserver for all of our static content.<br />
// Everything underneath <STATIC DIRECTORY NAME> will be served.<br />
var app = http.createServer(function(req, resp){<br />
var filename = path.join(__dirname, "<STATIC DIRECTORY NAME>", url.parse(req.url).pathname);<br />
(fs.exists || path.exists)(filename, function(exists){<br />
if (exists) {<br />
fs.readFile(filename, function(err, data){<br />
if (err) {<br />
// File exists but is not readable (permissions issue?)<br />
resp.writeHead(500, {<br />
"Content-Type": "text/plain"<br />
});<br />
resp.write("Internal server error: could not read file");<br />
resp.end();<br />
return;<br />
}<br />
<br />
// File exists and is readable<br />
var mimetype = mime.getType(filename);<br />
resp.writeHead(200, {<br />
"Content-Type": mimetype<br />
});<br />
resp.write(data);<br />
resp.end();<br />
return;<br />
});<br />
}else{<br />
// File does not exist<br />
resp.writeHead(404, {<br />
"Content-Type": "text/plain"<br />
});<br />
resp.write("Requested file not found: "+filename);<br />
resp.end();<br />
return;<br />
}<br />
});<br />
});<br />
app.listen(3456);<br />
</source><br />
<br />
=== Port 3456 ===<br />
<br />
We are running our server on port 3456 as opposed to the default web server port, which of course is 80. We therefore need to open our Node.js application like this:<br />
<br />
http://ec2-xx-xx-xx-xx.compute-1.amazonaws.com:3456/path.extension<br />
<br />
However, this won't work on the first time. ''Why?'' (Try to figure this out on your own before reading the next paragraph.)<br />
<br />
We need to open port 3456 on our Amazon EC2 instance. Remember when you opened port 80 way back in Module 2? We need to do the same sort of procedure again now.<br />
<br />
# Log into your EC2 management console<br />
# Go to "Security Groups"<br />
# Select your security group from Module 2<br />
# Under "Inbound", create a custom TCP rule for port 3456, and apply your changes.<br />
<br />
== Node.js Security ==<br />
<br />
Just because we're writing in JavaScript doesn't mean that we can forget about the security practices you've been learning in the last three months of CSE 330. XSS is still a problem, as is the use of ''eval'', CSRF attacks, and so on.<br />
<br />
The two links below have good information about security vulnerabilities specific to Node.js that you should think about when crafting your application.<br />
<br />
# Book from PragProg ($24, 2015): https://pragprog.com/book/kdnodesec/secure-your-node-js-web-application<br />
# Slideshow from a Switzerland Conference on Application Security (2012): http://www.slideshare.net/ASF-WS/asfws-2012-nodejs-security-old-vulnerabilities-in-new-dresses-par-sven-vetsch<br />
<br />
== Node.js Conventions ==<br />
<br />
There ought to be a standard way to save metadata about your app, right? Well, ''npm'' introduces a straightforward way to do this in the form of a ''package.json'' file.<br />
<br />
To make your ''npm'' file with a step-by-step prompt, run in your project root directory:<br />
<br />
<source lang="bash"><br />
$ npm init<br />
</source><br />
<br />
One nifty feature of ''package.json'' is the way it automatically handles dependencies. For example, you can put the following lines in your ''package.json'':<br />
<br />
<source lang="javascript"><br />
"dependencies": {<br />
"mime": "~2.4.6",<br />
"socket.io": "~1.0.0"<br />
},<br />
</source><br />
<br />
Then, back on the command line, when you run<br />
<br />
<source lang="bash"><br />
$ npm install<br />
</source><br />
<br />
it automatically installs the dependencies for you! No more headaches of trying to figure out which modules you need to install; all that information is saved for you in your code base.<br />
<br />
'''Tip:''' Once you set up your ''package.json'' file, you can automatically add a dependency to it by using the ''--save'' argument on ''npm install'': <code>npm install --save socket.io</code><br />
<br />
[[Category:Module 7]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=Node.JS&diff=2759Node.JS2020-12-21T02:08:16Z<p>Mitch: </p>
<hr />
<div>AJAX is a useful technology for web applications that need to pull periodic updates from your server. But what do you do when you have thousands of clients all requesting data that changes real-time? A PHP+AJAX approach could choke without a lot of effort on your part. It is situations like these that Node.js comes to the rescue. Node.js is a web framework, made in JavaScript, that's become extremely popular over the last few years.<br />
<br />
In general, JavaScript frameworks are very trendy right now; it can be hard to keep up with the new cool thing. In fact, there's a joke website https://dayssincelastjavascriptframework.com/, that "tracks" how long it's been since a new framework has come out.<br />
<br />
== Non-Blocking I/O ==<br />
<br />
You dabbled in the concept of non-blocking I/O when you implemented AJAX in the previous JavaScript module. Node.js uses this execution model at its core.<br />
<br />
The core idea is the use of '''''anonymous functions''''' as ''callbacks'' for processing the results of intensive operations. Consider the pseudo-code:<br />
<br />
<source lang="javascript"><br />
// Blocking I/O Pseudo-Code<br />
<br />
var data = database.query("select * from news");<br />
print data[0].title;<br />
</source><br />
<br />
The above pseudo-code queries a database, saves the result of the query in a variable named ''data'', and then prints out the first title in ''data''. The problem arises when multiple clients all want to access the server at the same time. ''In a blocking I/O model, a client needs to wait until all other clients are finished before it can start its process.'' With intensive operations and thousands of clients, this can easily crash your server!<br />
<br />
The solution is to use ''non-blocking I/O''. Consider this revised pseudo-code:<br />
<br />
<source lang="javascript"><br />
// Non-Blocking I/O Pseudo-Code<br />
<br />
database.query("select * from news", function(data){<br />
print data[0].title;<br />
});<br />
</source><br />
<br />
The revised pseudo-code achieves the same end result as the first version. However, ''it allows other clients to perform tasks while this process is waiting for the database to be queried!'' The code occurs in two parts: first, we start the query. Second, ''when the query is complete'', our '''anonymous callback function''' is executed. In Node.js, callback functions are usually passed one or more parameters.<br />
<br />
Better yet, with non-blocking I/O, you have no concurrency issues, because everything runs in just one thread. Nifty!<br />
<br />
== Installing Node.js ==<br />
<br />
Run the following commands to install Node and NPM:<br />
<br />
<source lang="bash"><br />
$ curl --silent --location https://rpm.nodesource.com/setup_12.x | sudo bash -<br />
$ sudo yum install -y nodejs<br />
</source><br />
<br />
<br />
<!-- The unofficial instructions for installing Node.js can be found here: https://gist.github.com/isaacs/579814<br />
<br />
There are several choices, but my favorite is probably ''use-nave-no-shell.sh''.<br />
<br />
The instructions at the above link have a couple bugs. If you run this sequence of commands, Node and NPM will install correctly:<br />
<br />
<source lang="bash"><br />
$ mkdir ~/.nave<br />
$ cd ~/.nave<br />
$ wget http://github.com/isaacs/nave/raw/master/nave.sh<br />
$ sudo ln -s $PWD/nave.sh /usr/local/bin/nave<br />
$ chmod a+x nave.sh<br />
$ sudo chown -R $USER:$USER /usr/local<br />
$ nave usemain stable<br />
$ curl -L https://www.npmjs.org/install.sh | sh<br />
</source><br />
<br />
--><br />
<br />
== Your First Node.js Application: Hello World ==<br />
<br />
Let's try running the example application given on the front page of nodejs.org:<br />
<br />
<source lang="javascript"><br />
const http = require('http');<br />
http.createServer(function (req, res) {<br />
res.writeHead(200, {<br />
'Content-Type': 'text/plain'<br />
});<br />
res.end('Hello World\n');<br />
}).listen(3456);<br />
console.log('Server running at http://localhost:3456/');<br />
</source><br />
<br />
Paste the example into a file named `hello.js`, and then run it by calling `node hello.js`. You should now be able to see your Hello World by visiting your server at port 3456! (Press ^C to stop the application.) '''Note:''' If you're running the code from your EC2 instance, you will need to open port 3456.<br />
<br />
Let's walk through each line in the above example.<br />
<br />
* <code>var http = require('http');</code> enables us to use Node's built-in HTTP server. We've been spoiled that languages like PHP automatically load all of the libraries that we need. However, '''''most functionality in Node.js is NOT loaded by default.''''' When you want to use any non-fundamental feature of Node, you need to ''require'' it into a variable, as this example does with the HTTP package. You should be familiar with this concept when you needed to use ArrayList and other specialty packages in Java in CSE 132.<br />
* <code>http.createServer(function (req, res) { ... }).listen(3456);</code> uses the HTTP server API to listen for HTTP connections on port 3456. The anonymous callback function will be called whenever a connection is made.<br />
* <code>res.writeHead(200, { 'Content-Type': 'text/plain' });</code> specifies the Content-Type header to be "text/plain".<br />
* <code>res.end('Hello World\n');</code> writes "Hello World" to the response.<br />
<br />
Note the use of non-blocking I/O, even in this one little example. ''Whenever a connection is made, the callback function will be called and passed parameters associated with that connection.''<br />
<br />
== A Static File Server Using Node.js ==<br />
<br />
Node.js does not automatically serve up static files in the way that an Apache/PHP does. We need to either use an extension that handles this for us, like Express, or we need to write our own code to make a simple static file server. The latter option is really not all that difficult, and it gives good insight into how a static file server works.<br />
<br />
=== Installing Packages ===<br />
<br />
In order for the example code below to work, you need to install the ''mime'' package. To do this, '''cd to the working directory where you will save your Node.js JavaScript file''' and run:<br />
<br />
<source lang="bash">$ npm install mime --save</source><br />
<br />
''npm'' is the package manager for Node.js. Unlike all of the package managers we've used up to this point, ''npm'' installs dependencies locally, ''not'' globally. This means that you can have two different projects using different versions of the same package. ''npm'' will create a ''node_modules'' directory in the CWD and will install the packages into it.<br />
<br />
'''Note:''' When using npm to install local dependencies, '''''do not use sudo'''''. It will screw up your file permissions.<br />
<br />
=== Static Fileserver Code ===<br />
<br />
The following code will make an HTTP server on port 3456 that serves up all static files in <STATIC DIRECTORY NAME> relative to app.js.<br />
<br />
'''Make an attempt to understand this code.''' It's important that you are comfortable with the non-blocking nature, as well as how we handle file I/O. <br />
<br />
<source lang="javascript"><br />
// Require the functionality we need to use:<br />
var http = require('http'),<br />
url = require('url'),<br />
path = require('path'),<br />
mime = require('mime'),<br />
path = require('path'),<br />
fs = require('fs');<br />
<br />
// Make a simple fileserver for all of our static content.<br />
// Everything underneath <STATIC DIRECTORY NAME> will be served.<br />
var app = http.createServer(function(req, resp){<br />
var filename = path.join(__dirname, "<STATIC DIRECTORY NAME>", url.parse(req.url).pathname);<br />
(fs.exists || path.exists)(filename, function(exists){<br />
if (exists) {<br />
fs.readFile(filename, function(err, data){<br />
if (err) {<br />
// File exists but is not readable (permissions issue?)<br />
resp.writeHead(500, {<br />
"Content-Type": "text/plain"<br />
});<br />
resp.write("Internal server error: could not read file");<br />
resp.end();<br />
return;<br />
}<br />
<br />
// File exists and is readable<br />
var mimetype = mime.getType(filename);<br />
resp.writeHead(200, {<br />
"Content-Type": mimetype<br />
});<br />
resp.write(data);<br />
resp.end();<br />
return;<br />
});<br />
}else{<br />
// File does not exist<br />
resp.writeHead(404, {<br />
"Content-Type": "text/plain"<br />
});<br />
resp.write("Requested file not found: "+filename);<br />
resp.end();<br />
return;<br />
}<br />
});<br />
});<br />
app.listen(3456);<br />
</source><br />
<br />
=== Port 3456 ===<br />
<br />
We are running our server on port 3456 as opposed to the default web server port, which of course is 80. We therefore need to open our Node.js application like this:<br />
<br />
http://ec2-xx-xx-xx-xx.compute-1.amazonaws.com:3456/path.extension<br />
<br />
However, this won't work on the first time. ''Why?'' (Try to figure this out on your own before reading the next paragraph.)<br />
<br />
We need to open port 3456 on our Amazon EC2 instance. Remember when you opened port 80 way back in Module 2? We need to do the same sort of procedure again now.<br />
<br />
# Log into your EC2 management console<br />
# Go to "Security Groups"<br />
# Select your security group from Module 2<br />
# Under "Inbound", create a custom TCP rule for port 3456, and apply your changes.<br />
<br />
== Node.js Security ==<br />
<br />
Just because we're writing in JavaScript doesn't mean that we can forget about the security practices you've been learning in the last three months of CSE 330. XSS is still a problem, as is the use of ''eval'', CSRF attacks, and so on.<br />
<br />
The two links below have good information about security vulnerabilities specific to Node.js that you should think about when crafting your application.<br />
<br />
# Book from PragProg ($24, 2015): https://pragprog.com/book/kdnodesec/secure-your-node-js-web-application<br />
# Slideshow from a Switzerland Conference on Application Security (2012): http://www.slideshare.net/ASF-WS/asfws-2012-nodejs-security-old-vulnerabilities-in-new-dresses-par-sven-vetsch<br />
<br />
== Node.js Conventions ==<br />
<br />
There ought to be a standard way to save metadata about your app, right? Well, ''npm'' introduces a straightforward way to do this in the form of a ''package.json'' file.<br />
<br />
To make your ''npm'' file with a step-by-step prompt, run in your project root directory:<br />
<br />
<source lang="bash"><br />
$ npm init<br />
</source><br />
<br />
One nifty feature of ''package.json'' is the way it automatically handles dependencies. For example, you can put the following lines in your ''package.json'':<br />
<br />
<source lang="javascript"><br />
"dependencies": {<br />
"mime": "~2.4.6",<br />
"socket.io": "~1.0.0"<br />
},<br />
</source><br />
<br />
Then, back on the command line, when you run<br />
<br />
<source lang="bash"><br />
$ npm install<br />
</source><br />
<br />
it automatically installs the dependencies for you! No more headaches of trying to figure out which modules you need to install; all that information is saved for you in your code base.<br />
<br />
'''Tip:''' Once you set up your ''package.json'' file, you can automatically add a dependency to it by using the ''--save'' argument on ''npm install'': <code>npm install --save socket.io</code><br />
<br />
[[Category:Module 6]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_5&diff=2758FAQ - Mod 52020-12-21T01:32:06Z<p>Mitch: Created page with "Welcome to the frequently asked questions page for Module 5. As many common questions can come up on Piazza, some of those questions are consolidated here. == File Structure/..."</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 5. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== File Structure/Languages ==<br />
<br />
=== Can I redirect users to another page after login/for any other reason? ===<br />
For this module, you can '''not''' redirect a user to another page for login or refresh the page on logout. You should have '''one''' single html file , and any on-screen changes should be done through DOM manipulation in Javascript.<br />
<br />
=== Can/should I use PHP in this module? ===<br />
PHP should be used to access the MySQL database for this module, but you should use Javascript for most other functionality. The focus of this module is for you to learn more about Javascript and the DOM, so do not use PHP to redirect to other pages or refresh the current one.<br />
<br />
== CSRF Tokens ==<br />
<br />
=== How do I pass CSRF tokens between PHP and Javascript? ===<br />
At the end of your PHP script execution, you can send values back to where you initially called the script from. Think about how you can use this to then store the token in Javascript.<br />
<br />
<br />
== HTML Validator ==<br />
<br />
=== I'm getting a validation warning about missing an src attribute for my weather widget, what should I do about this? ===<br />
Before you fetch the data in the weather widget, you may not have a src attribute for your img tags. Your warning will likely look like this:<br />
<br />
<source lang=bash><br />
Element img is missing required attribute src<br />
</source><br />
<br />
An easy way to avoid this warning is to simply put a temporary image on the screen before you load in the weather data.</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_3&diff=2757FAQ - Mod 32020-12-21T01:16:21Z<p>Mitch: </p>
<hr />
<div>Welcome to the frequently asked questions page for Module 3. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== Primary Keys ==<br />
<br />
=== Why am I getting an error when adding a foreign key? ===<br />
<br />
==== Non-Unique Primary Key ====<br />
<br />
This issue can be a result of a non-unique primary key. Take the courses table in this module, for example. Multiple courses can have the same course code if they are in different departments, so generating a primary key in reference to only course code is not enough. Think about what other fields to include to make a primary key truly unique, as you cannot have repeating primary keys.<br />
<br />
==== Primary Key and Foreign Key Parameters ====<br />
<br />
Another reason that adding a foreign key can result in an error is if it does not reference the entire primary key. For a foreign key to be properly generated, it needs to reference the entire primary key, even if that means including multiple parameters.<br />
<br />
==== Type Mismatch ====<br />
<br />
A third common reason that a foreign key cannot be properly generated is that the parameters included when generating the key are different types. For example, of one of the parameters is of type TINYINT and another is of type SMALLINT, the key cannot be generated properly. When generating the key, make sure the parameters are of matching type.<br />
<br />
== Modifying Tables ==<br />
<br />
=== Why can't I modify my table? ===<br />
<br />
You will run into an issue if you try to modify your table after adding a foreign key. Anything from adding to the table, to changing types, to modifying/adding charsets will not be possible once the foreign key has been added. If you do need to edit the table after having added a foreign key, you will need to drop the key before making edits to the table. The error will likely look something like this, especially if you are trying to add or delete elements:<br />
<br />
<source lang=bash><br />
Error adding entry: Cannot add or update a child row: a foreign key constraint fails<br />
</source><br />
<br />
== CSRF Tokens ==<br />
<br />
=== When should I generate my CSRF Token? ===<br />
You should initially generate a CSRF token on '''login'''. However, you will want to '''verify''' this token when completing all POST requests.<br />
<br />
[[Category:Module 3]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_3&diff=2756FAQ - Mod 32020-12-21T00:35:12Z<p>Mitch: </p>
<hr />
<div>Welcome to the frequently asked questions page for Module 3. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== Primary Keys ==<br />
<br />
=== Why am I getting an error when adding a foreign key? ===<br />
<br />
==== Non-Unique Primary Key ====<br />
<br />
This issue can be a result of a non-unique primary key. Take the courses table in this module, for example. Multiple courses can have the same course code if they are in different departments, so generating a primary key in reference to only course code is not enough. Think about what other fields to include to make a primary key truly unique, as you cannot have repeating primary keys.<br />
<br />
==== Primary Key and Foreign Key Parameters ====<br />
<br />
Another reason that adding a foreign key can result in an error is if it does not reference the entire primary key. For a foreign key to be properly generated, it needs to reference the entire primary key, even if that means including multiple parameters.<br />
<br />
==== Type Mismatch ====<br />
<br />
A third common reason that a foreign key cannot be properly generated is that the parameters included when generating the key are different types. For example, of one of the parameters is of type TINYINT and another is of type SMALLINT, the key cannot be generated properly. When generating the key, make sure the parameters are of matching type.<br />
<br />
== Modifying Tables ==<br />
<br />
=== Why can't I modify my table? ===<br />
<br />
You will run into an issue if you try to modify your table after adding a foreign key. Anything from adding to the table, to changing types, to modifying/adding charsets will not be possible once the foreign key has been added. If you do need to edit the table after having added a foreign key, you will need to drop the key before making edits to the table. The error will likely look something like this, especially if you are trying to add or delete elements:<br />
<br />
<source lang=bash><br />
Error adding entry: Cannot add or update a child row: a foreign key constraint fails<br />
</source><br />
<br />
[[Category:Module 3]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=CSE_330_Online_Textbook_-_Table_of_Contents&diff=2755CSE 330 Online Textbook - Table of Contents2020-12-20T23:55:16Z<p>Mitch: </p>
<hr />
<div><div style="text-align:center;">[[File:CSE330Banner.png]]</div><br />
<br />
__NOTOC__ <br />
<div style="column-width: 300px; -moz-column-width: 300px; -webkit-column-width: 300px;"><br />
{{FrontPageModule<br />
|num=1<br />
|subject=HTML and CSS Fundamentals<br />
|links=<br />
* [[HTML and CSS]]<br />
* [[HTML Forms]]<br />
* [[Git]]<br />
* [[FAQ - Mod 1]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=2<br />
|subject=Linux, Apache, and PHP<br />
|links=<br />
* [[Linux]]<br />
* [[Bash]]<br />
* [[Amazon Web Services]]<br />
* [[SSH]]<br />
* [[Apache]]<br />
* [[PHP]]<br />
* [[Workflow]]<br />
* [[Web Application Security, Part 1]]<br />
* [[FAQ - Mod 2]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=3<br />
|subject=SQL Databases<br />
|links=<br />
* [[Introduction to MySQL]] (installation)<br />
* [[MySQL Schema and State]] (queries)<br />
* [[PHP and MySQL]] (using MySQL from PHP)<br />
* [[Web Application Security, Part 2]]<br />
* [[FAQ - Mod 3]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=4<br />
|subject=Scripting for Rapid Prototyping<br />
|links=<br />
* [[Python]]<br />
* [[Regular Expressions]]<br />
* [[FAQ - Mod 4]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=5<br />
|subject=JavaScript and APIs<br />
|links=<br />
* [[JavaScript]]<br />
* [[AJAX and JSON]]<br />
* [[Web Application Security, Part 3]]<br />
* [[FAQ - Mod 5]]<br />
<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=6<br />
|subject=Real-Time Web Applications<br />
|links=<br />
* [[Node.JS]]<br />
* [[Socket.IO]]<br />
* [[FAQ - Mod 6]]<br />
}}<br />
<br />
<br />
{{FrontPageModule<br />
|num=7<br />
|subject=Creative Project<br />
|links=<br />
* [[Choosing a Platform]]<br />
* [[Web Frameworks]]<br />
}}<br />
<br />
</div><br />
<br />
== Reference ==<br />
<br />
Use this wiki as a starting place for your projects in CSE 330. However, web development is a large field, so it is impossible for us to document everything you might need to know. Here are some other places you should look when you need to find something:<br />
<br />
* [https://developer.mozilla.org/en-US/ The Mozilla Development Network (MDN)], a community-driven source containing documentation and tutorials for Web technologies<br />
* [http://reference.sitepoint.com/html SitePoint], which has a reference page as well as quality articles and tutorials<br />
<br />
If you can't find what you need in any of these places, try using your favorite search engine. '''Be wary of sites that come up on search engines.''' Many HTML reference sites document bad practices and dated techniques. If you're unsure whether a reference site you find is legitimate, ask a TA.<br />
<br />
== Want to Learn More? ==<br />
<br />
The limited amount of time in CSE 330 means that we can cover only a subset of the wide range of possible topics in the field of rapid prototyping and web development. Indeed, the exact topics covered in CSE 330 change from year to year.<br />
<br />
Feel free to browse some of the topics that have previously been covered in CSE 330: [[:Category:Former Content|CSE 330 Former Content]]<br />
<br />
You should also consider following blogs like [http://www.sitepoint.com/ SitePoint] to keep up-to-date on the latest developments in the field of web development.<br />
<br />
== Content License ==<br />
<br />
The content of this wiki is copyright (c) 2013, Washington University in St. Louis, Department of Computer Science. All rights reserved.<br />
<br />
=== Modified BSD License ===<br />
<br />
Redistribution and use in source and binary forms, with or without modification, by a Third Party who has not completed and is not in the process of completing CSE 330, of the code examples or concepts on this wiki, are permitted, provided that the following conditions are met:<br />
<br />
* Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.<br />
* Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.<br />
* Neither the name of the Washington University School of Engineering and Applied Science nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.<br />
<br />
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS TO ALL PARTIES "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.<br />
<br />
=== What it Means ===<br />
<br />
If you are a student in CSE 330, you may use the code from this wiki freely in your projects without the need for attribution. If you are not a student in CSE 330, you may use the code from this wiki freely in your projects with attribution. Either way, the code examples are provided "as is", without any warranty, and Washington University holds no liability for problems arising from the use of the content in this wiki.</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_4&diff=2754FAQ - Mod 42020-12-20T23:54:02Z<p>Mitch: Created page with "Welcome to the frequently asked questions page for Module 4. As many common questions can come up on Piazza, some of those questions are consolidated here. == Regular Express..."</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 4. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== Regular Expressions Cases ==<br />
<br />
=== When parsing for a string, should I look for that string exclusively or that string concatenated with other characters? ===<br />
If you are looking for a string, you should be looking for any exact occurrences of that string. This is the case regardless of what characters are appended to the beginning or the end of said string.<br />
<br />
'''Example:''' Parsing for "hello world"<br />
<br />
'''What Should Work'''<br />
<br />
hello world, hi hello world, hello worldwide, hhhello worlddd<br />
<br />
'''What Shouldn't Work'''<br />
<br />
hello weorld, hello to the world<br />
<br />
=== In RegEx exercise 2, should I accept strings that have more than three consecutive vowels? ===<br />
In this exercise, strings with three ''or more'' vowels should be accepted.<br />
<br />
'''What Should Work'''<br />
<br />
beautiful, queue, coooool!<br />
<br />
=== In RegEx exercise 3, is each line a separate input? ===<br />
Yes. Each line with a potential flight code is a separate input. Your expression does not need to account for separating each potential code.<br />
<br />
=== If a batting average ends in a 0, can I round to two decimal places? ===<br />
A batting average must always be rounded to 3 decimal places, regardless of if it ends in one (or more) zero(s).<br />
<br />
'''Expected Batting Average Outputs'''<br />
<br />
.270, .300, .050<br />
<br />
'''Unacceptable Batting Average Outputs'''<br />
<br />
.27, .3, .05<br />
<br />
== Logistics == <br />
<br />
=== Should I complete this module on my local machine or on my instance? ===<br />
Unlike other modules, this one can be completed on your local machine!<br />
<br />
=== Do I have to save the output of our python script to a .txt file or can I just print it out? ===<br />
You can just print the output of your script. No need to save it to a .txt file</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=Module_4&diff=2753Module 42020-12-20T22:50:49Z<p>Mitch: /* Reading */</p>
<hr />
<div>__NOTOC__<br />
In Module 4, you will learn the fundamentals of Python, a popular scripting language, and Regular Expressions, which give you power in text processing.<br />
<br />
This article contains your assignments for Module 4.<br />
<br />
== Reading ==<br />
<br />
The following articles on the online class wiki textbook contain information that will help you complete the assignments.<br />
<br />
* [[Python]]<br />
* [[Regular Expressions]]<br />
* [[FAQ - Mod 4]]<br />
<br />
== Individual Assignments ==<br />
<br />
=== Learn Python and Regular Expressions ===<br />
<br />
Up to this point in CSE 330, you have used only one programming language: PHP. In Module 4, you will learn a new language: Python. Before starting this assignment, you should look over the [[Python|online textbook article about Python]]. You should be using version 3 (or greater) of Python. Additionally, you may find it helpful to look over the [[Regular Expressions|online textbook article about Regular Expressions]].<br />
<br />
=== Write some Regular Expressions ===<br />
<br />
Please write regular expressions that do each the following:<br />
<br />
# Match the substring "hello world" in a string.<br />
# Find all words in an input string that contains three consecutive vowels, regardless of case.<br />
# Match an input string that is '''entirely''' a flight code, of the format AA####, where '''AA''' is a two-letter uppercase airline code, and '''####''' is a three- or four-digit flight number.<br />
Examples:<br />
Note: text in ''[[red]]'' is matched by the regular expression. Each line is a separate test input string.<br />
Regex 1: Programmers will often write ''[[hello world]]'' as their first project with a programming language.<br />
Regex 2: The ''[[gooey]]'' peanut butter and jelly sandwich was a ''[[beauty]]''.<br />
Regex 3: ''[[AA312]]''<br />
''[[AA1298]]''<br />
''[[NW1234]]''<br />
''[[US443]]''<br />
US31344<br />
AA123 extratext<br />
<br />
<br />
<br />
Save your regexes to text files – one each.<br />
<br />
=== Baseball Stats Counter ===<br />
<br />
The St. Louis Cardinals are the most legendary baseball team in the national league. In this exercise, you will be creating a Python script that reads box scores from a file and computes the Cardinals' players' batting averages in a particular season.<br />
<br />
==== Tips and Instructions ====<br />
<br />
* You should write a Python script file to solve this problem.<br />
* You should use a regular expression to parse players' names, at-bats, hits, and runs from the input file.<br />
* You may want to create a class to hold and compute information about each player.<br />
* Your file should take one command-line argument: the path to an input file. If no path is given, your program should print a usage message.<br />
<br />
==== Input ====<br />
<br />
Sample input files may be found here: http://classes.engineering.wustl.edu/cse330/content/cardinals/<br />
<br />
The top of the file contains a citation, and what follows is an entire season of Cardinals Baseball box scores. Each game starts with a title; for example:<br />
<br />
=== St.Louis Cardinals vs. Chicago Cubs, 1940-04-19 ===<br />
<br />
What follows are the performance of each player in that game. The format of each line is as follows:<br />
<br />
XXX batted # times with # hits and # runs<br />
<br />
where '''XXX''' is the player's name (you may assume that the name is unique), and each '''#''' are integers representing the number of "at bats", the number of "hits", and the number of "runs", respectively.<br />
<br />
==== Output ====<br />
<br />
Your script needs to output all players' batting average across the season. A player's batting average is that player's total hits divided by that player's total at-bats throughout the entire season. For example, Johnny Hopp was at bat 149 times in 1940, and he had 41 hits, so his batting average was 0.275.<br />
<br />
Each line in the output should have the format:<br />
<br />
XXX: #.###<br />
<br />
where '''XXX''' is the player's name, and '''#.###''' is the player's batting average, '''rounded''' (not truncated) to three decimal places.<br />
<br />
The players should be sorted by batting average, with the highest batting average on top. If two players have the exact same batting average (before rounding occurs), the order between those two players is unimportant.<br />
<br />
For example, the correct output for the 1940 season is:<br />
<!-- Jimmy Brown was 0.280 and Ira Hutchinson was 0.125 --><br />
<source lang="text"><br />
Pepper Martin: 0.316<br />
Walker Cooper: 0.316<br />
Johnny Mize: 0.314<br />
Ernie Koy: 0.310<br />
Enos Slaughter: 0.306<br />
Joe Medwick: 0.304<br />
Terry Moore: 0.304<br />
Joe Orengo: 0.286<br />
Jimmy Brown: 0.280<br />
Marty Marion: 0.279<br />
Don Gutteridge: 0.276<br />
Johnny Hopp: 0.275<br />
Creepy Crespi: 0.273<br />
Mickey Owen: 0.265<br />
Bill DeLancey: 0.250<br />
Don Padgett: 0.242<br />
Stu Martin: 0.238<br />
Eddie Lake: 0.222<br />
Hal Epps: 0.214<br />
Lon Warneke: 0.209<br />
Harry Walker: 0.185<br />
Max Lanier: 0.179<br />
Bill McGee: 0.178<br />
Carl Doyle: 0.174<br />
Mort Cooper: 0.157<br />
Clyde Shoun: 0.145<br />
Carden Gillenwater: 0.130<br />
Bob Bowman: 0.067<br />
</source><br />
<br />
== Grading ==<br />
<br />
We will be grading the following aspects of your work. There are 50 points total.<br />
<br />
'''Assignments (including code) must be committed to Github by the end of class on the due date (commit early and often). Failing to commit by the end of class on the due date will result in a 0. ''' <br />
<br />
Upload your baseball code and a file with your Regular expressions.<br />
<br />
# '''Regular Expressions (15 Points):'''<br />
#* '''Your regex files should contain your regex (with no delimiters or flags) and nothing else.'''<br />
#* Regular Expression 1 Correct and saved in a file named <code>regex1.txt</code> (5 points)<br />
#* Regular Expression 2 Correct and saved in a file named <code>regex2.txt</code>(5 points)<br />
#* Regular Expression 3 Correct and saved in a file named <code>regex3.txt</code>(5 points)<br />
# '''Baseball Stats Counter (35 Points):'''<br />
#* Solution is written entirely in Python and saved in a file named <code>baseball.py</code> (8 points)<br />
#*: ''Note: Failing to write your code in Python 3 will result in losing, at a minimum, points for this category.''<br />
#* Correct usage of one or more regular expressions to parse and extract data from each line of the input file (8 points)<br />
#*: ''Note: You should not be using <code>str.split</code> to extract data.''<br />
#* Script prints a usage message if a command line argument is not present (4 points)<br />
#*: ''Note: For an example of a usage message, see [https://en.wikipedia.org/wiki/Usage_message#Examples this link.]''<br />
#* Output is correct for all test cases (15 points)<br />
#*: ''This includes sorting and rounding.''<br />
<br />
[[Category:Module 4]]<br />
[[Category:Modules]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=CSE_330_Online_Textbook_-_Table_of_Contents&diff=2752CSE 330 Online Textbook - Table of Contents2020-12-20T22:50:33Z<p>Mitch: </p>
<hr />
<div><div style="text-align:center;">[[File:CSE330Banner.png]]</div><br />
<br />
__NOTOC__ <br />
<div style="column-width: 300px; -moz-column-width: 300px; -webkit-column-width: 300px;"><br />
{{FrontPageModule<br />
|num=1<br />
|subject=HTML and CSS Fundamentals<br />
|links=<br />
* [[HTML and CSS]]<br />
* [[HTML Forms]]<br />
* [[Git]]<br />
* [[FAQ - Mod 1]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=2<br />
|subject=Linux, Apache, and PHP<br />
|links=<br />
* [[Linux]]<br />
* [[Bash]]<br />
* [[Amazon Web Services]]<br />
* [[SSH]]<br />
* [[Apache]]<br />
* [[PHP]]<br />
* [[Workflow]]<br />
* [[Web Application Security, Part 1]]<br />
* [[FAQ - Mod 2]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=3<br />
|subject=SQL Databases<br />
|links=<br />
* [[Introduction to MySQL]] (installation)<br />
* [[MySQL Schema and State]] (queries)<br />
* [[PHP and MySQL]] (using MySQL from PHP)<br />
* [[Web Application Security, Part 2]]<br />
* [[FAQ - Mod 3]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=4<br />
|subject=Scripting for Rapid Prototyping<br />
|links=<br />
* [[Python]]<br />
* [[Regular Expressions]]<br />
* [[FAQ - Mod 4]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=5<br />
|subject=JavaScript and APIs<br />
|links=<br />
* [[JavaScript]]<br />
* [[AJAX and JSON]]<br />
* [[Web Application Security, Part 3]]<br />
<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=6<br />
|subject=Real-Time Web Applications<br />
|links=<br />
* [[Node.JS]]<br />
* [[Socket.IO]]<br />
}}<br />
<br />
<br />
{{FrontPageModule<br />
|num=7<br />
|subject=Creative Project<br />
|links=<br />
* [[Choosing a Platform]]<br />
* [[Web Frameworks]]<br />
}}<br />
<br />
</div><br />
<br />
== Reference ==<br />
<br />
Use this wiki as a starting place for your projects in CSE 330. However, web development is a large field, so it is impossible for us to document everything you might need to know. Here are some other places you should look when you need to find something:<br />
<br />
* [https://developer.mozilla.org/en-US/ The Mozilla Development Network (MDN)], a community-driven source containing documentation and tutorials for Web technologies<br />
* [http://reference.sitepoint.com/html SitePoint], which has a reference page as well as quality articles and tutorials<br />
<br />
If you can't find what you need in any of these places, try using your favorite search engine. '''Be wary of sites that come up on search engines.''' Many HTML reference sites document bad practices and dated techniques. If you're unsure whether a reference site you find is legitimate, ask a TA.<br />
<br />
== Want to Learn More? ==<br />
<br />
The limited amount of time in CSE 330 means that we can cover only a subset of the wide range of possible topics in the field of rapid prototyping and web development. Indeed, the exact topics covered in CSE 330 change from year to year.<br />
<br />
Feel free to browse some of the topics that have previously been covered in CSE 330: [[:Category:Former Content|CSE 330 Former Content]]<br />
<br />
You should also consider following blogs like [http://www.sitepoint.com/ SitePoint] to keep up-to-date on the latest developments in the field of web development.<br />
<br />
== Content License ==<br />
<br />
The content of this wiki is copyright (c) 2013, Washington University in St. Louis, Department of Computer Science. All rights reserved.<br />
<br />
=== Modified BSD License ===<br />
<br />
Redistribution and use in source and binary forms, with or without modification, by a Third Party who has not completed and is not in the process of completing CSE 330, of the code examples or concepts on this wiki, are permitted, provided that the following conditions are met:<br />
<br />
* Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.<br />
* Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.<br />
* Neither the name of the Washington University School of Engineering and Applied Science nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.<br />
<br />
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS TO ALL PARTIES "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.<br />
<br />
=== What it Means ===<br />
<br />
If you are a student in CSE 330, you may use the code from this wiki freely in your projects without the need for attribution. If you are not a student in CSE 330, you may use the code from this wiki freely in your projects with attribution. Either way, the code examples are provided "as is", without any warranty, and Washington University holds no liability for problems arising from the use of the content in this wiki.</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_3&diff=2751FAQ - Mod 32020-12-20T22:49:25Z<p>Mitch: /* Modifying Tables */</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 3x. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== Primary Keys ==<br />
<br />
=== Why am I getting an error when adding a foreign key? ===<br />
<br />
==== Non-Unique Primary Key ====<br />
<br />
This issue can be a result of a non-unique primary key. Take the courses table in this module, for example. Multiple courses can have the same course code if they are in different departments, so generating a primary key in reference to only course code is not enough. Think about what other fields to include to make a primary key truly unique, as you cannot have repeating primary keys.<br />
<br />
==== Primary Key and Foreign Key Parameters ====<br />
<br />
Another reason that adding a foreign key can result in an error is if it does not reference the entire primary key. For a foreign key to be properly generated, it needs to reference the entire primary key, even if that means including multiple parameters.<br />
<br />
==== Type Mismatch ====<br />
<br />
A third common reason that a foreign key cannot be properly generated is that the parameters included when generating the key are different types. For example, of one of the parameters is of type TINYINT and another is of type SMALLINT, the key cannot be generated properly. When generating the key, make sure the parameters are of matching type.<br />
<br />
== Modifying Tables ==<br />
<br />
=== Why can't I modify my table? ===<br />
<br />
You will run into an issue if you try to modify your table after adding a foreign key. Anything from adding to the table, to changing types, to modifying/adding charsets will not be possible once the foreign key has been added. If you do need to edit the table after having added a foreign key, you will need to drop the key before making edits to the table. The error will likely look something like this, especially if you are trying to add or delete elements:<br />
<br />
<source lang=bash><br />
Error adding entry: Cannot add or update a child row: a foreign key constraint fails<br />
</source><br />
<br />
[[Category:Module 3]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=Module_3&diff=2750Module 32020-12-20T22:40:30Z<p>Mitch: /* Reading */</p>
<hr />
<div>__NOTOC__<br />
In Module 3, you will learn about MySQL, a web application database.<br />
<br />
This article contains your assignments for Module 3.<br />
<br />
== Reading ==<br />
<br />
The following articles on the online class wiki textbook contain information that will help you complete the assignments.<br />
<br />
* [[Introduction to MySQL]]<br />
* [[MySQL Schema and State]]<br />
* [[PHP and MySQL]]<br />
* [[Web Application Security, Part 2]]<br />
* [[FAQ - Mod 3]]<br />
<br />
== Individual Assignments ==<br />
<br />
You will create a simple grades database containing four tables.<br />
<br />
'''IMPORTANT:''' The individual assignment is to be done by writing queries by hand. (You can use phpMyAdmin to run the queries, but '''do not let phpMyAdmin write your queries for you!''') Writing your own queries gives you a greater understanding of the underlying mechanisms and databases in general. Additionally, having SQL knowledge and experience is a very marketable trait.<br />
<br />
=== Install MySQL and phpMyAdmin ===<br />
<br />
Before you start, '''you need to install MySQL''' on your EC2 instance. You may also install phpMyAdmin, a web frontend to MySQL, if you choose to do so.<br />
<br />
=== Set Up a Database ===<br />
<br />
You may find the following article to be very helpful: [[Introduction to MySQL]]<br />
<br />
# Create a database named '''wustl''' <br />
# Create a user named '''wustl_inst''' and give them the password '''wustl_pass'''<br />
<br />
=== Create Tables ===<br />
<br />
You may find the following article to be very helpful: [[MySQL Schema and State]]<br />
<br />
When creating tables, keep the following items in mind:<br />
<br />
* You should create all tables such that they use the InnoDB storage engine, since we wish to make use of its support of foreign keys. In other database engines, foreign key constraints are not enforced. (If you mess up, you can use ALTER TABLE to change the storage engine.)<br />
* Where it is appropriate, you should take advantage of the ability to define fields NOT NULL so that you do not inadvertently insert incomplete data for a row.<br />
<br />
Create the following tables:<br />
<br />
# Create a table named '''students''' with the following fields:<br />
#* '''id''' of an appropriately-sized unsigned integer type (we will never need to process more than a million students)<br />
#* '''first_name''' of type '''VARCHAR(50)'''<br />
#* '''last_name''' of type '''VARCHAR(50)'''<br />
#* '''email_address''' of type '''VARCHAR(50)'''<br />
#: The primary key should be on the '''id''' field.<br />
# Create a table named '''departments''' with the following fields:<br />
#* '''school_code''' of type '''ENUM''' (e.g. "L" for ArtSci and "E" for Engineering). The options are as follows:<br />
#*: 'L', 'B', 'A', 'F', 'E', 'T', 'I', 'W', 'S', 'U', 'M'<br />
#* '''dept_id''' of an appropriately-sized unsigned integer type (in the foreseeable future there will never be more than 200 departments in a school)<br />
#* '''abbreviation''' of type '''VARCHAR(9)''' (e.g. CSE, ChemE, etc)<br />
#* '''dept_name''' of type '''VARCHAR(200)''' (e.g. Computer Science and Engineering)<br />
#: The primary key should be on two fields: '''school_code''' and '''dept_id'''<br />
#: '''Note:''' Why not just use the department ID for the primary key? The ID numbers are sometimes reused across schools. For instance, department 33 in The College of Arts and Sciences is Psychology while department 33 in The School of Engineering and Applied Sciences is Energy, Environmental and Chemical Engineering. Thus we must also include the school code to differentiate them such that the record for E33 is distinct from that of L33.<br />
# Create a table named '''courses''' with the following fields:<br />
#* '''school_code''' of type '''ENUM'''<br />
#*: This should have the same letters in the same order as the '''school_code''' '''ENUM''' field in the '''departments''' table.<br />
#* '''dept_id''' of the same size of integer as in the '''departments''' table<br />
#* '''course_code''' of type '''CHAR(5)''' (this will hold course codes; e.g., '330S', '131', '2960')<br />
#* '''name''' of type '''VARCHAR(150)'''<br />
#: The appropriate fields in this table should make a foreign key reference to the corresponding fields in '''department'''.<br />
#: In addition, it is up to you to determine the field(s) for the primary key.<br />
#: '''Note:''' If you are unsure which fields to make the foreign keys and feel the need to beg your friends or the TAs to give you the answer, bang your head on your desk whilst repeating "I WILL EXERCISE REASON AND COMMON SENSE AND I WILL CURTAIL MY DESIRE TO BLINDLY FOLLOW DIRECTIONS"<br />
#: ''Disclaimer: don't actually bang your head on your desk, the resulting head trauma may in fact make it harder for you to determine which fields should have associated foreign keys.''<br />
# Create a table named '''grades''' with the following fields:<br />
#* '''pk_grade_ID''' of an appropriately-sized unsigned integer type (should be larger than the one you chose for the '''students''' table). There will never be more than 1,000 grades per student.<br />
#*: You should declare this field to be '''auto_increment''' and make it the primary key.<br />
#*: This is called a ''surrogate key'' as opposed to a ''natural key'' because it doesn't arise "naturally" from the data; that is to say that it is not derived from application data. The use of surrogate keys vs. natural keys is a polemic issue amongst database designers. For a decently unbiased take on the issue, see this page: http://www.agiledata.org/essays/keys.html#Comparison<br />
#*: '''Food for thought:''' Aside from simply exposing you to the concept, can you think of any reasons why a surrogate key might be preferable for this table? Alternatively, what attributes, if any, could you use as a natural key, and what might be the drawbacks of doing so?<br />
#* '''student_id''' of the same integer (unsigned) type that you chose in the '''students''' table<br />
#* '''grade''' of type '''decimal(5,2)'''<br />
#* '''school_code''' of type '''ENUM'''<br />
#*: Can you guess what entries to use for the enum?<br />
#* '''dept_id''' of the same integer type that you've used for this field in other tables<br />
#* '''course_code''' of the same type you chose for the course code in the '''courses''' table<br />
#: The '''grades''' table should have foreign keys to both the '''students''' table and the '''courses''' table.<br />
<br />
=== Populate Tables ===<br />
<br />
Now, populate the tables by downloading the text files given below and loading them into the appropriate tables.<br />
<br />
'''Note:''' Do not insert all the values manually; instead, use the MySQL's ability to load in data from text files.<br />
<br />
You may find the following article to be very helpful: [[MySQL Schema and State]]<br />
<br />
The files containing the data are:<br />
* students: https://classes.engineering.wustl.edu/cse330/content/students_data.txt<br />
* courses: https://classes.engineering.wustl.edu/cse330/content/courses.txt<br />
* departments: https://classes.engineering.wustl.edu/cse330/content/departments_data.txt<br />
* grades: https://classes.engineering.wustl.edu/cse330/content/grades_data.txt<br />
<br />
=== Insert More Data ===<br />
<br />
Insert the following data into the tables that you have created and populated:<br />
<br />
# Insert entries for CSE 330S, CSE 131, and CSE 260M.<br />
#: ''If you don't know CSE's department code, how can you find out using the tables in the database?''<br />
# Insert the grades given for the students named below. <br />
#* '''Ben Harper'''<br />
#** E-mail: '''bharper@ffym.com'''<br />
#** Student ID: '''88'''<br />
#** Grades:<br />
#*** 35.5 in CSE 330S<br />
#*** 0 in CSE 131<br />
#*** 95 in CSE 260M<br />
#* '''Matt Freeman'''<br />
#** E-mail: '''mfreeman@kickinbassist.net'''<br />
#** Student ID: '''202'''<br />
#** Grades:<br />
#*** 100 in CSE 330S<br />
#*** 90.5 in CSE 131<br />
#*** 94.8 in CSE 260M<br />
#* '''Marc Roberge'''<br />
#** E-mail: '''mroberge@ofarevolution.us'''<br />
#** Student ID: '''115'''<br />
#** Grades:<br />
#*** 75 in CSE 330S<br />
#*** 37 in CSE 131<br />
#*** 45.5 in CSE 260M<br />
<br />
=== Querying Your Database ===<br />
<br />
Now that you have a fully-functional, populated database, let's do some queries on it!<br />
<br />
Please Running the following <code>SELECT</code> queries, then copy the output to a text file of the form <code>query1.txt</code>, <code>query2.txt</code>, and so on, and commit them with the rest of your repository (be sure to include your query command and the entire response, including the number of results found). For each query, only the requested columns should be present. You will receive 0 points for any query that includes additional columns.<br />
<br />
# Select the entire grades table.<br />
# Select all fields describing the courses offered in the College of Arts & Sciences (school code <code>L</code>).<br />
# The names, student IDs, and CSE330 grades of all students who are in CSE330S.<br />
#: '''Note:''' This query should involve joins. You don't need to use any aggregation functions.<br />
# The names, e-mails, and average grades of any student with an average below 50 so that the dean can send them an email notification that they are now on academic probation.<br />
#: ''You should be able to do this in only one query, without making any temporary tables. You will need to use aggregation functions and the <code>HAVING</code> keyword.''<br />
# An individual report card for Jack Johnson, consisting of only his student ID, e-mail address, and average grade.<br />
#: ''Again, you should be able to do this in just one query, using the correct combination of aggregation functions and joins.''<br />
#: '''Note:''' Your query must look for students with the name "Jack Johnson" instead of hard-coding the student ID.<br />
<br />
== Group Project ==<br />
<br />
You will work in pairs on this project. You may work with the same partner from Module 2, or change to someone else.<br />
<br />
'''Important Reminder:''' frequently commit your work to your Git repository as a backup!<br />
<br />
=== Simple News Web Site ===<br />
<br />
'''Examples:'''<br />
* http://digg.com/<br />
* http://slashdot.org/<br />
* https://news.ycombinator.com/<br />
<br />
You should use '''PHP''' unless you get permission to use another web technology from the instructor. You may also use phpMyAdmin to help set up databases.<br />
<br />
You may find this wiki article helpful: [[PHP and MySQL]]<br />
<br />
==== Requirements ====<br />
<br />
* Users can register for accounts and then log in to the website.<br />
* Accounts should have both a username and a ''secure'' password. '''NEVER store plaintext passwords in a database!'''<br />
*: For more information on password security, refer to [[Web Application Security, Part 2#Password Security|the Web Application Security guide]].<br />
* Registered users can submit story commentary.<br />
*: A link can be associated with each story, and they should be stored in a separate database field from the story<br />
* Registered users can comment on any story.<br />
* Unregistered users can only view stories and comments.<br />
* Registered users can edit and delete their stories and comments.<br />
* All data must be kept in a MySQL database (user information, stories, comments, and links).<br />
* Creative Portion<br />
<br />
=== Web Security and Validation ===<br />
<br />
No application is finished until much thought is put into web security and best practice. Throughout this course, we heavily emphasize the dogma of [https://mirrors.meiert.org/coderesponsibly.org/ responsible] coding.<br />
<br />
Read this week's Web Application Security guide: [[Web Application Security, Part 2]]. In particular, your project needs to:<br />
<br />
* '''Your application needs to be secure against SQL injection attacks'''. If you are using prepared queries, you should already be safe on this front.<br />
* '''Your passwords need to be securely hashed salted''' to prevent rainbow table attacks.<br />
* '''You should pass tokens in forms''' to prevent CSRF attacks.<br />
* '''You should check all preconditions on the server side''' to prevent Abuse of Functionality attacks.<br />
<br />
You shouldn't forget the practices you learned last week:<br />
<br />
* '''Your page should validate''' with no errors or warnings through the W3C validator.<br />
* '''Filter Input and Escape Output''', but not the other way around.<br />
<br />
== Grading ==<br />
<br />
We will be grading the following aspects of your work. There are 100 points total.<br />
<br />
<br />
'''Assignments (including code) must be committed to Github by the end of class on the due date (commit early and often). Failing to commit by the end of class on the due date will result in a 0. ''' <br />
<br />
<br />
'''If you do not include a link to your group portion running on your instance in your group portion README.md, you will receive a 0 for the group portion.''' <br />
________<br />
<br />
# '''MySQL Queries (25 Points):'''<br />
#* A MySQL server is running on your instance. Put a screenshot in your repository of your terminal connected to your MySQL server. ( (2 points)<br />
#* Tables' fields, including data types and foreign keys, are correct (8 points)<br />
#*: ''Note: To demonstrate the structure of your tables, you should commit a text file containing the output of the <code>SHOW CREATE TABLE</code> command '''for each table.''' Each table's file should have a name of the form <code>tablename.sql</code> (e.g. <code>students.sql</code>).''<br />
#* The output of each of the five queries is correct. (3 points each)<br />
#*: ''Note: To demonstrate the output of your queries, text files containing the 'entire' result (including the query and number of records found) of running each query should committed to Github. The file for query 1 should be named <code>query1.txt</code>, the file for query 2 should be named <code>query2.txt</code>, and so on.''<br />
# '''News Site (60 Points):'''<br />
#* '''''User Management (20 Points):'''''<br />
#** A session is created when a user logs in (3 points)<br />
#** New users can register (3 points)<br />
#** Passwords are hashed, salted, and checked securely (3 points)<br />
#**: ''Note: You will receive 0 points for this section if you use the <code>==</code> or <code>===</code> operators to compare password hashes, or if you use the <code>crypt</code> or <code>md5</code> functions at any point.''<br />
#** Users can log out (3 points)<br />
#** A user can edit and delete his/her own stories and comments but cannot edit or delete the stories or comments of another user (8 points)<br />
#* '''''Story and Comment Management (20 Points):'''''<br />
#** Relational database is configured with correct data types and foreign keys (4 points)<br />
#*: ''Note: To demonstrate the structure of your database, you should commit a 'single' text file containing the output of the <code>SHOW CREATE TABLE</code> command '''for all tables in your database,''' called <code>tables.sql</code>. This one file should contain the output for all of your tables.<br />
#** Stories can be posted (3 points)<br />
#** A link can be associated with each story, and is stored in a separate database field from the story (3 points)<br />
#** Comments can be posted in association with a story (4 points)<br />
#** Stories can be edited and deleted (3 points)<br />
#** Comments can be edited and deleted (3 points)<br />
#**: ''Note: Although there are only 6 points allocated for editing/deleting in this section, there are 8 more points at stake in the User Management section that cannot be earned unless editing/deleting is implemented. Implementing editing but not deleting, or vice-versa, will result in earning half the points.''<br />
#* '''''Best Practices (15 Points):'''''<br />
#** Code is well formatted and easy to read, with proper commenting (3 points)<br />
#** Safe from SQL Injection attacks (2 points)<br />
#** Site follows the FIEO philosophy (3 points)<br />
#** All pages pass the W3C HTML and CSS validators (2 points)<br />
#** CSRF tokens are passed when creating, editing, and deleting comments and stories (5 points)<br />
#* '''''Usability (5 Points):'''''<br />
#** Site is intuitive to use and navigate (4 points)<br />
#** Site is visually appealing (1 point)<br />
# '''Creative Portion (15 Points)''' (see below)<br />
#* '''''Make sure you have a README.md file in your group repo with the following:'''''<br />
#** Names and Student IDs of all the group members<br />
#** A link to your homepage of the site<br />
#** A brief description of what you did for your creative portion<br />
#** Any additional login details needed for the TA<br />
<br />
[[Category:Module 3]]<br />
[[Category:Modules]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=Module_2&diff=2749Module 22020-12-20T22:40:04Z<p>Mitch: /* Reading */</p>
<hr />
<div>__NOTOC__ <br />
Module 2 introduces you to Linux, a command-line environment, the Apache web server, and PHP. You will create and configure your own cloud instance, install Apache and related software, and then form groups to make a simple file sharing site.<br />
<br />
<span style="font-size:1.3em; line-height:1.2em; color:blue;">'''DO NOT WAIT UNTIL THE LAST MINUTE TO START ON THIS (or any) MODULE!''' The most common reason students perform poorly in this class is procrastination. You have been warned.</span><br />
<br />
== Reading ==<br />
<br />
The following articles on the online class wiki textbook contain information that will help you complete the assignments.<br />
<br />
* [[Linux]]<br />
* [[Bash]]<br />
* [[Amazon Web Services]]<br />
* [[SSH]]<br />
* [[Apache]]<br />
* [[PHP]]<br />
* [[Workflow]]<br />
* [[VS Code]]<br />
* [[Web Application Security, Part 1]]<br />
* [[FAQ - Mod 2]]<br />
<br />
== Individual Assignments ==<br />
<br />
{{RequiredInstructions|content=<br />
<br />
<span style="color:red">There are a lot of wiki pages that you need to read in order to complete the individual portion of Module 2. The wiki pages contain an assortment of required steps, optional steps, and information. To make things easier, we have highlighted the ''required steps'' with a red bar, like you see on the left of this message. Do not skip anything marked with a red bar, or else you will not have a perfectly configured instance.</span><br />
<br />
}}<br />
<br />
=== Learn About Linux ===<br />
<br />
Linux is an open-source operating system based on UNIX. Linux is highly versatile and is used in a wide range of applications.<br />
<br />
If you are not a Linux guru, read the Linux guide to get started: [[Linux]]<br />
<br />
=== Windows Users Only: Enable Windows Subsystem for Linux (WSL) or Install Cygwin ===<br />
<br />
<br />
You will need WSL or Cygwin in order to log into and configure your EC2 instance. Cygwin is already installed on the CEC machines. If you're using Windows 10, you can use WSL, which is an officially-supported way of accessing a Linux terminal on Windows. If not, you'll have to use Cygwin. Instructions for installing either on your personal machine are located in [[Workflow#Cygwin|the Workflow guide]].<br />
<br />
Mac OS X users should located the "Terminal" application, which is installed by default; you will need this in the coming steps.<br />
<br />
=== Create an AWS EC2 Instance ===<br />
<br />
Once you understand [[Linux]], you need to set up your Amazon EC2 Instance. Use the AWS article to guide you through the process: [[Amazon Web Services]]<br />
<br />
=== Configure SSH ===<br />
<br />
Follow the instructions in [[SSH#SSH Configuration|the SSH guide]] to do the following:<br />
<br />
# Create your own SSH key pair<br />
# Log in as the default user to your EC2 instance<br />
# Create a new user<br />
# Give the new user your SSH public key<br />
<br />
From now on, when you need to log into your EC2 instance as an administrator, just pop up a terminal and run:<br />
<br />
<source lang="bash"><br />
$ ssh your-username@ec2-xx-xx-xx-xx.compute-1.amazonaws.com<br />
</source><br />
<br />
<br />
To save from typing this command in every time you want to access your server, you can set an '''alias''' in your terminal.<br />
<br />
In the '''Mac''' terminal, vim ~/.bash_profile and input the following command:<br />
$ alias aws='ssh your-username@ec2.xx-xx-xx-xx.compute-1.amazonaws.com'<br />
Now, whenever you type aws in your terminal, it will type your ssh command.<br />
<br />
In '''Cygwin''', vim ~/.bash_profile and input the following:<br />
export aws="ssh your-username@ec2.xx-xx-xx-xx.compute-1.amazonaws.com"<br />
And you run this command by typing '''$aws'''<br />
Also note that you may have to restart your terminal for this to take effect, or put the command in your ~/.bashrc file<br />
<br />
=== Install Essential Packages ===<br />
<br />
Recall that software installation in Linux instances is usually handled through a package manager, like '''yum'''. For more information, refer to [[Linux#Repository-Based Package Managers|the Linux guide]].<br />
<br />
To make sure everything is working properly, '''install your first package(s) according to the ''Essential Packages'' subsection in the Linux guide.'''<br />
<br />
=== Set the Timezone ===<br />
<br />
'''Set your server to use US Central time (America/Chicago).''' Instructions are in the Linux guide: [[Linux#Synchronizing Date and Time]]<br />
<br />
=== Set Up the Apache Web Server ===<br />
<br />
You need to '''install the Apache web server on your EC2 instance'''. Refer to [[Apache|the Apache guide]].<br />
<br />
In order for your web server to be accessible, you need to '''open up Port 80 on your EC2 instance'''. Instructions are in the AWS guide: [[Amazon Web Services#Enabling Web Access to your EC2 Instance]]<br />
<br />
'''Enable the UserDir module in Apache.''' Instructions are in the Apache guide: [[Apache#The UserDir Module]]<br />
<br />
=== Install PHP ===<br />
<br />
You need to '''install PHP on your EC2 server'''. Instructions are at the top of the PHP guide: [[PHP]]<br />
<br />
You need to '''configure PHP to show errors'''. Instructions are immediately below installation in the PHP guide.<br />
<br />
=== Learn about the PHP Language ===<br />
<br />
Before you can continue, you will need to make yourself acquainted with PHP language components. Read the PHP guide for an overview: [[PHP#PHP Language Components]]<br />
<br />
=== Set Up your Workspace ===<br />
<br />
You are now ready to set up the workspace that you will be using for the rest of the semester. Follow the instructions in [[Workflow]] to:<br />
<br />
# Make an account on GitHub<br />
# Setup a repo using GitHub Classroom<br />
# Clone your CSE 330 repo from GitHub<br />
# Install a text editor such as '''VSCode''' to write your assignments with<br />
# Either install an FTP client, or use SFTP through command line, to transfer files from your local machine to your instance<br />
<br />
=== Calculator ===<br />
<br />
'''Make a calculator using PHP and an HTML form.''' The form should have two inputs. The form should submit a GET request either back to the same page or to a different results page. The calculator should support addition, subtraction, multiplication, and division by means of a radio button group on the page. (Consider edge cases!)<br />
<br />
=== Git Tutorial ===<br />
Complete all of the levels of the Main and Remote sections of [https://learngitbranching.js.org/ this Git tutorial]. After you finish the tutorial, take two screenshots showing completion of all of the levels of the Main and Remote sections. Place these two screenshots in your Module 2 Individual repo.<br />
<br />
== Group Project ==<br />
<br />
You will work in pairs (that means you and one other person) on this project.<br />
<br />
<span style="font-size:1.3em; line-height:1.2em; color:blue;">In this module, and all future modules, the group portion builds off of material you learn in the individual portion. You should therefore complete the individual portions prior to working on the group portions. (Trust us: it will make your life easier!)</span><br />
<br />
'''Important Reminder:''' frequently commit your work to your repository as a backup!<br />
<br />
=== Simple File Sharing Site ===<br />
<br />
You will be making a simple file sharing site that supports uploading, viewing, and deleting files associated with various users. Details:<br />
<br />
* You should have a file named '''users.txt''' stored in a secure place on your filesystem. It should have at least three usernames, with one username per line.<br />
*: Passwords add an extra layer of complexity (encryption) that we will cover in Module 3. You will not earn credit for implementing passwords as your creative portion for this module.<br />
* Users of the file sharing site should be able to enter their username and then log in.<br />
*: You may implement logins using session variables, or you may implement them using a GET parameter that is passed between pages. You will need to always use sessions starting in Module 3.<br />
* Users should see a list of all files associated with their username after the log in.<br />
* Users should be able to view, upload, and delete files associated with their username.<br />
* The URI should NOT reveal the internal file structure of your web site.<br />
** Example of what not to do: http://www.example.com/download.php?file=/home/paul/file.txt<br />
** Another bad example: http://www.example.com/~user/file.txt<br />
** Good example: http://www.example.com/view.php?user=music&name=file.txt<br />
*: In general, don't reveal any internal information about the site.<br />
*: '''Food for thought:''' Given that Apache processes (with the exception of the main process) do not run as root, but rather as the user apache, how can you allow both your user account and the php scripts to read and write the <br />
*:necessary files?<br />
*:: ''Hint:'' You shouldn't be storing the user-uploaded files in public_html (that is only the place for your own web-page files), <br />
*::''Hint number 2:'' you will need to use chown to change permissions to let user apache have permissions on the user-files (that '''are not''' in the public_html folder). If you don't know what this does or how to do this, look at the [[Apache]] page<br />
* You should customize your file sharing site by implementing an additional feature or two as part of the '''creative portion'''.<br />
<br />
You will probably find the PHP guide on this wiki to be helpful: [[PHP#Other PHP Tips]]<br />
<br />
=== Web Security and Validation ===<br />
<br />
Your project needs to demonstrate that thought was put into web security and best practice. For more information, see this week's Web Application Security guide: [[Web Application Security, Part 1]]<br />
<br />
In particular:<br />
<br />
* '''Your application needs to follow the conventions of FIEO (Filter Input and Escape Output)'''. Things you should filter include file names, usernames, and so on.<br />
* '''Your project must pass the W3C Validator with no errors or warnings'''. For more information, see the HTML and CSS guide: [[HTML and CSS#Validation]]<br />
<br />
== Grading ==<br />
<br />
We will be grading the following aspects of your work. There are 120 points total. <br />
<br />
<br />
<br />
'''Assignments (including code) must be committed to GitHub by the end of class on the due date. Commit early and often. Failing to commit by the end of class on the due date will result in a 0. <br />
<br />
_____________<br />
<br />
# '''Cloud Instance and Web Server (30 Points):'''<br />
#* You can SSH into your instance using your own custom username and SSH key. Put a screenshot in your repository of your terminal SSH-ing into your instance (15 points)<br />
#* Your custom username is able to perform SUDO commands. Put a screenshot in your repository of you successfully executing a command with sudo (5 points)<br />
#* The time zone is correct on your instance. Put a screenshot in your repository of the results of the `date` command (5 points)<br />
#* The UserDir Apache module is working. Place a file in /home/<username>/public_html and link to the file in your README.md (5 points)<br />
# '''PHP Calculator (15 Points):'''<br />
#* The calculator is able to perform all four functions with floating point numbers (2 points each, 8 points in total)<br />
#* Each function is given as a radio button choice (4 points)<br />
#* The calculator page passes the W3C HTML validator (3 points)<br />
#* '''''Make sure you have a README.md file in your individual repo with the the link to your calculator.''''' See the Creative Portion section for more information about .md files.<br />
# '''Git Tutorial (20 Points):'''<br />
#* Place the two screenshots displaying the completed levels of the Main and Remote sections in your Individual repo<br />
# '''File Sharing Site (40 Points):'''<br />
#* '''''File Management (25 Points):'''''<br />
#** Users should not be able to see any files until they enter a username and log in (4 points)<br />
#**: ''Remember that users.txt should be stored in a secure location on your filesystem. That is, '''you should not be able to type any URL into your browser and see the raw users.txt file!'''''<br />
#** Users can see a list of all files they have uploaded (4 points)<br />
#** Users can open files they have previously uploaded (5 points)<br />
#**: ''Note: Users should be able to open not only plain text files but also other file formats: images, spreadsheets, etc.''<br />
#** Users can upload files (4 points)<br />
#**: ''Note: Like users.txt, uploaded files should be stored in a secure location on your filesystem. That is, '''do not keep your uploads directory underneath a directory served by Apache!'''''<br />
#** Users can delete files. If a file is "deleted", it should actually be removed from the filesystem (4 points)<br />
#** The directory structure is hidden. Users should not be able to access or view files by manipulating a URL. (2 points)<br />
#** Users can log out (2 points)<br />
#**: ''Note: If using session variables, you must ''actually'' log out the user by destroying their session; i.e., don't just redirect them to the login screen.''<br />
#* '''''Best Practices (10 Points):'''''<br />
#** Code is well formatted and easy to read, with proper commenting (4 points)<br />
#** The site follows the FIEO philosophy (3 points)<br />
#** All pages pass the W3C validator (3 points)<br />
#* '''''Usability (5 Points):'''''<br />
#** Site is intuitive to use and navigate (4 points)<br />
#** Site is visually appealing (1 point)<br />
# '''Creative Portion (15 Points)''' (see below)<br />
#* '''''Make sure you have a README.md file in your group repo with the following:'''''<br />
#** An .md file is a plain text file called a markdown file [https://guides.github.com/features/mastering-markdown/ ] . <br />
#***The contents of your README.md file are shown on your repo, making it easier for us to grade<br />
#*** You may style the page with bolding, hyperlings, images, block quotes and lists<br />
#*** [http://dillinger.io/ This online markdown editor] makes it easy to learn this format <br />
#** The link to your file sharing site. '''''We need this to grade your work.'''''<br />
#** A brief description of what you did for your creative portion<br />
#** Any additional login details needed for the TA<br />
<br />
=== Creative Portion ===<br />
<br />
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.<br />
<br />
* The creative portion is an opportunity for you to learn the material of your own interest.<br />
* You will not earn credit for a creative-portion feature that simply rehashes something you've already done in a previous module.<br />
<br />
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.<br />
<br />
[[Category:Module 2]]<br />
[[Category:Modules]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=Module_1&diff=2748Module 12020-12-20T22:39:34Z<p>Mitch: /* Reading */</p>
<hr />
<div>__NOTOC__ <br />
Module 1 introduces the fundamentals of HTML and CSS. You will first make a static document using HTML and CSS, and then you will make a portal to a DuckDuckGo search. This module is worth 50 points.<br />
<br />
== Reading ==<br />
<br />
The following articles on the online class wiki textbook contain information that will help you complete the assignment.<br />
<br />
* [[Git]]<br />
* [[HTML and CSS]]<br />
* [[HTML Forms]]<br />
* [[VS Code]]<br />
* [[FAQ - Mod 1]]<br />
<br />
== Assignments ==<br />
<br />
=== Write a Birthday Card ===<br />
<br />
'''Write a birthday card to a friend or family member using HTML and CSS.''' Use HTML to define the content of the card (like the headings and the paragraphs), and use CSS to define the appearance. Some ideas:<br />
<br />
* Make the background-color of the page baby blue and use purple ink to write a card to a little boy<br />
* Make the text big and include pictures of hearts<br />
* Use a font with text shadows (more advanced)<br />
<br />
Use this opportunity to experiment with the plethora of CSS properties. Remember that you're in a computer science class (not an art class), so we don't care if your card looks ugly. The main thing is that you learn HTML and CSS and use them appropriately.<br />
<br />
==== How to Edit Your File ====<br />
<br />
Throughout this course we '''highly''' recommend using VS Code https://code.visualstudio.com/download, and have included tips for each module specific to VS Code.<br />
Visit the wiki page [[VS Code]] and check out the Module 1 section<br />
<br />
'''Important Note:''' Writing your web page in a word processor like Microsoft Word or even WordPad or TextEdit will ''not'' work. You need a plain text editor.<br />
<br />
==== How to View Your HTML Document ====<br />
<br />
Once you have ''birthday.html'', you can open it using your favorite web browser (like Firefox). For the purposes of this exercise, it suffices to right-click the file and tell it to "open with" Firefox. When the file opens, it should be under the file:/// protocol.<br />
<br />
In Module 2, we will install a web server that serves up pages on the http:// and https:// protocols.<br />
<br />
==== Validation ====<br />
<br />
'''Your birthday card must pass the W3C Validators for both HTML and CSS with no errors or warnings.''' You can upload your HTML to [https://validator.w3.org/ the HTML validator] and your CSS to [https://jigsaw.w3.org/css-validator/ the CSS validator].<br />
<br />
For more information on validation, see the HTML and CSS guide: [[HTML and CSS#Validation]]<br />
<br />
=== Make a Portal to a DuckDuckGo Search ===<br />
<br />
'''Write an HTML document containing a form that searches DuckDuckGo's web site.''' You should be able to type in a search term and have your form load the DuckDuckGo search page. In this HTML document you must also include this course's regrade policy to ensure that you have read it and understand it. [https://www.arl.wustl.edu/~todd/cse330/info.html Regrade Policy]<br />
<br />
# Visit [https://www.duckduckgo.com/ www.duckduckgo.com]. Search for something easy to spot in the URL, like "QUERY".<br />
# Look at the URL of the search page. What is the script URL? What is the query variable?<br />
# Make an HTML document containing a text field and a submit button. Typing a search query into the text field and pressing the submit button should load the DuckDuckGo search page.<br />
<br />
- Additionally, we want you to copy/paste this course's regrade policy somewhere into this html document to ensure your familiarity.<br />
<br />
== Grading ==<br />
<br />
We will be grading the following aspects of your work. There are 50 points total.<br />
<br />
<br />
'''Assignments (including code) must be committed to GitHub by the end of class on the due date. Commit early and often. Failing to commit by the end of class on the due date will result in a 0. <br />
<br />
<br />
# '''Birthday Card (30 Points):'''<br />
#* Correct usage of HTML and CSS in your birthday card (10 points).<br />
#*: ''Make sure that you use HTML for "content" and CSS for "appearance." Don't write inline styles: use a separate stylesheet and link your HTML file to it.''<br />
#* Experimenting with at least 5 different CSS properties in your birthday card (10 points).<br />
#* Birthday card passes the W3C validation for HTML 5 and CSS. (10 points).<br />
# '''Search Portal (10 Points):'''<br />
#* DuckDuckGo search portal is functional (9 points).<br />
#* Your search portal page includes the text of this course's regrade policy (1 point).<br />
# '''Account Creation and Version Control (10 Points):'''<br />
#* GitHub account created (2 Points)<br />
#* Module 1 repo created using the link provided on Piazza (2 Points)<br />
#* Account created on Amazon Web Services and an image file containing a screenshot of your account page pushed to GitHub. (4 Points)<br />
#* Files pushed to repo on GitHub using Git (2 Points)<br />
<br />
<br />
<br />
[[Category:Module 1]]<br />
[[Category:Modules]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_3&diff=2747FAQ - Mod 32020-12-14T15:40:14Z<p>Mitch: /* Why can't I modify my table? */</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 3x. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== Primary Keys ==<br />
<br />
=== Why am I getting an error when adding a foreign key? ===<br />
<br />
==== Non-Unique Primary Key ====<br />
<br />
This issue can be a result of a non-unique primary key. Take the courses table in this module, for example. Multiple courses can have the same course code if they are in different departments, so generating a primary key in reference to only course code is not enough. Think about what other fields to include to make a primary key truly unique, as you cannot have repeating primary keys.<br />
<br />
==== Primary Key and Foreign Key Parameters ====<br />
<br />
Another reason that adding a foreign key can result in an error is if it does not reference the entire primary key. For a foreign key to be properly generated, it needs to reference the entire primary key, even if that means including multiple parameters.<br />
<br />
==== Type Mismatch ====<br />
<br />
A third common reason that a foreign key cannot be properly generated is that the parameters included when generating the key are different types. For example, of one of the parameters is of type TINYINT and another is of type SMALLINT, the key cannot be generated properly. When generating the key, make sure the parameters are of matching type.<br />
<br />
== Modifying Tables ==<br />
<br />
=== Why can't I modify my table? ===<br />
<br />
You will run into an issue if you try to modify your table after adding a foreign key. Anything from adding to the table, to changing types, to modifying/adding charsets will not be possible once the foreign key has been added. If you do need to edit the table after having added a foreign key, you will need to drop the key before making edits to the table.<br />
<br />
[[Category:Module 3]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_3&diff=2746FAQ - Mod 32020-12-14T15:30:45Z<p>Mitch: Created page with "Welcome to the frequently asked questions page for Module 3x. As many common questions can come up on Piazza, some of those questions are consolidated here. == Primary Keys =..."</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 3x. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== Primary Keys ==<br />
<br />
=== Why am I getting an error when adding a foreign key? ===<br />
<br />
==== Non-Unique Primary Key ====<br />
<br />
This issue can be a result of a non-unique primary key. Take the courses table in this module, for example. Multiple courses can have the same course code if they are in different departments, so generating a primary key in reference to only course code is not enough. Think about what other fields to include to make a primary key truly unique, as you cannot have repeating primary keys.<br />
<br />
==== Primary Key and Foreign Key Parameters ====<br />
<br />
Another reason that adding a foreign key can result in an error is if it does not reference the entire primary key. For a foreign key to be properly generated, it needs to reference the entire primary key, even if that means including multiple parameters.<br />
<br />
==== Type Mismatch ====<br />
<br />
A third common reason that a foreign key cannot be properly generated is that the parameters included when generating the key are different types. For example, of one of the parameters is of type TINYINT and another is of type SMALLINT, the key cannot be generated properly. When generating the key, make sure the parameters are of matching type.<br />
<br />
== Modifying Tables ==<br />
<br />
=== Why can't I modify my table? ===<br />
<br />
You will run into an issue if you try to modify your table after adding a foreign key. If you do run into this, you will need to drop the key before making edits to the table.<br />
<br />
[[Category:Module 3]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=CSE_330_Online_Textbook_-_Table_of_Contents&diff=2745CSE 330 Online Textbook - Table of Contents2020-12-14T15:12:56Z<p>Mitch: </p>
<hr />
<div><div style="text-align:center;">[[File:CSE330Banner.png]]</div><br />
<br />
__NOTOC__ <br />
<div style="column-width: 300px; -moz-column-width: 300px; -webkit-column-width: 300px;"><br />
{{FrontPageModule<br />
|num=1<br />
|subject=HTML and CSS Fundamentals<br />
|links=<br />
* [[HTML and CSS]]<br />
* [[HTML Forms]]<br />
* [[Git]]<br />
* [[FAQ - Mod 1]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=2<br />
|subject=Linux, Apache, and PHP<br />
|links=<br />
* [[Linux]]<br />
* [[Bash]]<br />
* [[Amazon Web Services]]<br />
* [[SSH]]<br />
* [[Apache]]<br />
* [[PHP]]<br />
* [[Workflow]]<br />
* [[Web Application Security, Part 1]]<br />
* [[FAQ - Mod 2]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=3<br />
|subject=SQL Databases<br />
|links=<br />
* [[Introduction to MySQL]] (installation)<br />
* [[MySQL Schema and State]] (queries)<br />
* [[PHP and MySQL]] (using MySQL from PHP)<br />
* [[Web Application Security, Part 2]]<br />
* [[FAQ - Mod 3]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=4<br />
|subject=Scripting for Rapid Prototyping<br />
|links=<br />
* [[Python]]<br />
* [[Regular Expressions]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=5<br />
|subject=JavaScript and APIs<br />
|links=<br />
* [[JavaScript]]<br />
* [[AJAX and JSON]]<br />
* [[Web Application Security, Part 3]]<br />
<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=6<br />
|subject=Real-Time Web Applications<br />
|links=<br />
* [[Node.JS]]<br />
* [[Socket.IO]]<br />
}}<br />
<br />
<br />
{{FrontPageModule<br />
|num=7<br />
|subject=Creative Project<br />
|links=<br />
* [[Choosing a Platform]]<br />
* [[Web Frameworks]]<br />
}}<br />
<br />
</div><br />
<br />
== Reference ==<br />
<br />
Use this wiki as a starting place for your projects in CSE 330. However, web development is a large field, so it is impossible for us to document everything you might need to know. Here are some other places you should look when you need to find something:<br />
<br />
* [https://developer.mozilla.org/en-US/ The Mozilla Development Network (MDN)], a community-driven source containing documentation and tutorials for Web technologies<br />
* [http://reference.sitepoint.com/html SitePoint], which has a reference page as well as quality articles and tutorials<br />
<br />
If you can't find what you need in any of these places, try using your favorite search engine. '''Be wary of sites that come up on search engines.''' Many HTML reference sites document bad practices and dated techniques. If you're unsure whether a reference site you find is legitimate, ask a TA.<br />
<br />
== Want to Learn More? ==<br />
<br />
The limited amount of time in CSE 330 means that we can cover only a subset of the wide range of possible topics in the field of rapid prototyping and web development. Indeed, the exact topics covered in CSE 330 change from year to year.<br />
<br />
Feel free to browse some of the topics that have previously been covered in CSE 330: [[:Category:Former Content|CSE 330 Former Content]]<br />
<br />
You should also consider following blogs like [http://www.sitepoint.com/ SitePoint] to keep up-to-date on the latest developments in the field of web development.<br />
<br />
== Content License ==<br />
<br />
The content of this wiki is copyright (c) 2013, Washington University in St. Louis, Department of Computer Science. All rights reserved.<br />
<br />
=== Modified BSD License ===<br />
<br />
Redistribution and use in source and binary forms, with or without modification, by a Third Party who has not completed and is not in the process of completing CSE 330, of the code examples or concepts on this wiki, are permitted, provided that the following conditions are met:<br />
<br />
* Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.<br />
* Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.<br />
* Neither the name of the Washington University School of Engineering and Applied Science nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.<br />
<br />
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS TO ALL PARTIES "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.<br />
<br />
=== What it Means ===<br />
<br />
If you are a student in CSE 330, you may use the code from this wiki freely in your projects without the need for attribution. If you are not a student in CSE 330, you may use the code from this wiki freely in your projects with attribution. Either way, the code examples are provided "as is", without any warranty, and Washington University holds no liability for problems arising from the use of the content in this wiki.</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_2&diff=2744FAQ - Mod 22020-12-14T15:10:53Z<p>Mitch: Created page with "Welcome to the frequently asked questions page for Module 2. As many common questions can come up on Piazza, some of those questions are consolidated here. == Permissions ==..."</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 2. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== Permissions ==<br />
<br />
=== Help: I need to edit a readonly file! ===<br />
<br />
When attempting to edit a readonly file, the terminal will throw the following warning message.<br />
<source lang="bash><br />
W10: Warning: Changing a readonly file<br />
</source><br />
This error often surfaces for the first time when attempting to edit UserDir for the first time, as is instructed for setting up Apache. If you have set the correct permissions (as designated by the wiki) and are still running into an error, you likely need to edit the file with the "sudo" command, as shown below.<br />
<br />
<source lang="bash><br />
$ sudo vi <filename><br />
</source><br />
<br />
as opposed to<br />
<br />
<source lang="bash><br />
$ vi <filename><br />
</source><br />
<br />
Placing sudo before a command allows you to run the command with the permissions of the root user. The root user is able to access any file, so running as sudo should allow you to write to a readonly file. '''Before using sudo to run a command, always check that you have set the correct permissions as stated by the wiki. If you do not, using sudo once will not fix permissions issues down the line.''' We see plenty of permissions questions on piazza every year; 90% of the time these are due to students not reading the wiki in full when configuring Apache, SFTP, etc.<br />
<br />
=== What is the password to login to the root user on my EC2 instance? ===<br />
<br />
When attempting to login to the root user using "su," you might find yourself prompted to enter a password. Similarly to the previous issue, this can be solved by running the following command<br />
<br />
<source lang="bash><br />
$ sudo su<br />
</source><br />
<br />
Using sudo allows you to access the permissions of the root user without using the password.<br />
<br />
=== I'm trying to push files using SFTP but it isn't working ===<br />
<br />
You may run into an error when trying to push files via SFTP, where you see the following message followed by several lines of error tracing.<br />
<br />
<source lang="bash><br />
Error: Permissions Denied<br />
</source><br />
<br />
If you run into this, it's likely the case that the permissions were set incorrectly for either your private key or public_html. If you make sure that you have set permissions correctly for '''both''' of these, you likely will not have an error.<br />
<br />
== One vs Multiple HTML Files ==<br />
<br />
=== Should I include both parts of the assignment in the same HTML file? ===<br />
<br />
Students often wonder whether they should include both the birthday card and search engine in the same HTML file or separate them into different files. While there is no grading requirement for this and they can be included in the same file, we recommend putting them in different files to get you more comfortable with the process of creating HTML files from scratch. In the end, though, this is up to you.<br />
<br />
== Instance Storage Space ==<br />
<br />
=== What do I do if I run out of space on my EC2 instance? ===<br />
<br />
While this may seem like a big deal, this is often simply due to an issue in a PHP file that causes errors to pile up in the Apache log folder. Follow the following steps to fix this. First, check to make sure this is the issue. Run the following command. If any of the file systems show 100% for use, you may be out of space.<br />
<br />
<source lang="bash><br />
$ df -h<br />
</source><br />
<br />
If this is the case, log into the root user.<br />
<br />
<source lang="bash><br />
$ sudo su<br />
</source><br />
<br />
Direct yourself to the Apache log folder.<br />
<br />
<source lang="bash><br />
$ cd /var/log/httpd<br />
</source><br />
<br />
Run the following command to see the files in this directory. If you see an abundance of error_log files, or error_log files with large sizes, a PHP file is likely the source of the problem.<br />
<br />
<source lang="bash><br />
$ ls -l<br />
</source><br />
<br />
Use the next command to find the PHP file that was the source of the errors. You will need to fix whatever errors you have in your PHP file so that your instance does not fill up again.<br />
<br />
<source lang="bash><br />
$ tail<br />
</source><br />
<br />
Finally, use the following command to remove the error_log files that are taking up all of the space.<br />
<br />
<source lang="bash><br />
$ rm<br />
</source><br />
<br />
Restart Apache after having completed this process and you should have regained space on your instance!<br />
<br />
== SFTP Errors/Trouble Connecting to Apache via VSCode ==<br />
<br />
=== Why won't my SFTP work from vscode? ===<br />
<br />
This is often due to an incorrect private key path, which will result in the following error.<br />
<br />
<source lang="bash><br />
ENOENT: No such file or directory, open '<file path>'<br />
</source><br />
<br />
This nearly always means that your privateKeyPath field in your sftp.json file is incorrect. Double check this path; it should be the file path to your id-rsa file on your local machine.<br />
<br />
[[Category:Module 2]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ_-_Mod_1&diff=2743FAQ - Mod 12020-12-14T14:17:39Z<p>Mitch: Created page with "Welcome to the frequently asked questions page for Module 1. As many common questions can come up on Piazza, some of those questions are consolidated here. == HTML Validator..."</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 1. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== HTML Validator ==<br />
<br />
=== Why am I getting a character encoding error in the HTML validator? ===<br />
<br />
Students frequently see the following error message when putting their code through the W3C Validator.<br />
<source lang="bash><br />
The character encoding was not declared. Proceed using Windows-1252<br />
</source><br />
When writing html, you need to include a method of [http://net-informations.com/q/faq/encoding.html#:~:text=A%20character%20encoding%20tells%20the,grouped%20into%20a%20character%20set. character encoding] so the computer knows exactly how you want your data to be interpreted. There are multiple character encoding schemes, but perhaps the most common for modern web and application development is Unicode Transformation Format (UTF) 8.<br />
This error can be easily solved by including the following line in your HTML header:<br />
<source lang="html4strict"><br />
<meta charset="utf-8"><br />
</source><br />
<br />
== One vs Multiple HTML Files ==<br />
<br />
=== Should I include both parts of the assignment in the same HTML file? ===<br />
<br />
Students often wonder whether they should include both the birthday card and search engine in the same HTML file or separate them into different files. While there is no grading requirement for this and they can be included in the same file, we recommend putting them in different files to get you more comfortable with the process of creating HTML files from scratch. In the end, though, this is up to you.<br />
<br />
== HTML Naming Conventions ==<br />
<br />
=== Do my HTML files need to have specific names? ===<br />
<br />
A common question is whether or not there are naming questions for HTML files, or whether or not they need to be named something specific for grading purposes. Unless we specify exactly what we want the file to be (a rare occurrence), you can use your discretion as to what a good file name would be. Needless to say, it should at least be related to the content of the file.<br />
<br />
[[Category:Module 1]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=CSE_330_Online_Textbook_-_Table_of_Contents&diff=2742CSE 330 Online Textbook - Table of Contents2020-12-14T14:17:25Z<p>Mitch: </p>
<hr />
<div><div style="text-align:center;">[[File:CSE330Banner.png]]</div><br />
<br />
__NOTOC__ <br />
<div style="column-width: 300px; -moz-column-width: 300px; -webkit-column-width: 300px;"><br />
{{FrontPageModule<br />
|num=1<br />
|subject=HTML and CSS Fundamentals<br />
|links=<br />
* [[HTML and CSS]]<br />
* [[HTML Forms]]<br />
* [[Git]]<br />
* [[FAQ - Mod 1]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=2<br />
|subject=Linux, Apache, and PHP<br />
|links=<br />
* [[Linux]]<br />
* [[Bash]]<br />
* [[Amazon Web Services]]<br />
* [[SSH]]<br />
* [[Apache]]<br />
* [[PHP]]<br />
* [[Workflow]]<br />
* [[Web Application Security, Part 1]]<br />
* [[FAQ - Mod 2]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=3<br />
|subject=SQL Databases<br />
|links=<br />
* [[Introduction to MySQL]] (installation)<br />
* [[MySQL Schema and State]] (queries)<br />
* [[PHP and MySQL]] (using MySQL from PHP)<br />
* [[Web Application Security, Part 2]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=4<br />
|subject=Scripting for Rapid Prototyping<br />
|links=<br />
* [[Python]]<br />
* [[Regular Expressions]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=5<br />
|subject=JavaScript and APIs<br />
|links=<br />
* [[JavaScript]]<br />
* [[AJAX and JSON]]<br />
* [[Web Application Security, Part 3]]<br />
<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=6<br />
|subject=Real-Time Web Applications<br />
|links=<br />
* [[Node.JS]]<br />
* [[Socket.IO]]<br />
}}<br />
<br />
<br />
{{FrontPageModule<br />
|num=7<br />
|subject=Creative Project<br />
|links=<br />
* [[Choosing a Platform]]<br />
* [[Web Frameworks]]<br />
}}<br />
<br />
</div><br />
<br />
== Reference ==<br />
<br />
Use this wiki as a starting place for your projects in CSE 330. However, web development is a large field, so it is impossible for us to document everything you might need to know. Here are some other places you should look when you need to find something:<br />
<br />
* [https://developer.mozilla.org/en-US/ The Mozilla Development Network (MDN)], a community-driven source containing documentation and tutorials for Web technologies<br />
* [http://reference.sitepoint.com/html SitePoint], which has a reference page as well as quality articles and tutorials<br />
<br />
If you can't find what you need in any of these places, try using your favorite search engine. '''Be wary of sites that come up on search engines.''' Many HTML reference sites document bad practices and dated techniques. If you're unsure whether a reference site you find is legitimate, ask a TA.<br />
<br />
== Want to Learn More? ==<br />
<br />
The limited amount of time in CSE 330 means that we can cover only a subset of the wide range of possible topics in the field of rapid prototyping and web development. Indeed, the exact topics covered in CSE 330 change from year to year.<br />
<br />
Feel free to browse some of the topics that have previously been covered in CSE 330: [[:Category:Former Content|CSE 330 Former Content]]<br />
<br />
You should also consider following blogs like [http://www.sitepoint.com/ SitePoint] to keep up-to-date on the latest developments in the field of web development.<br />
<br />
== Content License ==<br />
<br />
The content of this wiki is copyright (c) 2013, Washington University in St. Louis, Department of Computer Science. All rights reserved.<br />
<br />
=== Modified BSD License ===<br />
<br />
Redistribution and use in source and binary forms, with or without modification, by a Third Party who has not completed and is not in the process of completing CSE 330, of the code examples or concepts on this wiki, are permitted, provided that the following conditions are met:<br />
<br />
* Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.<br />
* Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.<br />
* Neither the name of the Washington University School of Engineering and Applied Science nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.<br />
<br />
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS TO ALL PARTIES "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.<br />
<br />
=== What it Means ===<br />
<br />
If you are a student in CSE 330, you may use the code from this wiki freely in your projects without the need for attribution. If you are not a student in CSE 330, you may use the code from this wiki freely in your projects with attribution. Either way, the code examples are provided "as is", without any warranty, and Washington University holds no liability for problems arising from the use of the content in this wiki.</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=CSE_330_Online_Textbook_-_Table_of_Contents&diff=2741CSE 330 Online Textbook - Table of Contents2020-12-14T14:17:01Z<p>Mitch: </p>
<hr />
<div><div style="text-align:center;">[[File:CSE330Banner.png]]</div><br />
<br />
__NOTOC__ <br />
<div style="column-width: 300px; -moz-column-width: 300px; -webkit-column-width: 300px;"><br />
{{FrontPageModule<br />
|num=1<br />
|subject=HTML and CSS Fundamentals<br />
|links=<br />
* [[HTML and CSS]]<br />
* [[HTML Forms]]<br />
* [[Git]]<br />
* [[FAQ]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=2<br />
|subject=Linux, Apache, and PHP<br />
|links=<br />
* [[Linux]]<br />
* [[Bash]]<br />
* [[Amazon Web Services]]<br />
* [[SSH]]<br />
* [[Apache]]<br />
* [[PHP]]<br />
* [[Workflow]]<br />
* [[Web Application Security, Part 1]]<br />
* [[FAQ - Mod 2]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=3<br />
|subject=SQL Databases<br />
|links=<br />
* [[Introduction to MySQL]] (installation)<br />
* [[MySQL Schema and State]] (queries)<br />
* [[PHP and MySQL]] (using MySQL from PHP)<br />
* [[Web Application Security, Part 2]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=4<br />
|subject=Scripting for Rapid Prototyping<br />
|links=<br />
* [[Python]]<br />
* [[Regular Expressions]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=5<br />
|subject=JavaScript and APIs<br />
|links=<br />
* [[JavaScript]]<br />
* [[AJAX and JSON]]<br />
* [[Web Application Security, Part 3]]<br />
<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=6<br />
|subject=Real-Time Web Applications<br />
|links=<br />
* [[Node.JS]]<br />
* [[Socket.IO]]<br />
}}<br />
<br />
<br />
{{FrontPageModule<br />
|num=7<br />
|subject=Creative Project<br />
|links=<br />
* [[Choosing a Platform]]<br />
* [[Web Frameworks]]<br />
}}<br />
<br />
</div><br />
<br />
== Reference ==<br />
<br />
Use this wiki as a starting place for your projects in CSE 330. However, web development is a large field, so it is impossible for us to document everything you might need to know. Here are some other places you should look when you need to find something:<br />
<br />
* [https://developer.mozilla.org/en-US/ The Mozilla Development Network (MDN)], a community-driven source containing documentation and tutorials for Web technologies<br />
* [http://reference.sitepoint.com/html SitePoint], which has a reference page as well as quality articles and tutorials<br />
<br />
If you can't find what you need in any of these places, try using your favorite search engine. '''Be wary of sites that come up on search engines.''' Many HTML reference sites document bad practices and dated techniques. If you're unsure whether a reference site you find is legitimate, ask a TA.<br />
<br />
== Want to Learn More? ==<br />
<br />
The limited amount of time in CSE 330 means that we can cover only a subset of the wide range of possible topics in the field of rapid prototyping and web development. Indeed, the exact topics covered in CSE 330 change from year to year.<br />
<br />
Feel free to browse some of the topics that have previously been covered in CSE 330: [[:Category:Former Content|CSE 330 Former Content]]<br />
<br />
You should also consider following blogs like [http://www.sitepoint.com/ SitePoint] to keep up-to-date on the latest developments in the field of web development.<br />
<br />
== Content License ==<br />
<br />
The content of this wiki is copyright (c) 2013, Washington University in St. Louis, Department of Computer Science. All rights reserved.<br />
<br />
=== Modified BSD License ===<br />
<br />
Redistribution and use in source and binary forms, with or without modification, by a Third Party who has not completed and is not in the process of completing CSE 330, of the code examples or concepts on this wiki, are permitted, provided that the following conditions are met:<br />
<br />
* Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.<br />
* Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.<br />
* Neither the name of the Washington University School of Engineering and Applied Science nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.<br />
<br />
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS TO ALL PARTIES "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.<br />
<br />
=== What it Means ===<br />
<br />
If you are a student in CSE 330, you may use the code from this wiki freely in your projects without the need for attribution. If you are not a student in CSE 330, you may use the code from this wiki freely in your projects with attribution. Either way, the code examples are provided "as is", without any warranty, and Washington University holds no liability for problems arising from the use of the content in this wiki.</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=CSE_330_Online_Textbook_-_Table_of_Contents&diff=2740CSE 330 Online Textbook - Table of Contents2020-12-14T14:16:46Z<p>Mitch: </p>
<hr />
<div><div style="text-align:center;">[[File:CSE330Banner.png]]</div><br />
<br />
__NOTOC__ <br />
<div style="column-width: 300px; -moz-column-width: 300px; -webkit-column-width: 300px;"><br />
{{FrontPageModule<br />
|num=1<br />
|subject=HTML and CSS Fundamentals<br />
|links=<br />
* [[HTML and CSS]]<br />
* [[HTML Forms]]<br />
* [[Git]]<br />
* [[FAQ - Mod 1]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=2<br />
|subject=Linux, Apache, and PHP<br />
|links=<br />
* [[Linux]]<br />
* [[Bash]]<br />
* [[Amazon Web Services]]<br />
* [[SSH]]<br />
* [[Apache]]<br />
* [[PHP]]<br />
* [[Workflow]]<br />
* [[Web Application Security, Part 1]]<br />
* [[FAQ - Mod 2]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=3<br />
|subject=SQL Databases<br />
|links=<br />
* [[Introduction to MySQL]] (installation)<br />
* [[MySQL Schema and State]] (queries)<br />
* [[PHP and MySQL]] (using MySQL from PHP)<br />
* [[Web Application Security, Part 2]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=4<br />
|subject=Scripting for Rapid Prototyping<br />
|links=<br />
* [[Python]]<br />
* [[Regular Expressions]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=5<br />
|subject=JavaScript and APIs<br />
|links=<br />
* [[JavaScript]]<br />
* [[AJAX and JSON]]<br />
* [[Web Application Security, Part 3]]<br />
<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=6<br />
|subject=Real-Time Web Applications<br />
|links=<br />
* [[Node.JS]]<br />
* [[Socket.IO]]<br />
}}<br />
<br />
<br />
{{FrontPageModule<br />
|num=7<br />
|subject=Creative Project<br />
|links=<br />
* [[Choosing a Platform]]<br />
* [[Web Frameworks]]<br />
}}<br />
<br />
</div><br />
<br />
== Reference ==<br />
<br />
Use this wiki as a starting place for your projects in CSE 330. However, web development is a large field, so it is impossible for us to document everything you might need to know. Here are some other places you should look when you need to find something:<br />
<br />
* [https://developer.mozilla.org/en-US/ The Mozilla Development Network (MDN)], a community-driven source containing documentation and tutorials for Web technologies<br />
* [http://reference.sitepoint.com/html SitePoint], which has a reference page as well as quality articles and tutorials<br />
<br />
If you can't find what you need in any of these places, try using your favorite search engine. '''Be wary of sites that come up on search engines.''' Many HTML reference sites document bad practices and dated techniques. If you're unsure whether a reference site you find is legitimate, ask a TA.<br />
<br />
== Want to Learn More? ==<br />
<br />
The limited amount of time in CSE 330 means that we can cover only a subset of the wide range of possible topics in the field of rapid prototyping and web development. Indeed, the exact topics covered in CSE 330 change from year to year.<br />
<br />
Feel free to browse some of the topics that have previously been covered in CSE 330: [[:Category:Former Content|CSE 330 Former Content]]<br />
<br />
You should also consider following blogs like [http://www.sitepoint.com/ SitePoint] to keep up-to-date on the latest developments in the field of web development.<br />
<br />
== Content License ==<br />
<br />
The content of this wiki is copyright (c) 2013, Washington University in St. Louis, Department of Computer Science. All rights reserved.<br />
<br />
=== Modified BSD License ===<br />
<br />
Redistribution and use in source and binary forms, with or without modification, by a Third Party who has not completed and is not in the process of completing CSE 330, of the code examples or concepts on this wiki, are permitted, provided that the following conditions are met:<br />
<br />
* Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.<br />
* Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.<br />
* Neither the name of the Washington University School of Engineering and Applied Science nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.<br />
<br />
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS TO ALL PARTIES "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.<br />
<br />
=== What it Means ===<br />
<br />
If you are a student in CSE 330, you may use the code from this wiki freely in your projects without the need for attribution. If you are not a student in CSE 330, you may use the code from this wiki freely in your projects with attribution. Either way, the code examples are provided "as is", without any warranty, and Washington University holds no liability for problems arising from the use of the content in this wiki.</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=CSE_330_Online_Textbook_-_Table_of_Contents&diff=2739CSE 330 Online Textbook - Table of Contents2020-12-14T14:16:20Z<p>Mitch: </p>
<hr />
<div><div style="text-align:center;">[[File:CSE330Banner.png]]</div><br />
<br />
__NOTOC__ <br />
<div style="column-width: 300px; -moz-column-width: 300px; -webkit-column-width: 300px;"><br />
{{FrontPageModule<br />
|num=1<br />
|subject=HTML and CSS Fundamentals<br />
|links=<br />
* [[HTML and CSS]]<br />
* [[HTML Forms]]<br />
* [[Git]]<br />
* [[FAQ]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=2<br />
|subject=Linux, Apache, and PHP<br />
|links=<br />
* [[Linux]]<br />
* [[Bash]]<br />
* [[Amazon Web Services]]<br />
* [[SSH]]<br />
* [[Apache]]<br />
* [[PHP]]<br />
* [[Workflow]]<br />
* [[Web Application Security, Part 1]]<br />
* [[FAQ]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=3<br />
|subject=SQL Databases<br />
|links=<br />
* [[Introduction to MySQL]] (installation)<br />
* [[MySQL Schema and State]] (queries)<br />
* [[PHP and MySQL]] (using MySQL from PHP)<br />
* [[Web Application Security, Part 2]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=4<br />
|subject=Scripting for Rapid Prototyping<br />
|links=<br />
* [[Python]]<br />
* [[Regular Expressions]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=5<br />
|subject=JavaScript and APIs<br />
|links=<br />
* [[JavaScript]]<br />
* [[AJAX and JSON]]<br />
* [[Web Application Security, Part 3]]<br />
<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=6<br />
|subject=Real-Time Web Applications<br />
|links=<br />
* [[Node.JS]]<br />
* [[Socket.IO]]<br />
}}<br />
<br />
<br />
{{FrontPageModule<br />
|num=7<br />
|subject=Creative Project<br />
|links=<br />
* [[Choosing a Platform]]<br />
* [[Web Frameworks]]<br />
}}<br />
<br />
</div><br />
<br />
== Reference ==<br />
<br />
Use this wiki as a starting place for your projects in CSE 330. However, web development is a large field, so it is impossible for us to document everything you might need to know. Here are some other places you should look when you need to find something:<br />
<br />
* [https://developer.mozilla.org/en-US/ The Mozilla Development Network (MDN)], a community-driven source containing documentation and tutorials for Web technologies<br />
* [http://reference.sitepoint.com/html SitePoint], which has a reference page as well as quality articles and tutorials<br />
<br />
If you can't find what you need in any of these places, try using your favorite search engine. '''Be wary of sites that come up on search engines.''' Many HTML reference sites document bad practices and dated techniques. If you're unsure whether a reference site you find is legitimate, ask a TA.<br />
<br />
== Want to Learn More? ==<br />
<br />
The limited amount of time in CSE 330 means that we can cover only a subset of the wide range of possible topics in the field of rapid prototyping and web development. Indeed, the exact topics covered in CSE 330 change from year to year.<br />
<br />
Feel free to browse some of the topics that have previously been covered in CSE 330: [[:Category:Former Content|CSE 330 Former Content]]<br />
<br />
You should also consider following blogs like [http://www.sitepoint.com/ SitePoint] to keep up-to-date on the latest developments in the field of web development.<br />
<br />
== Content License ==<br />
<br />
The content of this wiki is copyright (c) 2013, Washington University in St. Louis, Department of Computer Science. All rights reserved.<br />
<br />
=== Modified BSD License ===<br />
<br />
Redistribution and use in source and binary forms, with or without modification, by a Third Party who has not completed and is not in the process of completing CSE 330, of the code examples or concepts on this wiki, are permitted, provided that the following conditions are met:<br />
<br />
* Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.<br />
* Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.<br />
* Neither the name of the Washington University School of Engineering and Applied Science nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.<br />
<br />
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS TO ALL PARTIES "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.<br />
<br />
=== What it Means ===<br />
<br />
If you are a student in CSE 330, you may use the code from this wiki freely in your projects without the need for attribution. If you are not a student in CSE 330, you may use the code from this wiki freely in your projects with attribution. Either way, the code examples are provided "as is", without any warranty, and Washington University holds no liability for problems arising from the use of the content in this wiki.</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ&diff=2738FAQ2020-12-14T14:15:49Z<p>Mitch: /* HTML Naming Conventions */</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 1. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== HTML Validator ==<br />
<br />
=== Why am I getting a character encoding error in the HTML validator? ===<br />
<br />
Students frequently see the following error message when putting their code through the W3C Validator.<br />
<source lang="bash><br />
The character encoding was not declared. Proceed using Windows-1252<br />
</source><br />
When writing html, you need to include a method of [http://net-informations.com/q/faq/encoding.html#:~:text=A%20character%20encoding%20tells%20the,grouped%20into%20a%20character%20set. character encoding] so the computer knows exactly how you want your data to be interpreted. There are multiple character encoding schemes, but perhaps the most common for modern web and application development is Unicode Transformation Format (UTF) 8.<br />
This error can be easily solved by including the following line in your HTML header:<br />
<source lang="html4strict"><br />
<meta charset="utf-8"><br />
</source><br />
<br />
== One vs Multiple HTML Files ==<br />
<br />
=== Should I include both parts of the assignment in the same HTML file? ===<br />
<br />
Students often wonder whether they should include both the birthday card and search engine in the same HTML file or separate them into different files. While there is no grading requirement for this and they can be included in the same file, we recommend putting them in different files to get you more comfortable with the process of creating HTML files from scratch. In the end, though, this is up to you.<br />
<br />
== HTML Naming Conventions ==<br />
<br />
=== Do my HTML files need to have specific names? ===<br />
<br />
A common question is whether or not there are naming questions for HTML files, or whether or not they need to be named something specific for grading purposes. Unless we specify exactly what we want the file to be (a rare occurrence), you can use your discretion as to what a good file name would be. Needless to say, it should at least be related to the content of the file.<br />
<br />
[[Category:Module 1]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ&diff=2737FAQ2020-12-14T14:15:14Z<p>Mitch: /* HTML Validator */</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 1. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== HTML Validator ==<br />
<br />
=== Why am I getting a character encoding error in the HTML validator? ===<br />
<br />
Students frequently see the following error message when putting their code through the W3C Validator.<br />
<source lang="bash><br />
The character encoding was not declared. Proceed using Windows-1252<br />
</source><br />
When writing html, you need to include a method of [http://net-informations.com/q/faq/encoding.html#:~:text=A%20character%20encoding%20tells%20the,grouped%20into%20a%20character%20set. character encoding] so the computer knows exactly how you want your data to be interpreted. There are multiple character encoding schemes, but perhaps the most common for modern web and application development is Unicode Transformation Format (UTF) 8.<br />
This error can be easily solved by including the following line in your HTML header:<br />
<source lang="html4strict"><br />
<meta charset="utf-8"><br />
</source><br />
<br />
== One vs Multiple HTML Files ==<br />
<br />
=== Should I include both parts of the assignment in the same HTML file? ===<br />
<br />
Students often wonder whether they should include both the birthday card and search engine in the same HTML file or separate them into different files. While there is no grading requirement for this and they can be included in the same file, we recommend putting them in different files to get you more comfortable with the process of creating HTML files from scratch. In the end, though, this is up to you.<br />
<br />
== HTML Naming Conventions ==<br />
<br />
A common question is whether or not there are naming questions for HTML files, or whether or not they need to be named something specific for grading purposes. Unless we specify exactly what we want the file to be (a rare occurrence), you can use your discretion as to what a good file name would be. Needless to say, it should at least be related to the content of the file.<br />
<br />
[[Category:Module 1]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ&diff=2736FAQ2020-12-14T14:14:32Z<p>Mitch: /* One vs Multiple HTML Files */</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 1. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== HTML Validator ==<br />
<br />
Students frequently see the following error message when putting their code through the W3C Validator.<br />
<source lang="bash><br />
The character encoding was not declared. Proceed using Windows-1252<br />
</source><br />
When writing html, you need to include a method of [http://net-informations.com/q/faq/encoding.html#:~:text=A%20character%20encoding%20tells%20the,grouped%20into%20a%20character%20set. character encoding] so the computer knows exactly how you want your data to be interpreted. There are multiple character encoding schemes, but perhaps the most common for modern web and application development is Unicode Transformation Format (UTF) 8.<br />
This error can be easily solved by including the following line in your HTML header:<br />
<source lang="html4strict"><br />
<meta charset="utf-8"><br />
</source><br />
<br />
== One vs Multiple HTML Files ==<br />
<br />
=== Should I include both parts of the assignment in the same HTML file? ===<br />
<br />
Students often wonder whether they should include both the birthday card and search engine in the same HTML file or separate them into different files. While there is no grading requirement for this and they can be included in the same file, we recommend putting them in different files to get you more comfortable with the process of creating HTML files from scratch. In the end, though, this is up to you.<br />
<br />
== HTML Naming Conventions ==<br />
<br />
A common question is whether or not there are naming questions for HTML files, or whether or not they need to be named something specific for grading purposes. Unless we specify exactly what we want the file to be (a rare occurrence), you can use your discretion as to what a good file name would be. Needless to say, it should at least be related to the content of the file.<br />
<br />
[[Category:Module 1]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ&diff=2735FAQ2020-12-14T14:13:25Z<p>Mitch: </p>
<hr />
<div>Welcome to the frequently asked questions page for Module 1. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== HTML Validator ==<br />
<br />
Students frequently see the following error message when putting their code through the W3C Validator.<br />
<source lang="bash><br />
The character encoding was not declared. Proceed using Windows-1252<br />
</source><br />
When writing html, you need to include a method of [http://net-informations.com/q/faq/encoding.html#:~:text=A%20character%20encoding%20tells%20the,grouped%20into%20a%20character%20set. character encoding] so the computer knows exactly how you want your data to be interpreted. There are multiple character encoding schemes, but perhaps the most common for modern web and application development is Unicode Transformation Format (UTF) 8.<br />
This error can be easily solved by including the following line in your HTML header:<br />
<source lang="html4strict"><br />
<meta charset="utf-8"><br />
</source><br />
<br />
== One vs Multiple HTML Files ==<br />
<br />
Students often wonder whether they should include both the birthday card and search engine in the same HTML file or separate them into different files. While there is no grading requirement for this and they can be included in the same file, we recommend putting them in different files to get you more comfortable with the process of creating HTML files from scratch. In the end, though, this is up to you.<br />
<br />
== HTML Naming Conventions ==<br />
<br />
A common question is whether or not there are naming questions for HTML files, or whether or not they need to be named something specific for grading purposes. Unless we specify exactly what we want the file to be (a rare occurrence), you can use your discretion as to what a good file name would be. Needless to say, it should at least be related to the content of the file.<br />
<br />
[[Category:Module 1]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ&diff=2734FAQ2020-12-14T13:58:05Z<p>Mitch: /* Second Question */</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 1. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== HTML Validator ==<br />
<br />
Students frequently see the following error message when putting their code through the W3C Validator.<br />
<source lang="bash><br />
The character encoding was not declared. Proceed using Windows-1252<br />
</source><br />
When writing html, you need to include a method of [http://net-informations.com/q/faq/encoding.html#:~:text=A%20character%20encoding%20tells%20the,grouped%20into%20a%20character%20set. character encoding] so the computer knows exactly how you want your data to be interpreted. There are multiple character encoding schemes, but perhaps the most common for modern web and application development is Unicode Transformation Format (UTF) 8.<br />
This error can be easily solved by including the following line in your HTML header:<br />
<source lang="html4strict"><br />
<meta charset="utf-8"><br />
</source><br />
<br />
== One vs Multiple HTML Files ==<br />
<br />
[[Category:Module 1]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ&diff=2733FAQ2020-12-14T13:57:15Z<p>Mitch: /* HTML Validator */</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 1. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== HTML Validator ==<br />
<br />
Students frequently see the following error message when putting their code through the W3C Validator.<br />
<source lang="bash><br />
The character encoding was not declared. Proceed using Windows-1252<br />
</source><br />
When writing html, you need to include a method of [http://net-informations.com/q/faq/encoding.html#:~:text=A%20character%20encoding%20tells%20the,grouped%20into%20a%20character%20set. character encoding] so the computer knows exactly how you want your data to be interpreted. There are multiple character encoding schemes, but perhaps the most common for modern web and application development is Unicode Transformation Format (UTF) 8.<br />
This error can be easily solved by including the following line in your HTML header:<br />
<source lang="html4strict"><br />
<meta charset="utf-8"><br />
</source><br />
<br />
== Second Question ==<br />
<br />
[[Category:Module 1]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=FAQ&diff=2732FAQ2020-12-07T15:27:48Z<p>Mitch: Created page with "Welcome to the frequently asked questions page for Module 1. As many common questions can come up on Piazza, some of those questions are consolidated here. == HTML Validator..."</p>
<hr />
<div>Welcome to the frequently asked questions page for Module 1. As many common questions can come up on Piazza, some of those questions are consolidated here.<br />
<br />
== HTML Validator ==<br />
<br />
Students frequently see the following error message when putting their code through the W3C Validator.<br />
<source lang="bash><br />
The character encoding was not declared. Proceed using Windows-1252<br />
</source><br />
''Brief explanation of character encoding.''<br />
This error can be easily solved by including the following line in your HTML header:<br />
<source lang="html4strict"><br />
<meta charset="utf-8"><br />
</source><br />
<br />
== Second Question ==<br />
<br />
[[Category:Module 1]]</div>Mitchhttp://classes.engineering.wustl.edu/cse330/index.php?title=CSE_330_Online_Textbook_-_Table_of_Contents&diff=2731CSE 330 Online Textbook - Table of Contents2020-12-07T15:11:02Z<p>Mitch: </p>
<hr />
<div><div style="text-align:center;">[[File:CSE330Banner.png]]</div><br />
<br />
__NOTOC__ <br />
<div style="column-width: 300px; -moz-column-width: 300px; -webkit-column-width: 300px;"><br />
{{FrontPageModule<br />
|num=1<br />
|subject=HTML and CSS Fundamentals<br />
|links=<br />
* [[HTML and CSS]]<br />
* [[HTML Forms]]<br />
* [[Git]]<br />
* [[FAQ]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=2<br />
|subject=Linux, Apache, and PHP<br />
|links=<br />
* [[Linux]]<br />
* [[Bash]]<br />
* [[Amazon Web Services]]<br />
* [[SSH]]<br />
* [[Apache]]<br />
* [[PHP]]<br />
* [[Workflow]]<br />
* [[Web Application Security, Part 1]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=3<br />
|subject=SQL Databases<br />
|links=<br />
* [[Introduction to MySQL]] (installation)<br />
* [[MySQL Schema and State]] (queries)<br />
* [[PHP and MySQL]] (using MySQL from PHP)<br />
* [[Web Application Security, Part 2]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=4<br />
|subject=Scripting for Rapid Prototyping<br />
|links=<br />
* [[Python]]<br />
* [[Regular Expressions]]<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=5<br />
|subject=JavaScript and APIs<br />
|links=<br />
* [[JavaScript]]<br />
* [[AJAX and JSON]]<br />
* [[Web Application Security, Part 3]]<br />
<br />
}}<br />
<br />
{{FrontPageModule<br />
|num=6<br />
|subject=Real-Time Web Applications<br />
|links=<br />
* [[Node.JS]]<br />
* [[Socket.IO]]<br />
}}<br />
<br />
<br />
{{FrontPageModule<br />
|num=7<br />
|subject=Creative Project<br />
|links=<br />
* [[Choosing a Platform]]<br />
* [[Web Frameworks]]<br />
}}<br />
<br />
</div><br />
<br />
== Reference ==<br />
<br />
Use this wiki as a starting place for your projects in CSE 330. However, web development is a large field, so it is impossible for us to document everything you might need to know. Here are some other places you should look when you need to find something:<br />
<br />
* [https://developer.mozilla.org/en-US/ The Mozilla Development Network (MDN)], a community-driven source containing documentation and tutorials for Web technologies<br />
* [http://reference.sitepoint.com/html SitePoint], which has a reference page as well as quality articles and tutorials<br />
<br />
If you can't find what you need in any of these places, try using your favorite search engine. '''Be wary of sites that come up on search engines.''' Many HTML reference sites document bad practices and dated techniques. If you're unsure whether a reference site you find is legitimate, ask a TA.<br />
<br />
== Want to Learn More? ==<br />
<br />
The limited amount of time in CSE 330 means that we can cover only a subset of the wide range of possible topics in the field of rapid prototyping and web development. Indeed, the exact topics covered in CSE 330 change from year to year.<br />
<br />
Feel free to browse some of the topics that have previously been covered in CSE 330: [[:Category:Former Content|CSE 330 Former Content]]<br />
<br />
You should also consider following blogs like [http://www.sitepoint.com/ SitePoint] to keep up-to-date on the latest developments in the field of web development.<br />
<br />
== Content License ==<br />
<br />
The content of this wiki is copyright (c) 2013, Washington University in St. Louis, Department of Computer Science. All rights reserved.<br />
<br />
=== Modified BSD License ===<br />
<br />
Redistribution and use in source and binary forms, with or without modification, by a Third Party who has not completed and is not in the process of completing CSE 330, of the code examples or concepts on this wiki, are permitted, provided that the following conditions are met:<br />
<br />
* Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.<br />
* Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.<br />
* Neither the name of the Washington University School of Engineering and Applied Science nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.<br />
<br />
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS TO ALL PARTIES "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.<br />
<br />
=== What it Means ===<br />
<br />
If you are a student in CSE 330, you may use the code from this wiki freely in your projects without the need for attribution. If you are not a student in CSE 330, you may use the code from this wiki freely in your projects with attribution. Either way, the code examples are provided "as is", without any warranty, and Washington University holds no liability for problems arising from the use of the content in this wiki.</div>Mitch