Posts

Showing posts from March, 2019

Lab 29 Reflection Journal

Image
            For this lab we needed to display a sentence or phrase onto the web page which when the JavaScript is added would have a text shadow effect with different colors and distances from the original. The position of the duplicates will be determined by the position of the users mouse and will move when the mouse moves. For my lab I used the phrase "WOAH!" with a fire emoji in the front because why not. The color and the distance of the text shadow is all determined by the JavaScript which creates this pretty cool effect.             I don't know if i'll use this exact type of effect on my own work in the future but I can use something similar to the code we learned from this lab to create a pretty cool effect which would attract the interest of people visiting my work. This lab was overall cool because its fun to see the different types of things you can do with coding and that will this variety of things you can ta...

Lab 28 Reflection Journal

Image
            In this lab we created essentially a local storage on the web page in which when the user puts information into the text box then when the information is submitted no matter if the page is reloaded the information will always be there for the user to see. The lab was completed using all JavaScript which ran a function which prevented the data from being erased when the page is refreshed as well as using the submit event which allowed the user to input the information they desire.             The skills gained from the lab are useful to use when the times comes that we need to save local information onto or web page or website such as a search history this code will allow the user to be able to come and see what they previously looked for without the hassle of searching for it once again if forgotten.

Lab 26 Reflection Journal

Image
            In this lab we created a basic transition in which when the user would scroll into position then the image would come into view such as it is appearing out of nowhere. I completed this lab by simply creating a function which would determine where on the page the user is on and then if in the position of where an image is the image would smoothly slide into view. Thats basically all the lab was and it very simple to do by using JavaScript and will be very useful in implementing in future work. I will try to use the skills here in my other work in order to create a better experience for the user and increase the likelihood that the user would come back again.

Lab 25 Reflection Journal

Image
            For this lab in particular we once again came back to the JavaScript console in which we had to create basically a secret password in which when typed then a message would appear in the console itself in this case it would be "DING DONG!".  To complete the lab I created a function which would check if a key was pressed or not and if so then the key which was pressed would be displayed on the console and when the keys were pressed which would then be the secret word which in my case would be "kevin" then the message would display as well.             The skills gained from the lab can be useful to add to other work as it allows you to collect information of which keys are being pressed and therefore can be used to add certain interactive elements that the user can experience. I will try to add this to my own work to create a better experience for my users.

Lab 24 Reflection Journal

Image
            For this lab the main objective was to create a custom video player in which the user can interact with the video. Using JavaScript we manipulate the elements of the video enabling the user to increase and decrease the speed of the video and there is also a progress bar below in order for the user to keep track in where they are at in the video. The video I chose to use was a dog meme compilation and after placing the video on to the page with the help of JavaScript as well as CSS I was able to create buttons which actually manipulate the video.             The skills gained from the lab can be used in a variety of situations as we are learning to manipulate elements even in videos as well. Therefore when it comes to adding a video into our website or work in general we can better understand and create a more interactive webpage for the user as well as a better experience.  

Lab 23 Reflection Journal

Image
            For this lab we created a bunch of check boxes in like a survey type or manner and the main objective of the lab was to make sure the check boxes work and take in the input of the user to see whether he/she checked a box or not, as well as if the shift key was pressed then a check box was clicked then all the boxes would be selected this is normal to see in survey type pages and even questionnaires and its a good thing to know in the future as it further widens my knowledge and my classmates knowledge in coding. To complete the lab a function was created which would determine if the shift key was being clicked and if true would then select all the boxes.             Like I said before the skills gained from the lab are useful as we can implement to future work and even in general its a good thing to know how it works so we can later use it anytime we are asked to create a survey or even a questionnaire so there...

Lab 22 Reflection Journal

Image
            For this lab we not only played around with the JavaScript console again but we also applied JavaScript which would change the CSS of an element once clicked for this instance it happened to be the p tag which held the words "xBREAKxDOWNx". By using the query Selector for the p tag I was able to create a function which would then be activated when the p tag was clicked and would changed the size and color of the words. In the JavaScript console there would be a display of names and a count which display how many times a name was display which was done by using the console.count attribute.           The skills gained from the lab especially manipulating elements using JavaScript will be very useful to use in future work whether it be labs or projects and even my own portfolio. I think I will definitely try to add it to my work in order to make my work more interactive to the user and a better experience in general. ...

Lab 21 Reflection Journal

Image
            This lab reminded me of a similar activity we did using app lab on code.org in our junior year but instead of having app lab to make it easier we had to write the JavaScript ourselves which was interesting but a pretty simple task to do. For the lab we had to create a canvas on the web page in which the user can move the mouse around and a paintbrush effect would activate enabling the user to draw anything. But unlike regular paintbrushes when the x and y value of the mouse changes so does the size and color of the brush. To start the x and y value of the mouse needed to be individually declared as a variable so a function can be created so that every time the values change so would the color and size. Therefore, as long as the user moved around the mouse on the canvas he/she can paint anything she desires.             This lab was fun to do and the skills gained from the lab can be utilized as we can take the ...

Lab 20 Reflection Journal

Image
            I was actually pretty excited for this lab when I first saw because it looked really cool and fun to do and I was right. This lab focused on flex panels and the first thing we had to do to complete this lab was create divs in which the panel would be contain within as well as the text that would be displayed and the images. To create the effect of the panel growing bigger and smaller when clicked JavaScript and CSS was used in which when the panel was clicked the JavaScript function would then select a class which would changed the style of the panel which would therefore create the effect which can be seen. The lab was pretty fun to create and for my theme I used images of the night sky and created my quotes which made sense if read horizontal only.             The skills gained from the lab are overall useful and can be used in future labs and projects as it is a cool way to display information even in our own i...

Lab 19 Reflection Journal

Image
            In this lab just like the previous one it was displayed within the JavaScript console and used the basic fundamentals of the last lab being the const. Instead of creating list containing important women throughout history we had to create a list containing 3 teachers within the school with 5 comments about each teacher as well as the student id of each person who commented, as well as the date in which the teacher started teaching for the DOE in order to find out if the teacher had tenure or not. Like the previous lab we had to sort the information to get that piece that we wanted to retrieve later in this case it was the student id's as well as if the teacher had tenure or not. Functions were created in order to find out the comment a particular student made by using his/her id number as well as a true or false function to find out whether or not the teacher had tenure or not.              The skills gain...

Lab 18 Reflection Journal

.