WEBSITES //
Video Game Reviews
The site is for posting short reviews of video game; reviews can also be deleted. Each review consists of the name of the game, whether you would recommend it, and any short comments you have. You can also search for other games via titles or by username. Its purpose is for people to easily find games that they’d enjoy.
This was a group (2) project that took about 3 weeks to complete. The code was done in HTML, CSS, and JavaScript and we coded both the front end client side and back end server side. I handled the change password and the delete review functionality, though most of the work was done by both of us. This includes the Home page displaying of recent good reviews, the Search page's search via game title, the account page and sign in, the password change, the payment inputs, and the styles.
We had a bit of trouble with the scope. We over-scoped; we had plans to edit reviews, deleting an account, and being able to comment on other people's reviews. Some of these were stretch goals, but we really wanted to get them done. To handle this, we prioritized the tasks, both for what was nessiary for the base application and for time management. Posting reviews, the Home page, the Search functions, and the Account page were all top priorities. The other functions either would take too much time or were not as necessary as these.
This was a great project. The teamwork was great and we used our time effectively. This project showcases some of the best work that I’ve done in web design.
Visit by clicking Here!
The repository on GitHub!
The Pokemon PC
This application is designed to store competitive Pokemon teams. Each team has six Pokemon and a team name. You can search for teams via Pokemon or the specific team name. If nothing is in the search bar, it brings up the most recent teams.
This was a solo project that took about 2 weeks to complete. The code was done in HTML, CSS, and JavaScript and I coded both the front end client side and back end server side. Since it was a solo project, I coded everything including the team inputs, storing the teams in the database, displaying the teams,
doing the styles, and designing the background.
I didn't have many problems with this project. It was my first dealing with server side programming, so most of the problems were mostly due to my inexperience. I spent a lot of time looking up things up in my notes. This project taught me a how to retrieve data from the server and display it on the client. It does lack some features, but as my first server side project, I think that it works very well and it was nice to experiment with programming.
Visit by clicking Here!
The repository on GitHub!
Earthquake Map
Explore the world and discover when earthquakes hit a location. Drag the mouse around the map and change the radius, magnitude, and year to specify the search terms. A goal of this project was to use web APIs and online Firebase storage.
This was a group (2) project that took about 3 weeks to complete. The code was done in HTML, CSS, and JavaScript and uses the Google Maps, Earthquake USGS, and IPify APIs. I was responsible for using Vue and implementing the Google Maps API. The majority of the work was done by the both of us when we got together and worked on the project as a team. During these sessions, we both worked on implementing the functionality of a basic search using both API together, all the options (zooms, max results, search year, max radius), the mouse moving the search marker, created the admin file, did the CSS styling including the responsiveness, the quake pop-ups with info, did the IPify APIs, the Firebase cloud storage of previously searched quakes, and the local storage of the previous location.
The most challenging part of this project was the Firebase connection. We wanted to use Firebase to store the earthquakes searched. We had to find a way to transfer the data between the Earthquake API and the Firebase. This lead to us creating a ES6 class. With this class, we stored each quake's location, url to the API website, and date. Then, we were able to feed this information to Firebase in an organized way. We also used this class to display the information if you hover over an earthquake's icon.
This project was great all around. The teamwork between my partner and I was terrific; we had great dynamic and work ethic. I’m really proud with how this project turned out. It functions as we wanted, looks professional, and is useful. This project showcases some of the best work that I’ve done in web design.
Visit by clicking Here!
The repository on GitHub!
Audio Visualizer
This was a group (2) project that took about 2 weeks to complete. The code was done in HTML, CSS, and JavaScript and uses Canvas to display the effects. I coded the background circles, added a Stop button, initialized all of the options (check boxes, radio boxes, sliders, etc.), styled the entire site including the fonts, colors, layout, and responsiveness, implemented the color changing radio boxes, the Waveform checkbox, and the gradient checkbox, and started the max circle slider and the background
circle bumping.
This project had a few bumps along the road. I couldn't get Flexbox to work right.
I've used it before on other projects and it wasn’t a problem, but something about integrating it with Canvas was a challenge. I eventually got it by making the controls box a Flexbox and not the Canvas.
A lot of things went right in this project. I was able to draft up a prototype really early, which allowed us to plan out our work and get a better understanding of the project going forward. The circles in the background worked out great. They were a small background detail at first, but they evolved into a major portion of the project. The center circle is awesome. Once my partner got it working, it was everything we wanted. Because we had some extra time, we were able to add on some extra effects, like spinning.
Visit by clicking Here!
The repository on GitHub!
Personal Portfolio
This was a solo project that took about 2 weeks to complete. The code was done in HTML, CSS, and JavaScript and used the Skeleton framework and the magnific-popup CSS files. I was responsible for everything including, designing the layout, implementing the responsive design, importing the pop-up library and Skeleton framework, and the HTML layout.
The magnifiic-popup was difficult to work with. I had to spend time reviewing the comments and watching videos to learn how to get it to function how I wanted. It turned out great though. The Skeleton framework also took time to get used to. Once I understood how it worked, I was able to implement it to the fullest in this project.
I really like how this project turned out. Trying to design a website was tough, but I think that I found a good balance of fun and professional. It was one of my first experiences fully designing a site and, although it's not perfect, I think it turned out pretty darn good.
Visit by clicking Here!