Web Development
This Web Development course was my first encounter with coding and building websites. I was super apprehensive coming into this class with no experience and honestly not a huge interest in the subject. However, I did acknowledge that web development is a large part of understanding new media and that it was important for me to understand the basics in order to be more comfortable working with websites in the future. Through the assignments and courses in this class, I learned various ways to build and customize websites, as well as create them on different platforms. In this course, I have gained basic skills in HTML (and CSS), Bootstrap, WordPress, and JavaScript. Along with learning in class, we also used Free Code Camp to build upon our coding knowledge. Besides the obvious web development knowledge, I also had to work on my time management, self-learning, and work ethic to succeed in the course. Oftentimes I struggled to get something to work or to get something perfect (as a slight perfectionist) so I had to ask questions when appropriate and also figure things out myself along the way. While I still have a lot of room to learn and grow, I'm proud of the websites I was able to create in this course and the skills I picked up along the way.
Artisinal Handcrafted Website
For the first project in the course, I created a three-page website entirely by hand using HTML and CSS. As this was the first website I made, it is rather basic. This website focuses on my trip to Chicago during summer break. I added my own photos as well as custom CSS styling to fit my aesthetic. For my first go at creating a website, I was proud of what I came up with and was happy to show off my trip photos!
Bootstrap Triptych
For our second project, we created "triptychs" with three separate websites (aka the panels in a triptych) that featured the same content, but each website was created differently. The first panel of the triptych was a website built entirely from scratch, using only standard Bootstrap components. The second panel was simply the Bootstrap theme that we choose to use for the project. Through this panel, I learned how to best select a reliable and compatible Bootstrap theme to work with and customize. The third panel was our complete customization of the Bootstrap theme filled with our own content. I learned to work with Bootstrap and how to customize the website to my own liking by changing the HTML and CSS. This assignment explored the wide uses of Bootstrap and how we can work with prebuilt and customizable templates. Bootstrap also is responsive and features useful components. For the triptych, I decided to create my website about a niche but relatable subject in my world: Barbie Movies.
WordPress Shop
Our third assignment was to work with WordPress and build a WordPress shop using the popular plugin WooComerce. I learned how to install WordPress to my server, choose a WordPress theme, customize a theme, and create an online shop website. While the shop isn't real, I did create a home and product page and fleshed out a couple of the items I decided to sell in my store. I also played around with the elements that I could add to the pages in order to create a better look and display the necessary information. Since this was a completely pretend store, I decided to be slightly silly and create a shop geared towards millionaires (or more like billionaires). Although it was a bit frustrating working with WordPress and trying to customize it to my exact specifications, I liked my end product. I like researching and adding in the products to be sold in the store and enjoyed adding in little touches (logo, colors, and look) to really pull the Rich Kids Club idea together.
JavaScript Jukebox
The fourth project was based on working with JavaScript and creating a sort of jukebox. Using a base file to start with, I customized the JavaScript file in order to play my chosen music and display corresponding pictures. I envisioned creating a "jukebox" where I would be able to choose certain vinyl records to play Taylor Swift songs. As the songs played, the vinyl record would be spinning on top of a record player as one would in real life. It took some trial and error to position things exactly where I wanted and create the spinning animation but I love how simple yet fun this project turned out to be.
Final Project
For the final project in the Web Development course, we had free rein over what we would make. After some struggles, I finally was able to build a WordPress site to act as my personal blog (which I titled "Marisa's Mind). I got to explore WordPress further and definitely had to learn a little to make it act the way I wanted. I added some custom CSS and plugins in order to achieve the look and functionality that I was aiming for. For the content on my blog, I decided to add my personal recommendations and a bunch of photos that I love.
Web Dev Work
This was the original index page that held all of my work (assignments and projects) for the Web Development course. This was completely created with just HTML and CSS, featuring links and custom styling.
