Monday, June 16, 2014

This Thursday, Docusign is having an open house. This would be a great opportunity to meet hiring managers at a great company. Your instructors Danny and Aaron currently work there. Actually, they will be teaching Thursday and going to the open house after. Hope it works out for you guys to go!

On a logistics note, the code in our Seahawks repository is updated. It is our commitment to have this updated during or immediately after class so you can review what we did in class, even if you aren't there. We will start by downloading the zip (lower right) at the beginning of every class to ensure that everyone is on the same page.

Thanks for sticking with the class, I know students and instructors alike are very busy during the semester. I hope everyone is finding it beneficial.

Monday, May 19, 2014

Our updated project source code is located here. Some of the recent changes have been adding normalize.css, data.js and JQuery to our project.
If you remember from a theory Monday class, normalize.css makes cross browser compatibility much easier. Take our word for it, it will save us many headaches down the road.
Data.js is the data that we are going to use for the inventory of our website. It is actually just a JSON blob assigned to the variable 'inventory'. We will be able to use this blob of data for keeping track of the inventory on our website. We might create a shopping cart JSON blob later. Try out JSON Lint to create some JSON if you don't have practice. This data format maps DIRECTLY to Javascript objects and is a big part of object oriented javascript, a pretty hot job skill of late.
JQuery is going to make our javascript worlds cleaner, easier to understand overall a whole lot cooler. Mondays class will dig into JQuery a little further.

Remember not to group all of the individual nav items for now. It will make sense as we add more things to our web page. Change some of the above values in your own code so you can see which items are affected on the page.

I also shared a Google Drive folder containing the images with everyone (the one referenced as the background-image for the header and one more we will use). If you did not get an email letting you know that a folder has been shared with you, send an email or post something here and we will get you a copy.

Friday, March 28, 2014

The code we worked in class on 3/27 is shown below. This will be the foundation that we will be building off of for the rest of the semester. Make sure to save your code somewhere for now that you can get at it and keep adding to it week after week. We are working on an online solution for you, more details to come.

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>Seahawks Merch</title>

</head>

<body>

<header>

<div>

<h1>We are 12</h1>

<div>

<input type="text" />

<button>shopping cart</button>

</div>

</div>

</header>

<nav>

<ul>

<li><a href="#">Mens</a></li>

<li><a href="#">Womens</a></li>

<li><a href="#">Kids</a></li>

<li><a href="#">Jerseys</a></li>

<li><a href="#">Accesseries</a></li>

<li><a href="#">T-Shirts</a></li>

<li><a href="#">Sweatshirts</a></li>

<li><a href="#">Hats</a></li>

</ul>

</nav>

<section>

</section>

<section>

<ul>

<li>

<img src="" />

<h3>Shop Mens</h3>

</li>

<li>

<img src="" />

<h3>Shop Womens</h3>

</li>

</ul>

</section>

<footer>

<div>

<h2>Check out our fans!</h2>

</div>

</footer>

</body>

</html>

Hopefully you can write and understand the mark up above. If you have any problems don't forget to GTS (Google That S***). Some people have been using Code Academy and W3Schools to learn more about some of the tags and attributes. Those are both good places to go through some tutorials and learn extra on your own. I also heard that Code Academy has an app you can download so you can practice on your commute.

Have a great Spring Break. Looking forward to seeing everyone the following week.

So far in class, we have learned the following tags. ALL of these get 'nested' between the <body> and </body> tags (see below):

Paragraph:
<p>this is a paragraph</p>

Unordered list:
<ul>
<li>ul stands for 'unordered list'</li>
<li>li stands for 'list item'</li>
<li>li elements are 'nested' inside the ul</li>
<li>li elements have a bullet point in front of them by default</li>
</ul>

Ordered list:
<ol>
<li>ol is an ordered list. There will be numbers in front of each li, list item</li>
</ol>

It is always good to review the basic HTML structure:
<html>
<head>links to other documents and settings go in here</head>
<body>
<p>EVERYTHING you see on an HTML page goes inside the body tag</p>
</body>
</html>

Some very important tags that we haven't learned yet are:Anchor links - This is what runs the interwebs!Images - This is what makes the interwebs look pretty!

Practice makes perfect with HTML, make sure get as much exposure as you can!