Hosted Project
https://js-beginners.github.io/quote-of-the-day-project/GitHub Source Files
https://github.com/JS-Beginners/quote-of-the-day-projectProject Objective
The objective of this JavaScript project is to wire up a very basic JavaScript quote generator.JavaScript Used
- Inline JavaScript
- JavaScript objects
- JavaScript selectors
- JavaScript math library
My Personalize Summary
Level of Difficulty
As stated in this project's objective, it is a very basic project that requires you to know how to code a JavaScript object and put it into an array of objects. The JavaScript array consists of a six different objects, each with two name value pairs. One name-value pair is the author and his or her name, and the other name-value pair is the quote and the actual quote itself. The code was pretty easy to follow. And, just like the previous JavaScript Mortgage Calculator project, it seems that this course author prefers to use inline JavaScript. Again, while it's not hard, it's something that'll make you look at the documentation again, if you're not familiar with the name of inline events.
New Things Learned or Refreshed
Nothing much was new to me in this project. However, it did serve as a quick reminder. Whenever you're using quotes in your text strings, you have to use the JavaScript escape character ( / )in your code, else, JavaScript will scream error. In other words, instead of using something such as:let test = "hello "my" name is Test"
<– This doesn't work
You have to use: let test = "hello \"my\" name is Test"
<– This works!
The alternative is to wrap single quotes in double quotes or vice versa, like this:
let test2 = "hello 'my' name is Test"
<– This works, too
Time to Code
This project took me about 20 minutes to listen, watch, and code out the solution.Lines of Code
This project uses around 20 lines of JavaScript code, including white space and code comments.Your Turn!
What to Accomplish
- Download the source code from the github repository above.
- Delete the contents of the
quotes.js
file. - Implement the JavaScript code in your own
quotes.js file.
- If you think you need to see a video solution first, be sure to pick up Bluelime's 27 JavaScript Projects Beginner Course .
- Add a link to your finished project below!
What You Should See
Visit the hosted github page to see this JavaScript quote generator in action.Need to see the video solution for this project?
Get BlueLime's JavaScript for Beginners: Create 27 Projects from Scratch Course
Leave a Reply