Challenge Activities
-
Module 1: 1-5 Challenge
In this challenge I was instructed to build my first website. It was interesting adjusting and designing the different features myself, though I found myself getting lost a few times on minor things and wasting valuable time. Note to self, next time draw a sketch on a white board or paper before starting the actual work. The importance of specificity was very noticeable as often my style would not work because of it. In conclusion, it was very difficult to get a final product that looked reasonable and decent. My css skills are very limited and working on this project demonstrated that.
-
Module 2: 2-5 Challenge
In this challenge I learned how to apply css design onto a webpage. It was a frustrating experience but one that I learned a lot from. Not having starter code was a real challenge as I needed to figure things on my own. I'm starting to get a bit more comfortable with writing css but I still struggle with the placement of elements on the page. Especially when I want to float certain elements, I find myself needing to tweak things constantly due to specificity and placement. There are many "variables" that I need to take into consideration and its enough to forget one and the layout will look messy. It is most likely due to my lack of experience, but I find myself repeating the same basic page layout. this assignment was interesting as it forced my to challenge myself and create a different layout. I was also able to create my first table which was nice. It is a very useful skill that I will definitely use in the future.
-
Module 3: 3-3 Challenge
In this challenge, we were instructed to apply our graphic design skills to our website. I the main thing that I learned is how to add background images to various elements in a web page and how to manipulate these images in different ways. My skills are improving fast and although my webpages still need a lot of work, they are starting to look more and more professional [at least in my eyes]. This was a difficult challenge but I'm quite satisfied with the outcome. I'm starting to understand how structuring my html page is VERY important since applying css styles to similar [but different] elements is tricky. I found myself wanting to apply different styles to elements that were grouped together and using a class/id for each one can make matters complicated when applying css selectors. I am also starting to notice the different ways different browsers are presenting the webpages. I use both chrome and firefox and can see how my design slightly changes when changing browsers. The feature I like the most in my website so far[and one I've just learned], is the fixed background and the fact that the body of the page scrolls.
In this challenge I learned how to add and design a web form. This is a very useful feature and I can definitely see how I'll use in the future. Every website out there is using forms one way or the other. The most feat. I like the most about the web form is the ability to guide the users' input by making some field required and adding an obligatory pattern to the fields. It really gives the designer the ability to "control" what the result will be and can help the company that is behind the website to get refine the results that it is trying to get from the form.
-
Module 5: 5-5 Challenge
In this challenge I implemented scripts in a webpage independently for the first time. All the work on the webpage was done through the JS script and it gave me an opportunity to learn and explore JS. Specifically, I had to work with arrays and use loops to add values to the arrays. I had to insert these arrays into the html page and use JS function to do so. I also had to use conditional statement in order to add certain values to specific arrays and research (and apply) JS functions independently.
It is interesting to see how I can manipulate an html file without touching it at all. Everything is done through JS. The thing that I appreciated the most in my project was the ability to add large amount of data into an html file, without needing to type each and every item. It is specifically handy when needing to insert and populate and table of any sort. -
Module 6: 6-5: Challenge: Manipulating the DOM
- About Me Page
- My Collection Page
In this assignment I learned how to manipulate a webpage while using only JS. the fact that I can desgin a webpage without "touching" it is very nice yet very challenging. I especially liked the fact that I can apply styles to the elements through the script but it was hard to accomplish. it was also challenging to figure out which method or function can be applied to which element. There are a lot of methods but my lack of experience prevented me from working efficiently and every small change that I was trying to apply required a lot of time and research. I definitely need to polish my JS skills and improve my knowledge so that I can work faster.
In this assignment I learned how to insert elments dynamically into an HTML page while using JS. I learned how to create a table dynamically and work with an array in order to populate the table whithout "hardcolding" the date. I also learned how to insert style rules in my webpage while using only JS. This assignment was very challenging since it was conceptually hard to understand how to desgin the webpage without "touching it". with that, it is definitely an important skill that can help create web pages in a more professional and time efficient way.
-
Module 6: 6-7: Challenge: Handling Events on Form Elements
- National Pet Competition
In this challenge I learned how to manipulate a form using JS. I learned how to connect the different fields to each other so that they get updated "live" as data is fed into them by the user. I also learned how to make parts of the page visible to user once he checks a box and how keep it invisible otherwise.
I really liked to learn how to connect the different boxes to each other and update the data live in them. It looks very professional and makes the form look and feel much more elegant. I also like the idea of making certain elements invisible and enabling the user to opt in and display them if needed. that as well makes the form looks very professional in my opinion. I don't like the idea of inserting style through the script. Aside from the fact that I encountered difficulties while trying to do that, it feels cumbersome and I hope that it's not a common practice. -
Module 7: 7-1 Challenge: JavaScript Final
- Match Game
In this challenge I had to write a symbol match game program while using only JS. It was the peak of my learning experience with JS so far. I learned how to insert html elements and manipulate them with JS. I also learned how add style to my page without connecting an external stylesheet to my webpage.
Although it was very challenging I liked the fact that I had to write a whole program from scratch and improve my coding skills. In a way I was required to create very simple logarithm that will execute the game. It is a very powerful skill and I liked the fact that I needed to train that muscle in my brain.
Other than that, one of the things I struggled with the most was scope issues which I encountered quite frequently. I constantly had to adjust my code since the functions I was trying to call were not being called. I also had a hard time creating the different boards based on the user's initial input. The requirement for a square when possible was something that took me a while to figure out. Having said that, it was interesting and challenging to create something on my my own and in a way helps me build my confidence for future projects and courses.