Day 1: The Internet vs The Web
“The internet is a system of interconnected computer networks that all use the same rules (protocols) to talk to one another.” (I couldn’t have said it better, so this is a quote from skillcrush). The World Wide Web or the web is a sharing application that helps you communicate with other computers connected within the network or ‘the internet.’ Basically, text that you can access through the internet with it (web browser). There are different kinds of networks, like you local network at work/school/home (different privacies), and public networks.As there are different networks, there are different types of web applications: chrome (i likey), mozilla, internet explorer, safari etc...
Day 2: Websites vs. Web Applications
Websites most of the time are static, use HTML/CSS and some Javascript and rarely have databases. They are not updated too much. Web applications on the other hand are dynamic, use the same languages as websites, but also have dynamic languages like PHP, Ruby, Python and frameworks like Rails, Django etc. They have databases and are updated frequently. The information on these web applications change constantly. If you’re wanting to make a website or web application, you first need to know if it needs to be updated frequently. This well help determine what you will be creating.
Q&A with a developer who learned from Skillcrush. She hit the ground running with the paid bootcamp. Also, her friend asked her to make a website for his golfing business, so in actuality she had a side project of her own (I realize now that many people who did bootcamps or are self taught, they did their own projects. My dad told me to do this, but I need to brainstorm more on what I could actually have a little project on. I know that it can be anything, but anything is so vast).
When we visit a webpage, we see images and text. HTML (hyper text markup language) are “tags” that arrange the content on the webpage/make it what we see on the existing webpage. HTML tags that are examples in the video are like <h1></h1> (Headers 1-6), <p></p> (paragraphs). Within these tags are the text that we see on the webpage. The tags help to state where you will see the text, like the header will be at the top portion stating what a header should be: what the page is about. The paragraph will state a block of text.
Tim Berners-Lee was the creator of the HTML language. He actually worked in a lab! His problem was he wanted a way to share his academic papers with his colleagues through the internet because he was quite fascinated with it. (It’s crazy! He is still alive at 63! This is surprising to me because I studied chemistry. Most of the people who have invented/discovered what I’ve learned in the courses I took, are actually not living lol). Before he created the language, it was quite complicated to share files. He not only created HTML but also URI (known as URL)/Uniform Resource Identifier and HTTP(Hypertext Transfer Protocol). People were able to access this text written in HTML/webpage via HTTP leading to the first web browser (he created an application).
Currently on HTML5. When he created this first webpage, it wasn’t as fancy as they are today. It was quite simple yet it was able to do its function, which was teach his colleagues how to utilize what he just created as well as share his academic papers.
Tags explain what each piece of content is. HTML is just for content on your site! Not for how it looks! You can actually view the code of a website/webpage by ‘View Page Source.’ It might be all jumbled up and extremely hard to read especially for beginners like me! On google chrome, you can actually debug by going to view -> developer -> developer tools. Wow!
Day 5: Making it Pretty & Interactive
HTML shows you where things should be while CSS states how it looks like: font/color/size/borders etc. They are saved as .css files. With learning html&css you can create websites for money, debugging existing websites etc. that’s quite interesting. They challenged me to look at the old .css code for their old website, and try and find what font they are using/poke around.
I noticed that fonts that she created herself were at the top/it described what it was. These are customized fonts. Next came the global style fonts like helvetica, arial and gotham/georgia, serif etc. When personalized fonts were used, they were within single quotation marks. Main one used was montserrat. Not sure where it came from.
Javascript: programming language used when things on a page change without the user physically clicking a link, like adorable slide shows, kinda annoying alerts that randomly pop up when you do something for an ad website or maybe someone clicked something wrong and they need to be notified of something, animations!
Day 6: Visual Design, UX, and UI
So many different types of design. People group these together sometimes, but each one has its own function in a part of designing.
visual(web/graphic/identity): communicate a unified, consistent visual message to a target audience.
web(UX, user interface): what it is like to browse around a website -> all of those aspects.
UX: research/planning/testing/design solutions/putting all together, but UI mainly does how the website looks
UI: hand in hand with UX how things look on the webpage
graphic design: how it looks!
identity: creating a brand’s identity through logos and icons
digital: interactive media
visual design: combination of all designs/visual communication
main thing is: user’s experience: easy to navigate/aesthetically pleasing/can people find what they’re looking for/purpose of the webpage? prioritization!??!
Laurel: “Stay curious and constantly learn” who wouldn’t want to work with someone who is enthusiastic about learning how to do said job :D?
Day 7: Frontend vs Backend
HTML is the content, CSS makes it pretty, Javascript makes it interactive. These things happen in the browser and makes up the front end.
Back end is everything that happens before it makes it to the browser like databases, servers, applications.
The world’s best content management system or cms. It is a complex web application. Ruby on rails is not a cms but it has the tools to build a complex web application like cms. No coding required with wordpress. You have your content and it directly inputs it into a website. It uses not only the ones that we have mentioned earlier, but also PHP. Apparently, so many people use this platform to create their website!
Day 9: Programming Languages
Tell the computer what to do. Computers speak to each other in binary language (zeros and ones). We use a programming language instead :)! There are many different types, but they have the same functions as in telling the computer what to do! Like languages woahhh. Popular languages for the web are PHP, Ruby and Python. They may differ due to efficiency, preference, better for different functions. Punch card programming! it was a thing!
PHP: Hypertext pre-processer: wordpress is written in this language. Multiple PHP files are utilized to retrieve information from a database to your web browser and even send information to the database. IE a PHP tag within HTML coding will use PHP file to retrieve information from the database&send it back (example used was the title of the page).
Ruby was made by Max, Japanese programmer, to make people happy! Less time coding and easy to use hehe. Easier to write code can PHP and Javascript (opinion maybe).
Day 10: How It All Comes Together
Simple, elegant, straight to the point, easy to find content, easy navigation. One website, Everlane, was built using Ruby with MySQL (some websites use more than one database for different functions) database with JQuery library and SCSS library.
There is a lot of work/people’s efforts that go into a website. For the website, they focused on the following things in order mainly product, web and art. There were multiple people working on these three things. Stated that it was difficult process because there were so many people, but with communication, it worked out.
If you do not have technical skills you are ‘expendible’ at least in her situation. It can be true.