CIS 3344 Labs

Lab 1: HTML & CSS

This lab is an introductory lab to HTML & CSS. For this lab, I was tasked with the creation of this lovely, simple website! This wasn't much of an issue for me as I am fairly familiar with HTML and CSS, having some experience in it not only through internships but project experiences as well.

I used a lot of CSS styling for this lab. To be specific, I made a styling sheet for every HTML page. I think the most complex styling I used was for the navigation bar, since I made my elements highlight everytime I hovered over them.

I also used float elements for both my Index and my About so I can wrap the text around my pictures.

I didn't think this assignment was too hard, but ideally I think that more time would've been preferred due to the amount of work I had to do for other classes as well. I also think that more time was necessary due to the issues I experienced with publishing and mapping my network. Overall, coding the website was not a problem.

Lab 2: Responsive Website

Click Here to Visit a Cute Dog Website!

This lab is an introduction to the use of responsive web design.

Unfortunately, I was having a lot of trouble making my #dogSection responsive. For some reason, it would not show up in the mobile version of my website. However, I was able to make every other section responsive.

I divided each section of my RWD by different #ID's and styled every class related to that ID underneath it.

I didn't think this assignment was too hard, but I believe I solid understanding of RWD and @mobile tags would have definitely helped me more, seeing how much trouble I was having fixing my website. Other than that, I had fun designing this website on dogs!

Lab 3: Video Game Store

Click Here to check out my gaming store!

This lab introduces us to the use of JavaScript.

This lab was honestly a hassle. It was very informative and it was also a very good practice with JavaScript. Unfortunately, I ran into a lot of issues while making this website. For example, I was unable to successfully filter my games by prices.

I made two filters (one for consoles and one for genres) that filters your games based on what you selected.

I also was able to add a list recommendation where a customer could input a link to any video game and that game would be added to the list. I was kind of confused by these instructions.

Lab 4: Quiz Builder

Click Here to check out a quiz builder!

This lab is a continuation of JavaScript, but I used JQuery instead.

As always, I started out by making an HTML index page but this time, I made two HTML pages, one for the quiz and one for the index. The index is basically the quizbuilder that holds the creation of the quiz, and the quiz is the quiz taker HTML page. Users are able to create a quiz based on the type of question they pick from a drop down menu and then add that question they made to a storage that will hold the question made until

There are different classes and ID's for each methods, such as Adding a question, or Submitting etc. Each method contains different ways to get and set data for all of the questions. Then, I made local storage methods for each question that is made that will store the questions for later use then all the questions have been submitted and ready to be used. I had a lot of trouble with the local storage but after some good research on Stackoverflow, I was able to get something working.

Lab 5: Home Database

Click Here to check out my Home Database!

This tutorial uses databases, PuTTy and some Ajax. :)

This lab was actually very fun. I derived great joy from doing this project, especially with databases. I was always a fan of working with databases and considering how I didn't take a class on it since last semester, it was very rewarding to get back on it especially with some JavaScript.

This lab admittedly was kind of annoying, especially with all the errors I would get from the API, such as the CORS error or when my boolean methods would return false on postman because I am missing a SINGLE quote.

All in all, this was a very good lab.

Tutorial Project

Click Here to check out my Tutorial website!

This tutorial project serves as a tutorial on node.js

NodeJS is neither a language or a framework, it is more akin to a runtime engine that allows web pages to be served up from a server. The reason that NodeJS is popular is because it is fast, scalable, and is asynchronous, which means that the program can do other tasks while Node runs.

This lab was long and tedious but offered very rewarding knowledge in front-end development. I think the hardest part for me was using the databases, since I'm not usually very good at that stuff.
I did, however, enjoy designing the layout of the website- giving it a very modern look... similar to that of Tripadvisor's (since our website is also a travel website).