Letter to Santa

JavaScript workshop (forms, inputs, validation, events, RegExp, objects, callbacks , local storage, ajax)

Slides

Check on slides, click here

Feedback

To leave feedback click here

How to use

If you familiar with git you can fork this repository to your machine and start working through files starting from README.md file, after that jump to instructions/level1.md file.

If you don't know what is git you can download the folder on your machine - go to 'releases' tab over the yellow line on the page and download folder 'Source code (zip)'. Unzip it and start from README.md file, after jump to instructions/level1.md file.

To open web-page in your browser go to index.html file and double click on it, you will see an option 'open in browser' - preferably use Chrome, but Firefox and Safari will work as well.

Follow the instructions in level1.md file and type code in your Text Editor(it is where your code lives and you can write, edit and delete code), in order to see anything that you console.log() you need refresh web page and result will be in web console on the page(you can directly write javaScript code here as well and see result straight away, but as soon as you refresh the page all code will be gone, that is why we use Text Editor).

Structure

• Css folder contains css files that are responsible for styles and how our project looks on the web.

• img folder - a place where we can store images that we will use on our web-page

• instructions folder contains files with step by step instructions on what you should do: It contains 3 files:

  • level1.md - create web form and different types of input, regular expressions
  • level2.md - store input in local storage
  • level3.md - display all wishes on wish-list page and randomly give present on result page.
  • extra-steps.md - extra tasks you can do if you are interested to learn more things and modify your small project.

• Js folder contains JavaScript files that makes our project works, it defines content and make static page functional. Contains main.js file where you write all your code. answers.js - file with whole working code.

• index.html - a file responsible for structure of our project.

• result.html and wish-list.html - our 2 other pages for result - where Santa choose on your gift and wish-list - a list of your wishes page.

• html-form-description.txt - a file with in detail explanation on HTML form and different types of input tags with it's attributes.

• regular-expressions.txt - a file with links to cheat sheet, more information and games with Regular Expressions or RegExp.

• Readme.md - a file with explanations and any information about the project, how to run it, what it is for etc.

• cheat-sheet.md - file with quick overlook for key namings and their explanations.

• LICENSE - our MIT license file.