The goals

1. Understand server and client

2. HTML, CSS, Bootstrap

3. JavaScript basic

🤔Practice-making a fan page

1. How web browser works

Web browsers receive HTML documents from a web server or from local storage and render the documents into multimedia web pages. So, basically it just asks for html and shows it.

But usually it only gets data for efficiency of service like the below image.

And in this case, the type of data would be JSON.

2. HTML, CSS, Bootstrap

HTML(Hyper Text Markup Language) is for structure and CSS(Cascading Style Sheets) is for decoration.
We only make a structure of website with HTML, not with CSS.

HTML elements are the building blocks of HTML pages. With HTML constructs, images and other objects such as interactive forms may be embedded into the rendered page. HTML provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items.
HTML can embed programs written in a scripting language such as JavaScript, which affects the behavior and content of web pages. Inclusion of CSS defines the look and layout of content.

Each HTML document can actually be referred to as a document tree. We describe the elements in the tree like we would describe a family tree. There are ancestors, descendants, parents, children and siblings.

It is important to understand the document tree because CSS selectors use the document tree.

Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-end web development. It contains HTML, CSS and (optionally) JavaScript-based design templates for typography, forms, buttons, navigation, and other interface components.

As of April 2022, Bootstrap is the eleventh most starred project on GitHub, with over 156,000 stars, behind freeCodeCamp, Vue.js framework, React library, TensorFlow and others.

3. Try JavaScript

JavaScript, often abbreviated JS, is a programming language that is one of the core technologies of the World Wide Web, alongside HTML and CSS.
JavaScript is a high-level, often just-in-time compiled language that conforms to the ECMAScript standard. It has dynamic typing, prototype-based object-orientation, and first-class functions. It is multi-paradigm, supporting event-driven, functional, and imperative programming styles. It has application programming interfaces (APIs) for working with text, dates, regular expressions, standard data structures, and the Document Object Model (DOM).

🤔Practice-making a fan page

➜ HTML, CSS, Bootstrap

👍🏻 Tried to use HTML, CSS and Bootstrap right after learning
👍🏻 I could design the website as I wanted
👎🏻 It would have been nice if I could make it really works with some buttons and database
👎🏻 I would like to put more functions here

💁🏻‍♀️So?

I will study more as this course goes and try to practice more to make it as my knowledge! And I will get back to this webpage to upgrade it! 🤓

One's life has value so long as one attributes value to the life of others.
-Simone de Beauvoir