This picture is how you create a button using HTML. All you need to do is write a button tag that looks like this (text on button). This will create a simple button that will like quite ugly.
This picture shows how you can use another language of code called CSS to style your button. In this image what I did was simply make a background color and set it to the color i wanted the botton to be. "border-radius: 25px;" will round the corners of the button. To give refrence 50px will make a perfect circle. Another important thing I did here was add a hover effect so when you hover over it the background color changes to whatever I want it to be I did this with the "&:hover" and then in curly brackets put "color: (yourcolor)".
Here is what the finished product of the buttons looked like. You can see the styling above is how I made them look like this.
This project is personally meaningful to me because it something that I love doing and can open alot of doors for me in the future, there us si much more you can do with coding then just building an app. This was especially challenging because I need to put alot of time and research into this project and and learn different types of code. One really challenging thing about creating an app is if you get one character wrong, the whole thing breaks (which has happened multiple times during the making of this project).
There were alot of challenges during this project. Learning how to use java script, html, css were huge learning curves (3 languages of code). When coding organizational skills are very import and challenging because if you need to look back somewhere in your code that is not organized it can be very time consuming. You need to pay close attention to each letter and look back to make sure you didn't make mistakes because if you get one character wrong you break your whole project. It was also a great challenge learning how to use the vode editor (vscode) with github, a website where you can store your code and share it with others.
I learned how to write and understand multiple languages of code. I learned different libraries and frameworks. Alot of the time when coding you get stuck for hours even days, so in order to pass this when I really couldn't figure something out, I would go to a website called stackoverflow where they help you when your stuck. This was not as easy as saying, "I need help". I learned how to ask proper questions in order for people to understand and explains thing to people properly.
One atl skill I learned while doing this project was organizational skills. In order for code to work it has to be organized properly. Also there is a variety of alternative ways to organize your code in order to know where things are, find bugs when you make a mistake, and making it easier to read for yourself and others. Another atl skill I learned while doing this project was creative thinking. While making this app I had to think of what do I want it to look like? What do I want it to be called? And constantly thing of creative ways to make the app better looking and functioning better.
One IB learner profile that i grew as while doing this project is balanced. While doing the project I learned how important time management is and not to undersetimate the amount of time you have. I also learned to balance my work to be able to get it done faster. Another IB profile i grew at was Inquirer because if my code was broken I would have to ask myself where did I go wrong, where in my code can I find where the mistake was? I also had to learn to make proper question in order to ask others for assistance.
I am very happy with my project and although it took alot of time and hard work the finished product was well worth it. This time around it was a small memory game but learning code and using it has helped me in so many ways to understand code, how to read and write it and eventually creating something you can call yours. It was very fun making the app and very frustrating at times but this is just the beginning and this project has opened many doors for me in the future.