Embedded Files
Description: For this project, we were assigned to code and create a digital resume of ourselves using our knowledge on HTML, CSS, and Java Script coding. We had two pages - one for our "resume", and one for our "hobbies". In our website page, we added lots of information about ourselves, including our name, email, portrait photo, highlights, education, achievements, skills, extracurriculars, and a contact form. We also would have hyperlinks at the bottom of the page that brings the user to the hobby page, the Pinewood website, and this portfolio website.
Step 1 - HTML: We started off by adding the content of the page using HTML code. This included added the all the text and information, which was my name, email, photo, three highlights, education, five achievements, a table for skills and ability, and my extracurriculars. On my hobbies page, I added my three hobbies with a description of them and pictures.
In the HTML code, we learned how to apply heading tags, paragraphs, image tags, ordered lists, unordered lists, and tables.
Step 2 - CSS: Next, we added CSS styling to the page to make it more visually appealing. We used external CSS in a separate file and linked it to our original HTML file. We learned how to target specific elements using ID and class elements. I changed the text color, font, background color, text-align, margins, padding, font size, font weight (how bold it is), border, and I learned how to make the hyperlink buttons change color and size as the mouse hovered over it.
Step 3 - JavaScript: Lastly, we linked another file to our HTML file - the JavaScript file! This made my page interactive. I used JavaScript in my last section - the contact form. I programmed it so that the user can type in their name, email, and a message. Once they hit submit, a personalized alert will pop up to inform them that it has been sent successfully and properly.
Reflection: In this project, I am extremely proud of everything that I have learned - HTML, CSS, and JavaScript. I have learned so many new topics, and it has been so fun to apply my new knowledge into creating something myself.
S - Strenghts: Some strengths of my project is the visual appeal and great amount of information on the pages. I made the pages look the best they could look with lots of detail and photos.
O - Opportunities: Some opportunities where I could improve my project is maybe adding even more JavaScript to my page. I only have JavaScript in the contact form, but it could be cool if I could have applied it in other places as well.
U - Understanding: I learned so much this project. Learning HTML, CSS, and JavaScript code was so much fun, and I feel very accomplished now that I know how to apply my knowledge.
L - Limitations: Some limitations I encountered during this project were just some bugs in my code along the way. However, I learned how to check my code and ended up fixing all the bugs!
WISCR: The two qualities that I believe I demonstrated this project were W (Well Rounded), and I (Insightful and Critical Thinkers). I was well-rounded because I learned three different programming languages and was able to use my knowledge on all three of them to create my resume. I was an insightful and critical thinker because I was always looking for ways to improve my project - whether it was choosing a different color, making the border thicker, or adding more information - to make it the best that it could be.
Page updated
Report abuse