#Javascript Is Sexy - roadmap#
##BRIEF/BACKGROUND PROJECT##
JavaScript is the first true programming language I'm keen to impove. I have a basic understanding of programming languages, but as Frontend developer I'm keen to gain a deeply understanding and practice of JS.
I found online this roadmap http://javascriptissexy.com/how-to-learn-javascript-properly/ and I think it s valid starting point.
I bought a copy of the book they suggest : Professional JavaScript for Web Developers (3rd Edition), which I found very good.
Even if, at the moment, I'm still in my second weeks of reading, I have tryied to kick off with the quiz project.
##DESCRIPTION##
Simple dynamic Quiz in JS - still in developing.
I want to try to NOT use JQuery or other JS library. Pure JS ..just to try..to learn and have fun!
##ACCESS TO THE PROJECT##
Pubblic access at http://artitudinale.org.uk/JS_Quiz/
##CROSS-BROWSER TESTING##
This project has been tested in : Chrome 38.0
##TECHNOLOGIES USED##
HTML5, JavaScript
##FUTURE IMPROVEMENT## Those are bugs to fix and some ideas to improve the project
- Finalise the quiz : review JS code and clean consol.log
- Add nice simple style CSS or Bootstrap
- Add client-side data validation: make sure the user answers each question before proceeding to the next question.
- Add a “Back” button to allow the user to go back and change her answer. The user can go back up to the first question. For the questions that the user has answered already, be sure to show the radio button selected, so that the user is not forced to answer the questions again, which she has completed.
- Add animation (fade out the current question and fade in the next question). It suggesting JQuery (will see)
- Test the quiz on IE 9, and fix any bugs. This will give you a good workout ;)
- Store the quiz questions in an external JSON file.
- Add user authentication: allow users to log in, and save their login credentials to local storage (HTML5 browser storage).
- Use cookies to remember the user, and show a “Welcome, ‘First Name'” message when the user returns to the quiz.
- Use Twitter Bootstrap for the entire page layout, including the quiz elements to make it look more polished. As an added bonus, use the tabs user interface component from Twitter Bootstrap and show 4 different quizzes, one on each tab.
- Learn Handlebars.js and add Handlebars.js templating to the quiz. You should no longer have any HTML in your JavaScript code. Your quiz is getting more advanced, bit by bit.
- Keep a record of all the users who take the quiz and show each user how his or her score ranks among the scores from other quiz takers.
That's will be probably an other repo:
- Later (after you have learned Backbone.js and Node.js or Meteor.js), you can use these technologies to refactor your quiz code and turn the same quiz into a sophisticated, single-page, modern web application built with the latest JavaScript frameworks. And you will store the users’ authentication credentials and scores in a MongoDB database.
PLESE IF YOU EXPERIMENT ANY BUGS/ERRORS/PROBLEMS TESTiNG OR CHECKING OUT THIS PROJECT report it though GITHUB or @ alex.garulli@gmail.com