WD-Assign13

Web Site Development

Assignment 13 of 14 due in 1 week (note it may take longer - so be patient with yourselves)

• Updated: 8/2/2017 by http://JilMac.com

• eMail: Jil@JilMac.com or JilMac.MacRand@gMail.com

• Phone: 802-254-8628 M-F 6am-8pm, S-S 8am-8pm or for additional hours call or eMail to setup.

1. Review

Course Evaluations - End-of-semester course evaluations will be available soon. All students receive an email message today with a link to their course evaluations, and the link is also available to them in the Welcome module in the upper-right corner of the student portal page. Evaluation results will be available to faculty after the semester is over.

IF the CLASS has 75% completion EVERYONE will receive 2 extra credit points.

Extra Credit Opportunities: Watch 5 of them and give me 100 words = 2 points wThe more you watch and write about the more points you earn.

19 Marketing TED Talks that will blow your Mind https://trackmaven.com/blog/best-marketing-ted-talks/

Adding Javascript will add actions to your site - but it is still all on the client side. To be able to store data collected from an HTML form you need a server side language like PHP. Notice from Chapter 16, when the form info was displayed - it was done with .php code. EX. show-data-after.php

Chapter 19 JavaScript - one of the fastest growing languages on the web.

Here are some interesting articles:

• • How it feels to learn JavaScript in 2016 https://hackernoon.com/how-it-feels-to-learn-javascript-in-2016-d3a717dd577f#.lrejdhpb2

  • Angular-2 is getting a lot of converts

3. Discussion/Research Assignment

MOOC (Massive Online Open Courses) - the big 3 players were: Coursera, Udactiy, edX

Are they still?? How would you Google them to find out?

Khan Academy http://KhanAcademy.org

Khan Programming https://www.khanacademy.org/computing/computer-programming

Computer Science - Learn to Code Tutorials http://csedweek.org/learn

Washington University's Web Development: https://www.washington.edu/accesscomputing/webd2/student/index.html

SASS is the newest was to code complex CSS - Code Academy has a $19.95 per month course so research what SASS is: https://www.codecademy.com/learn/learn-sass?utm_source=customerio&utm_campaign=code_tip_course_announcement&utm_medium=email_newsletter&utm_content=sass_button

Here is my Friend and Fellow Marlboro Graduate Center classmate Jen Kramer discussing SASS

Ed X Intro to JQuery - JavaScript's Largest & most Active LIBRARY https://www.edx.org/course/introduction-jquery-microsoft-dev208x-1

· Khan Academy uses JavaScript to teach Computer Programming - they use Written, Interactive (similar to w3schools Try-Me) and video. If you look for the DOCUMENTATION link on each training page - it will give a nice overview of the code-words and their options. Sometimes DOCUMENTATION is in the Left-Nav and sometimes on a TAB under a video ... look for it! https://www.khanacademy.org/computing/computer-programming

· Learn JavaScript with Khan Academy

a. Drawing & Animation https://www.khanacademy.org/computing/computer-programming/programming

Note: to see the code within HTML code https://www.w3schools.com/graphics/svg_ellipse.asp

b. Games & Visualizations https://www.khanacademy.org/computing/computer-programming/programming-games-visualizations

c. Advanced JavaScript https://www.khanacademy.org/computing/computer-programming/programming-natural-simulations

d. Making WebPages Interactive https://www.khanacademy.org/computing/computer-programming/html-css-js

e. jQuery https://www.khanacademy.org/computing/computer-programming/html-js-jquery

NOTE: You can Cut & Paste the examples IF you STOP the Demo and THEN Cut and Paste the code

Click the Gear Icon and turn on Interactive Transcript (CC=Closed Captioning) with Time Stamps!

· Read/watch/research and give me 200+ words on what you found useful, what you think after learning the "Khan" way.

4. Code Examples/3 Before & After

Do 3 Before & After examples from the Chapters, put links to them on your Google Web Site's Assignment13 web page.

You might even feel comfortable using an example from the W3schools page you Researched.

When you are ready for JilMac to grade you, put a LINK to the Google Assignment13 web page in Moodle.

Fun Student Examples from Previous Semesters

5. Workshop – JavaScript

STARWARS - Download files to your computer - scroll all the way to the bottom of the handouts pg.

https://sites.google.com/site/jilmactraining/web-development/wd-Assignments/WD-Handouts

JavaScript Examples - copy all the files - and try it on your WebSite - or find other interesting ones - and I'll add them to this list!

Star Wars - http://jam08260.classweb.ccv.edu/WebDev/Assignment13/StarWars/CSS-Star-Wars-Crawling-Titles-AFTER.html

Tick-Tak-Toe - http://jam08260.classweb.ccv.edu/WebDev/Assignment13/TicTacToe-with-JavaScript/TicTacToe.html

Turn on a Light Bulb - http://jam08260.classweb.ccv.edu/WebDev/Assignment13/LightBulb

Calculator - http://jam08260.classweb.ccv.edu/WebDev/Assignment13/Calculator-JS

Find Coordinates - http://jam08260.classweb.ccv.edu/WebDev/Assignment13/Image-Co-ordinates/coords-funny-picture.html

• JavaScript Libraries & Frameworks: JQuery, JQuery-UI, Moving picture using MooTools

  • Google Hosted Libraries: https://developers.google.com/speed/libraries/

  • Developer Open Source Libraries

  • jQuery https://developers.google.com/speed/libraries/#jquery

    • jQuery-UI https://developers.google.com/speed/libraries/#jquery-ui

  • MooTools https://developers.google.com/speed/libraries/devguide#mootools

    • Do Jo https://developers.google.com/speed/libraries/#dojo

    • AnjularJS https://developers.google.com/speed/libraries/#angularjs

    • Top JS Libraries https://www.google.com/?gws_rd=ssl#q=top+js+libraries+2016

  • What do they do? https://colorlib.com/wp/javascript-frameworks/

Please note - there is NO Assign13 Word Document everything is on this page.