Code 301 Reading Notes

hallo there i will sumorize for you some concepts that i learned from html-css book and JS book and How to Write a Git Commit Message from additional resources.

in the end there is a quiz for you and a map for our info. 💯

How the Web Works (visualization):

When you visit a website, the web server hosting that site could be anywhere in the world. In order for you to find the location of the web server, your browser will first connect to a Domain Name System (DNS) server.

visualization

Structure : its the page how its looks these are main pionts you need to understand :

There are three types of HTML lists: ordered, unordered, and definition.
Ordered lists use numbers.
Unordered lists use bullets.
Definition lists are used to define terminology.
Lists can be nested inside one another.

Shay Howe’s intro to RWD

Templating with Mustache:

Javascript templating is a fast and efficient technique to render client-side view templates with Javascript by using a JSON data source. The template is HTML markup, with added templating tags that will either insert variables or run programming logic. The template engine then replaces variables and instances declared in a template file with actual values at runtime, and convert the template into an HTML file sent to the client.

example :

Mustache.render(“Hello, ”, { name: “Sherlynn” });
// returns: Hello, Sherlynn

A Guide to Flexbox:

display This defines a flex container; inline or block depending on the given value. It enables a flex context for all its direct children.

example:

visualization ; for more info : more

Flexbox Froggy

Welcome to Flexbox Froggy, a game where you help Froggy and friends by writing CSS code! Guide this frog to the lilypad on the right by using the justify-content property, which aligns items horizontally and accepts the following values:

flex-start: Items align to the left side of the container. flex-end: Items align to the right side of the container. center: Items align at the center of the container. space-between: Items display with equal spacing between them. space-around: Items display with equal spacing around them. For example, justify-content: flex-end; will move the frog to the right. for more: float practice Mustache.js Official Documentation

Cheats sheet :

Markdown is a way to style text on the web. You control the display of the document; formaing words as bold or italic, adding images, and creating lists are just a few of the things we can do with Markdown. Mostly, Markdown is just regular text with a few non-alphabetic characters thrown in, like # or *.you just need to make a file with .md extension on Vs code and good to go with this cheats sheet:

HEADERS :

    # This is an <h1> tag
    ## This is an <h2> tag
    ##### This is an <h6> tag

list :

     orderd:
         1. Item 1
         2. Item 2
         3. Item 3
     unorder:    

         * Item 3a
         * Item 3b

EMPHASIS :

*This text will be italic*
_This will also be italic_
**This text will be bold**
__This will also be bold__
*You **can** combine them*

BLOCKQUOTES :

> I’ve always been more interested
> in the future than in the past.

I’ve always been more interested in the future than in the past.

LINKS:

http://github.com - automatic!
[GitHub](http://github.com)

IMAGES :

![GitHub Logo](/images/logo.png)
Format: ![Alt Text](url)

table :

First Header | Second Header
----------- | -------------
Content cell 1 | Content cell 2
Content column 1 | Content column

emoji! :

:+1: :sparkles: :camel: :tada:
:rocket: :metal: :octocat:

for more info : markdown cheats

The seven rules of a great Git commit message:

Keep in mind: This has all been said before.
Separate subject from body with a blank line.
Limit the subject line to 50 characters.
Capitalize the subject line.
Do not end the subject line with a period.
Use the imperative mood in the subject line.
Wrap the body at 72 characters.
Use the body to explain what and why vs. how.

this map for our info :

map

this a quiz for you :

use the images in your page.

Remember :

FOUCS

no pain no gain

work hard

find more :

concepts	link
HTML Chapter 1: “Structure”	Structure
HTML Chapter 8: “Extra Markup”	ExtraMarkup
HTML Chapter 17: “HTML5 Layout”	Layout
HTML Chapter 18: “Process & Design”	Process & Design
JS Chapter 1: “The ABC of Programming”	The ABC of Programming
Cheats sheet	Cheats sheet

link for the github file : gitfile

writen by OBADA ALHAWJREH.

My name is obada jaber, I’m 27 years old, I studied Mechanical engineering and i graduated from al balqa applied university, i am now a software student. OBADA ALHAWJREH.

Support or Contact:

Having trouble with Pages? Check out our : email or phone number : 0781912474 or contact support for gethub and we’ll help you sort it out. 🚑 🚑 🚑