Udemy html

Full-StackBootcamp/3.0+List+Elements/3.0 List Elements/index.html

@@ -0,0 +1,36 @@
+<h1>Angela's Cinnamon Roll Recipe</h1>
+
+<h2>Ingredients</h2>
+
+<h3>For the dough:</h3>
+
+<ul>
+<li>¾ cup warm milk</li>
+<li>2 ¼ teaspoons yeast</li> 
+<li>¼ cup granulated sugar</li>
+<li>1 egg plus 1 egg yolk</li>
+<li>¼ cup butter</li>
+<li>3 cups bread flour</li>
+</ul>
+
+<h3>For the filling:</h3>
+
+<ul>
+<li>2/3 cup dark brown sugar</li> 
+<li>1 ½ tablespoons ground cinnamon</li>
+<li>¼ cup butter</li>
+</ul>
+
+<h3>Instructions</h3>
+<ol>
+<li>Mix the milk with the yeast, sugar, eggs.</li>
+<li>Melt the butter and add to the mixture.</li>
+<li>Add in the flour and mix until combined into a dough.</li>
+<li>Knead the dough for 10 minuites. </li>
+<li>Transfer the dough into a large bowl and cover with plastic wrap. Leave it somewhere to rise for 2 hours.</li>
+<li>After the dough has doubled in size, roll it out into a large rectangle. </li>
+<li>Melt the butter for the filling and mix in the sugar and cinnamon.</li>
+<li>Spread the filling onto the dough then roll the dough into a swiss roll.</li> 
+<li>Cut the roll into 3cm sections and place flat into a baking tray.</li>
+<li>Pre-heat the oven to 350F or 180C, then bake the rolls for 20-25min until lightly brown.</li>
+</ol>

Full-StackBootcamp/3.0+List+Elements/3.0 List Elements/solution.html

@@ -0,0 +1,65 @@
+<!-- Scroll down for a sample solution -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<h1>Angela's Recipe for the Best Cinnamon Rolls </h1>
+
+<h2>Ingredients</h2>
+
+<h3>For the dough:</h3>
+<ul>
+  <li>¾ cup warm milk</li>
+  <li>2 ¼ teaspoons yeast </li>
+  <li>¼ cup granulated sugar</li>
+  <li>1 egg plus 1 egg yolk</li>
+  <li>¼ cup butter</li>
+  <li>3 cups bread flour</li>
+</ul>
+
+<h3>For the filling:</h3>
+<ul>
+  <li>2/3 cup dark brown sugar </li>
+  <li>1 ½ tablespoons ground cinnamon</li>
+  <li>¼ cup butter</li>
+</ul>
+
+
+<h2>Instructions</h2>
+
+<ol>
+  <li>Mix the milk with the yeast, sugar, eggs.</li>
+  <li>Melt the butter and add to the mixture.</li>
+  <li>Add in the flour and mix until combined into a dough.</li>
+  <li>Knead the dough for 10 minuites.</li>
+  <li>Transfer the dough into a large bowl and cover with plastic wrap. Leave it somewhere to rise for 2 hours.</li>
+  <li>After the dough has doubled in size, roll it out into a large rectangle.</li>
+  <li>Melt the butter for the filling and mix in the sugar and cinnamon.</li>
+  <li>Spread the filling onto the dough then roll the dough into a swiss roll.</li>
+  <li>Cut the roll into 3cm sections and place flat into a baking tray.</li>
+  <li>Preheat the oven to 350F or 180C, then bake the rolls for 20-25min until lightly brown.</li>
+</ol>

Full-StackBootcamp/3.1+Nesting+and+Indentation/3.1 Nesting and Indentation/index.html

@@ -0,0 +1,24 @@
+<!-- Write your code below -->
+<ul>
+    <li>A</li>
+    <li>B</li>
+    <ol>
+        <li>B1</li>
+        <li>B2</li>
+        <ul>
+            <li>B2a</li>
+            <ul>
+                <li>B2aa</li>
+                <li>B2ab</li>
+            </ul>
+            <li>B2b</li>
+            <li>B2c</li>
+        </ul>
+        <li>B3</li>
+        <ol>
+            <li>B31</li>
+            <li>B32</li>
+        </ol>
+    </ol>
+    <li>C</li>
+</ul>

Full-StackBootcamp/3.1+Nesting+and+Indentation/3.1 Nesting and Indentation/solution.html

@@ -0,0 +1,60 @@
+<!-- Scroll down for a sample solution -->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<ul>
+  <li>A</li>
+  <li>
+    B
+    <ol>
+      <li>B1</li>
+      <li>B2
+        <ul>
+          <li>B2a
+            <ul>
+              <li>B2aa</li>
+              <li>B2ab</li>
+            </ul>
+          </li>
+          <li>B2b</li>
+          <li>B2c</li>
+        </ul>
+      </li>
+      <li>B3
+        <ol>
+          <li>B31</li>
+          <li>B32</li>
+        </ol>
+      </li>
+    </ol>
+  </li>
+  <li>C</li>
+</ul>

Full-StackBootcamp/3.2+Anchor+Elements/3.2 Anchor Elements/index.html

@@ -0,0 +1,9 @@
+<h1>My top 5 Favourite Websites</h1>
+<!-- Write your code below -->
+<ol>
+<li><a href="https://www.google.com">Product hunt</a></li>
+<li><a href="https://www.youtube.com">Smash the walls</a></li>
+<li><a href="https://www.facebook.com">Wordle </a></li>
+<li><a href="https://www.twitter.com">Hacker Typer</a></li>
+<li><a href="https://www.instagram.com">Stellarium</a></li>
+</ol>

Full-StackBootcamp/3.2+Anchor+Elements/3.2 Anchor Elements/solution.html

@@ -0,0 +1,20 @@
+<h1>My top 5 Favourite Websites</h1>
+<!-- Write your code below -->
+<ol>
+  <li><a href="https://www.producthunt.com/">Product Hunt</a></li>
+  <li><a href="https://smashthewalls.com/">Smash the Walls</a></li>
+  <li><a href="https://www.nytimes.com/games/wordle">Wordle</a></li>
+  <li><a href="https://hackertyper.com/">Hacker Typer</a></li>
+  <li><a href="https://stellarium-web.org/">Stellarium</a></li>
+</ol>
+
+
+
+<!-- Extra challenge Solution-->
+<ol start="5">
+  <li><a href="https://www.producthunt.com/">Product Hunt</a></li>
+  <li><a href="https://smashthewalls.com/">Smash the Walls</a></li>
+  <li><a href="https://www.nytimes.com/games/wordle">Wordle</a></li>
+  <li><a href="https://hackertyper.com/">Hacker Typer</a></li>
+  <li><a href="https://stellarium-web.org/">Stellarium</a></li>
+</ol>

Full-StackBootcamp/3.3+Image+Elements/3.3 Image Elements/index.html

@@ -0,0 +1,11 @@
+<!-- Kitten image URL -->
+<h1>Are you a cat person?</h1>
+<img src = "https://raw.githubusercontent.com/appbrewery/webdev/main/kitten.jpeg"/>
+
+
+<!-- Puppy image URL -->
+<h1>Are you a dog person?</h1>
+<img src = "https://raw.githubusercontent.com/appbrewery/webdev/main/puppy.gif"/>
+<h1>Imagen extra x</h1>
+
+<img src = "https://picsum.photos/200" alt = "kidWomen"/>

Full-StackBootcamp/3.3+Image+Elements/3.3 Image Elements/solution1.html

@@ -0,0 +1,3 @@
+<h1>I am a Cat Person</h1>
+<img src="https://raw.githubusercontent.com/appbrewery/webdev/main/kitten.jpeg" alt="kitten held in hand" />
+

Full-StackBootcamp/3.3+Image+Elements/3.3 Image Elements/solution2.html

@@ -0,0 +1,2 @@
+<h1>I am a Dog Person</h1>
+<img src="https://raw.githubusercontent.com/appbrewery/webdev/main/puppy.gif" alt="puppy digging in the sand" />

Full-StackBootcamp/3.4+Birthday+Invite+Project/3.4 Birthday Invite Project/index.html

@@ -0,0 +1,16 @@
+<!-- Example image URL -->
+<h1>It's my Birthday!</h1>
+<h2>on the 12th May</h2>
+<img src = "https://raw.githubusercontent.com/appbrewery/webdev/main/birthday-cake3.4.jpeg" alt="Birthday Cake">
+
+<h3>what to bring:</h3>
+
+<ul>
+  <li>Baloons (i love baloons)</li>
+  <li>Cake (I'm really good at eating)</li>
+  <li>an appetite (there will be lots of food)</li>
+</ul>
+<!-- Example Google Maps Link -->
+
+<h3>Location</h3>
+<a href="https://www.google.com/maps/@35.7040744,139.5577317,3a,75y,289.6h,87.01t,0.72r/data=!3m6!1e1!3m4!1sgT28ssf0BB2LxZ63JNcL1w!2e0!7i13312!8i6656" target="_blank">Google map link</a>

Full-StackBootcamp/3.4+Birthday+Invite+Project/3.4 Birthday Invite Project/solution.html

@@ -0,0 +1,18 @@
+<!-- This is one possible solution -->
+<h1>It's My Birthday!</h1>
+<h2>On the 12th May</h2>
+
+<img src="https://raw.githubusercontent.com/appbrewery/webdev/main/birthday-cake3.4.jpeg"
+  alt="purple birthday cake with candles" />
+
+<h3>What to bring:</h3>
+<ul>
+  <li>Baloons (I love baloons)</li>
+  <li>Cake (I'm really good at eating)</li>
+  <li>An appetite (There will be lots of food)</li>
+</ul>
+
+<h3>This is where you need to go:</h3>
+<a
+  href="https://www.google.com/maps/@35.7040744,139.5577317,3a,75y,289.6h,87.01t,0.72r/data=!3m6!1e1!3m4!1sgT28ssf0BB2LxZ63JNcL1w!2e0!7i13312!8i6656">Google
+  map link</a>

Full-StackBootcamp/4.0+File+Paths/4.0 File Paths/Folder0/index.html

@@ -0,0 +1,14 @@
+<h1>All the Animals</h1>
+<h2>Rabbit:</h2>
+<img src = "./rabbit.png" alt="Rabbit">
+
+<h2>Cat:</h2>
+<img src = "./Folder3/cat.png" alt="Cat">
+<h2>Dog:</h2>
+<img src = "../dog.png" alt="Dog">
+
+<h2>Fish:</h2>
+<img src = "../Folder1/fish.png" alt="Fish">
+
+<h2>Bird:</h2>
+<img src = "../Folder1/Folder2/bird.png" alt="Bird">

Full-StackBootcamp/4.0+File+Paths/4.0 File Paths/Folder0/solution.html

@@ -0,0 +1,16 @@
+<h1>All the Animals</h1>
+
+<h2>Rabbit:</h2>
+<img src="./rabbit.png" alt="rabbit" />
+
+<h2>Cat:</h2>
+<img src="./Folder3/cat.png" alt="cat" />
+
+<h2>Dog:</h2>
+<img src="../dog.png" alt="dog" />
+
+<h2>Fish:</h2>
+<img src="../Folder1/fish.png" alt="fish" />
+
+<h2>Bird:</h2>
+<img src="../Folder1/Folder2/bird.png" alt="bird" />

Full-StackBootcamp/4.1+Webpages/index.html

@@ -0,0 +1,7 @@
+<h1>Welcome to My Website!</h1>
+<!-- Add an image of yourself that links to the about page -->
+<a href = "./public/about.html">
+<img src = "./assets/images/cat.png" alt="Cat"></a>
+<hr />
+<!-- Add a link to your contact me page here -->
+<a href = "./public/contact.html">Contact Me</a>

Full-StackBootcamp/4.1+Webpages/info.html

@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+
+</body>
+</html>

Full-StackBootcamp/4.1+Webpages/public/about.html

@@ -0,0 +1,20 @@
+<h1>About Me</h1>
+<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sem tellus, sagittis non odio nec, interdum
+  elementum lacus. Ut ac justo eget risus sollicitudin fringilla sed ut leo. Ut condimentum elit nec fermentum lobortis.
+  Quisque tincidunt quam nec tincidunt ullamcorper. Integer vitae pretium justo. In placerat volutpat pellentesque.
+  Etiam
+  gravida quam vitae odio pulvinar imperdiet. Vivamus venenatis gravida purus sit amet aliquet. Ut in nibh sed quam
+  laoreet lacinia. Cras cursus ut dui vitae posuere. Vivamus volutpat urna vitae odio fringilla placerat. Nulla vel
+  rhoncus sapien. Phasellus at interdum enim.</p>
+
+<p>Curabitur elementum sagittis mollis. In porta nec quam ut semper. Nulla volutpat neque quis lacus mattis eleifend.
+  Phasellus et congue odio. Mauris tristique, nisl quis porttitor porttitor, tortor ante mattis ex, at dictum tortor
+  dolor
+  ut sem. Nullam nec libero non ex porta vulputate a eu sapien. In nec bibendum mauris. Fusce iaculis lectus vel magna
+  laoreet gravida.</p>
+
+<p>Donec euismod vestibulum arcu, a blandit metus mattis ultrices. Integer quis hendrerit justo. Maecenas sed tempor mi.
+  Fusce egestas urna leo. Mauris viverra sem sed libero egestas, volutpat aliquet magna porta. Quisque id diam sed ipsum
+  interdum sollicitudin id quis augue. Donec congue nisl nec massa ornare imperdiet quis quis odio. Etiam ut volutpat
+  nisl. Vestibulum hendrerit justo nibh, eget consequat magna fermentum finibus. Pellentesque et urna fringilla, rutrum
+  neque in, varius leo. Vestibulum efficitur id massa eget pellentesque.</p>

Full-StackBootcamp/4.1+Webpages/public/contact.html

@@ -0,0 +1,9 @@
+<h1>Contact Me</h1>
+<p>Tel: +123456789</p>
+<p>Email: me@gmail.com</p>
+<p>Address:</p>
+<p>
+  123 North Street<br />
+  Some City<br />
+  Some Country <br />
+</p>

Full-StackBootcamp/4.1+Webpages/solution.html

@@ -0,0 +1,7 @@
+<h1>Welcome to My Website!</h1>
+<!-- Add an image of yourself that links to the about page -->
+<a href="./public/about.html"><img src="./assets/images/cat.png" alt="cat" /></a>
+<hr />
+
+<!-- Add a link to your contact me page here -->
+<a href="./public/contact.html">Contact Me</a>