microsoft/frontend-bootcamp
1
0
Fork 0
mirror of https://github.com/microsoft/frontend-bootcamp.git synced 2026-01-26 14:56:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

Day 1 readme edits (#79)

Browse Source 
* Day 1 readme edits

* Add back some explanations that got deleted in rewrites
This commit is contained in:
Elizabeth Craig
2019-03-04 19:11:45 -08:00
committed by Micah Godbolt
parent 8469521c75
commit ee1d984ee1
8 changed files with 85 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
step1-01/demo/README.md
View File

@@ -2,10 +2,10 @@
A simple web page is rendered on the screen via the following steps.
_There are many sub-steps in this process, but these are the highlights._
> There are many sub-steps in this process, but these are the highlights.
1. You instruct the browser which web page you'd like to see
2. The browser looks up the site in a "DNS Server"
2. The browser looks up the site on a DNS server
- This is like a big phone book for website server addresses
3. The browser asks the server to send over a specific page of the website, such as `developer.mozilla.org/filename.html` or `developer.mozilla.org`
- If asked for a "root"-level address, most servers will return `<root>/index.html`
@@ -23,7 +23,7 @@ _There are many sub-steps in this process, but these are the highlights._
# HTML Demo
HTML tags are the basis of all web applications. They give the page structure, and define the content within.
HTML tags are the basis of all web applications. They give the page structure and define the content within.
An HTML tag takes the following form:
@@ -31,9 +31,9 @@ An HTML tag takes the following form:
<tag class="foo" onclick="myFunction()" otherAttributes="values"> </tag>
```
HTML tags can also be nested to create a tree that we call the [Document Object Model](https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction)
HTML tags can also be nested to create a tree that we call the [Document Object Model](https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction).
The [HTML demo page](https://microsoft.github.io/frontend-bootcamp/step1-01/html-demo/html-demo.html) is a large collection of HTML elements that you will come across during development. The full list of elements can be found on [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element).
The [HTML demo page](https://microsoft.github.io/frontend-bootcamp/step1-01/demo) shows a large collection of HTML elements that you will come across during development. The full list of elements can be found on [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element).
## Sample Website

4
step1-01/exercise/index.html
View File

@@ -20,7 +20,7 @@ The power of HTML is its ability to represent complex information in a way that
1. Create a recipe page to host our recipe
2. Use header, main, footer, headings (h1/h2 etc), paragraphs, lists
3. Use ordered and unordered lists appropriately
4. Add the `baked_beans.jpg` image included in this folder: `https://raw.githubusercontent.com/Microsoft/frontend-bootcamp/master/step1-01/exercise/baked_beans.jpg`
4. Add the `baked_beans.jpg` image: https://raw.githubusercontent.com/Microsoft/frontend-bootcamp/master/step1-01/exercise/baked_beans.jpg
5. Add an anchor tag around 'Wisconsin Beer Brats'
> Note that CodePen takes care of the `HTML` and `Body` tags, so you can simply start with the content
@@ -45,7 +45,7 @@ Ingredients:
1 Walla Wall Onion chopped
3 ground garlic cloves
4 Tablespoons of mustard
3 Tablespoons of molasses
3 Tablespoons of molasses
4 Tablespoons of brown sugar
Directions: