College and Career Fair Reflection Journal

           In the college and career fair on December 16, there were many representatives from schools, different career fields, companies, and also some of them were alumnis. Some of the representatives were Hunter, Monroe College, the army and marines, SUNY Polytech, and many more. After their introductions, I went around the different tables and talked to them. They talked about their experiences, gave advice, and also talked about the programs that were offered at their school. In this college and career fair, I was able to look at different fields of experience and also gain some knowledge that I didn't previously know. They came with the purpose of opening up our minds to different options and know that it is alright if we are not too sure about what we want right now because our mind could change. They also had some internships that they offered and talked about. It was fun when they were giving out prizes, which were their products. Overall, it was a very nice experience.
          As I talked to some of the colleges, I saw that some students were doing an internship over there. It was interesting and I would like to know more about those opportunities.  Additionally, some of the companies showed us their product. It was so creative and we also had opportunities to try those products. In the college fair, Steve Madden Company, had a raffle game. They were giving out their own products such as scarf, winter glove, and bags. I think they should have come visit us earlier in the beginning of the year because then seniors would be able to put some of the college that they visited to their college applications.

Lab 7 Reflection Journal

        For this lab I had to create a mad libs game in where I ask the user to give me nouns, adjectives, and verbs. Then I replace the blank spaces in the mad libs with the user's input. I first created the html document and applied my overall css to it. Then after I put in my headings, I put the mad libs story in a paragraph. I put the span tag around the nouns, adjectives, and verbs fill in the blank and gave them all an id name and put separate colors to be able to tell where the user's input went. After that, I created my javascript file where I had to create an array where I ask for a prompt (either noun, adjectives, or verbs), and I used the document,getElementById("idname").innerHTML to replace the text with whatever was put in the prompt.
       The prompt asks for adjectives 6 times, nouns for 11 times and for 1 verb. Then I tested it out and published it in thimble. I can see myself using this skill in the future for when I am doing a project that requires the use of arrays. This is relevant to web design because you can manipulate arrays by using the array name.concat or array name.push or array name.shift. Also the it would be more organized to use the array. I learned how to do something using a different method.

Lab 6 Reflection Journal

       In lab 6 I had to create a javascript rollover, html rollover, and a gif. In this lab I used the software Dreamweaver and Photoshop CS6. I had a paragraph above each of the 3 sections to have it labelled as to what it is. First I did the html rollover which Dreamweaver did for me. I went to insert, image media, html rollover. Then I selected 2 pictures that were in my lab 6 folder and then Dreamwevaer automatically did it for me. Then to make the gif I went to Photoshop, to the timeline panel and I clicked create a frame animation. In the first frame I had a gradient of black and white which was extended onto the 2nd frame. I created a new layer in which I had an arrow. I put the arrow in only the second frame so the gif just had an arrow popping up. Then I saved it for the web and selected the option for it to loop forever. Then I inserted the image in my html document.

     For the javascript rollover, first I made 2 tables. The first table had a bigger image of the first image in the second table. There was only one image in the first table. In the second table I put 5 images. After that I had to put the onmouseover event handler for the images and also I named the image in first table r1. So in my javacript file I had pic1-pic 6 and set it equal to a new image. Then I put its source as the image that I inserted into the second table. I had to use the if else statement. In the else statement it has all the pic1-pic6 equal to each other and the document.r1. I see myself using this in the future for a project to make it automatically enhance my website. This is important to web design because it was kind of like a slideshow but not really and is a rollover instead.

Lab 5 Reflection Journal

                  

       For lab 5 I had to create a rock, papers, scissors, or rope game. In this rock, papers, scissors, rope game, there had to be more than 3 options which is why I used rope and we had a reference on codeacademy for how the lab should be but it oly had 3 options. I followed the format like how it was in code academy and made some switches like making it an alert box instead of having console.log. Using Dreamweaver CS6, I created the base html document for lab 5 and linked it to the external overall css file of mine. Using the <button> tag, I created a button with an onclick event that runs the javascript for the game. I asked the user for a choice using prompt and stored it in a variable and in another variable I stored the computer's choice which was at random.

      For an equal chance I had the probability chance of each option at 25%. I used an alert box that told the user what their choice was and what the computers choice was and now I had to compare the functions. I used the if else if and else statement for this part. After all of the choices were compared, I called out the variable. I can see myself using this in the future for future labs when I have to create another game using javascript or anything that involves options. This is relevant to web design because knoing how to compare functions using the if else statement is really necessary for examples of when you want to create something that has more than one option.

Lab 4 Reflection Journal

      Lab 4 was a practice lab where we answered and demonstrated the questions on the javascript review sheet that was given in class. For this lab, I used the <p> tag to write the questions. I used the <textarea> html tag to write the answers for some of the questions while others I just used another paragraph tag (<p>). I made buttons with an onclick event handler that loaded the specific javascript for each of the questions answers for my demonstration. Some of the questions that didn't need demonstration like linking the external javascript file just had the answers written down. 

      I gave an id name to the answers written in paragraph so I could use my css to have it a different color so it wouldn't be too confusing. This is relevant to web design because this lab was to help further my understanding of javascript and actually know how to use the code. I used this skill in the future for when we had the javascript survival game because the lab was due before we had the game and also I will use my knowledge of this again in the future for projects and labs that I will have to do.

Lab 3 Reflection Journal

   

      For lab 3, using Dreamweaver CS6, I created a base html document for lab 3 and I had the javascript written internally. The objective of this lab was to ask the user for 2 numbers and then the computer would add, subtract, multiply, and divide the numbers showing the results to the user. We somewhat made a limited calculator. First I kinda did the lab a bit wrong instead of asking for the user their input I just gave numbers and had the computer do the calculations for that number. Then I finally understood what we actually had to do so I made a button and named it calculator using the <button> html tag.
      There is an onclick event for the button so the javascript would be activated when clicking that button. In my javascript I had to use variables to store the information in there and then use that varibale later for the computer to use it for the calculations. I used window.alert to tell the user the results. This is relevant to web design because I learned how to use variables so I can apply this javascript to every individual instead of just one person. I see myself using this skill in the future for when I want the user to directly interact with the website.

Lab 2 Reflection Journal

 

       For this lab, I created an html document, applied my overall css, and linked the separate external javascript file to my html document using the software Dreamweaver CS6. I had to insert an image of myself which I took using Photo Booth and I put it inside my lab 2 folder and inserted it inside my html document. I had to have 3 smart goals which i first wrote a paragraph about each of them. My smart goals were to pass all of my classes with a 90 or above in the fall semester, to graduate by the end of the year with a CTE diploma, and to have a successful career pursuing whatever I will be interested in after I finish college.

       I had to create 3 buttons and that when you click on the button a pop up of my smart goal comes up with the option of clicking ok or cancel. I first made buttons with an onclick event that loads the function which has the alert(""); code and inside the alert code is the smart goals. For the option of closing it, there is a confirm line of code. This is relevant to web design because I learned how to activate popups when clicking on a button which could be required of me in in the future when the client doesn't just want to bombard the user with many popups but have them click something for it to come up. 

Lab 1 Reflection Journal

 

           For lab 1, I created an html document linked with my overall css and javascript file. Then I had to write 3 paragraphs about myself (who I am) and what obtaining a CTE diploma means to me. After I finished writing those 3 paragraphs, I had to make a button so that when you click on it it changes the text to another text. I used the onclick event handler and document.getElementById javascript code to change the text from "this is a demonstration" to "hello javascript". I gave the paragraph an id name which I used for the document.getElementById Javascript code. After I finished then I uploaded it onto the server. 

          The software that I used was only Dreamweaver for this lab. I created css, javascript and html document in this software. This is relevant to web design because you can use javascript to enhance the quality of your website significantly. Also this was my first javascript lab and it can help me understand how to use javascript more with practice. I see myself using this in the future for when I make websites for my clients and they need this action of javascript.

Switch and Loops Reflection Journal

JavaScript Switch Statement:





    The switch statement is used to perform different actions based on different cases. The value is compared to the values of each case. You can have as many cases as you want for the switch statement. The switch statement has a default in case if none of the cases are applied. You have to be careful when writing your code because it is case sensitive so you have to make sure that it is written exactly as it should be like for these statements in all lowercase. The default for the switch statement does not necessarily have to be the last case in the switch statement, though it is preferred. Also the break in the switch statement tells the computer to stop testing the case after it gets the match and saves a lot of time. The switch expression is evaluated at once.
This is the syntax of the switch statement:
switch(expression) {
case n:
code block break;
case n:
code block break;
default:
default code block
}


JavaScript for Loop:










      A loop executes a block of code for a certain number of times. It is useful when you want to repeat the same code over again but for a different values as in an array. There are 4 types of loops: for, for/in, while, and do/while. The for loop is used when you want to execute a block of code a number of times. The for/in loop is used when you want to loop through the properties of an object and the while loop is used when you want to loop through a block of code while a specified condition is true. The do/while loop is the same as the the while loop. 

The for loop syntax is:

for(statement 1; statement 2; statement 3) {

code block to be executed

}

The while loop syntax is:

while(condition) {

code block to be executed

}

The do while loop syntax is:

do {

code block to be executed

}

while(condition)

Javascript If Else Statements and Switch Reflection Journal

       I learned about the selection statements which were the if else and switch statements. The if statement executes a code if the condition is true. In the if else statement the else statement is executed if the condition in the if statement is not true. The else if statement has a different condition from the if statement and executes the code in the else if statement when the condition from the if statement is not true and the condition in the else if statement is true. The else statement executes the code if both the if statement and else if statement conditions are false. The switch statement has many different possibilities and can execute the code according to the case. The difference between the if else statements and the switch statements are that the code from the if else statements stops at 3 statements at the max while you can have as many cases as you want for the switch statement. The switch statement also has a default in case if none of the cases are applied. You have to be careful when writing your code because it is case sensitive so you have to make sure that it is written exactly as it should be like for these statements in all lowercase. The default for the switch statement does not necessarily have to be the last case in the switch statement, though it is preferred. Also the break in the switch statement tells the computer to stop testing the case after it gets the match and saves a lot of time.