coding-boot-camp · AnirbanTalukder · May 18, 2021 · May 18, 2021 · May 18, 2021 · May 23, 2021
diff --git a/PREWORK_AT/Module-12/Screen Shot 2021-05-24 at 12.10.31 AM.png b/PREWORK_AT/Module-12/Screen Shot 2021-05-24 at 12.10.31 AM.png
diff --git a/PREWORK_AT/Module-12/Screen Shot 2021-05-24 at 12.10.40 AM.png b/PREWORK_AT/Module-12/Screen Shot 2021-05-24 at 12.10.40 AM.png
diff --git a/PREWORK_AT/Module-3/Example/example.md b/PREWORK_AT/Module-3/Example/example.md
diff --git a/PREWORK_AT/Module-3/aboutMe.rtf b/PREWORK_AT/Module-3/aboutMe.rtf
@@ -0,0 +1,8 @@
+{\rtf1\ansi\ansicpg1252\cocoartf2580
+\cocoatextscaling0\cocoaplatform0{\fonttbl\f0\fswiss\fcharset0 Helvetica;}
+{\colortbl;\red255\green255\blue255;}
+{\*\expandedcolortbl;;}
+\margl1440\margr1440\vieww11520\viewh8400\viewkind0
+\pard\tx720\tx1440\tx2160\tx2880\tx3600\tx4320\tx5040\tx5760\tx6480\tx7200\tx7920\tx8640\pardirnatural\partightenfactor0
+
+\f0\fs24 \cf0 Url: https://anirbantalukder.github.io/prework-about-me/}
diff --git a/PREWORK_AT/Module-4/My_First_Website.html b/PREWORK_AT/Module-4/My_First_Website.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+
+    <title>Hello World!</title>
+  </head>
+
+  <body>
+    <h1>Panda Fan Site!</h1>
+
+    <p>
+      I LOVE PANDAS!!! I LOVE PANDAS!!! I LOVE PANDAS!!! I LOVE PANDAS!!! I LOVE
+      PANDAS!!!
+    </p>
+
+    <h2>Reasons I like Pandas</h2>
+
+    <ul>
+      <li>They are fuzzy</li>
+      <li>They are cute</li>
+      <li>They are adorable</li>
+    </ul>
+
+    <img
+      src="http://images4.fanpop.com/image/photos/17800000/Cute-Panda-Cubs-Together-pandas-17838800-450-324.jpg"
+      alt="Cute Pandas"
+    />
+
+    <br />
+
+    <a href="http://www.pandafix.com/">PandaFix.com</a>
+  </body>
+</html>
diff --git a/PREWORK_AT/Module-4/Tribitue_To_Scorpions.html b/PREWORK_AT/Module-4/Tribitue_To_Scorpions.html
@@ -0,0 +1,90 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8" />
+    <title>Here I'm Rock you like a hurricane!</title>
+    <link rel="shortcut icon" type="image/jpg" href="https://cdn.wallpapersafari.com/23/31/qtL0ZR.jpg" />
+</head>
+
+<body>
+    <h1>A tribiute to Scorpions</h1>
+    <img src="https://www.bandswallpapers.com/data/media/19/scorpions_wall_t.jpg" alt="Scorpions" />
+    <h2>About Scorpions</h2>
+    <p>
+        This German hard rock band was formed at school in 1965 by guitarist Rudolf Schenker (31 August 1948, Savstedt,
+        Germany). With younger brother Michael Schenker (b. 10 January 1955, Savstedt, Germany; guitar), Klaus Meine (b.
+        25 May 1948, Hannover, Germany; vocals), Lothar Heimberg (bass) and Wolfgang Dziony (drums), they exploded onto
+        the international heavy rock scene with Lonesome Crow in 1972. This tough and exciting record was characterized
+        by Schenker’s distinctive, fiery guitar work on his Gibson ‘Flying V’ and Klaus Meine’s dramatic vocals. Prior
+        to recording their major label debut for RCA Records, Heimberg, Dziony and Michael Schenker left, the latter
+        joining UFO. Uli Jon Roth, Francis Buchholz and Jürgen Rosenthal stepped in on guitar, bass and drums
+        respectively, for the recording of 1974’s Fly To The Rainbow. Rudy Lenners took over as drummer from Rosenthal
+        the following year. The following releases, In Trance and Virgin Killer, epitomized Scorpions’ new-found
+        confidence and unique style - a fusion of intimidating power-riffs, wailing guitar solos and melodic vocal
+        lines. Produced by Dieter Dierks, the improvements musically were now matched technically. The band’s reputation
+        began to grow throughout Europe and the Far East, backed up by exhaustive touring. 1977’s Taken By Force saw
+        Herman Rarebell (b. 18 November 1949) replace Lenners, with the band branching out into power ballads, bolstered
+        by emotive production, for the first time. Although commercially successful, Roth was not happy with this move,
+        and he quit to form Electric Sun following a major tour to support the album. Tokyo Tapes was recorded on this
+        tour and marked the end of the first phase of the band’s career. This was a live set featuring renditions of
+        their strongest numbers.
+    </p>
+
+    <br />
+    <p>Know the legends well: <a href="https://www.the-scorpions.com/" target="_blank"
+            rel="noopener noreferrer">Scorpions official site</a></p>
+
+
+    <h1>Live Albums and releases</h1>
+    <table>
+
+        <tr>
+            <td align="left">Album</th>
+            <td align="left">Released</th>
+        </tr>
+        <tr>
+            <td align="left">Tokyo Tapes</td>
+            <td align="left">1978</td>
+        </tr>å
+        <tr>
+            <td align="left">World Wide Live</td>
+            <td align="left">1985</td>
+        </tr>
+        <tr>
+            <td align="left">Live Bites</td>
+            <td align="left">1995</td>
+        </tr>
+        <tr>
+            <td align="left">Acoustica</td>
+            <td align="left">2001</td>
+        </tr>
+        <tr>
+            <td align="left">Get Your Sting & Blackout</td>
+            <td align="left">2011</td>
+        </tr>
+        <tr>
+            <td align="left">MTV Unplugged – Live in Athens</td>
+            <td align="left">2013</td>
+        </tr>
+    </table>
+    <h2>Members</h2>
+    <ul>
+        <li>Rudolf Schenker</li>
+        <li>Klaus Meine</li>
+        <li>Matthias Jabs</li>
+        <li>Paweł Mąciwoda</li>
+        <li>Mikkey Dee</li>
+    </ul>
+
+
+    <br />
+    <h2>Exclusive Interview with the Scorpions</h2>
+
+    <iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/MZnkLmhzZtE?autoplay=1&mute=1"
+        title="YouTube video player" frameborder="0"
+        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+        allowfullscreen></iframe>
+</body>
+
+</html>
diff --git a/PREWORK_AT/Module-5/index.html b/PREWORK_AT/Module-5/index.html
@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title>CSS Practice</title>
+    <link rel="stylesheet" href="style.css">
+
+</head>
+
+<body>
+
+    <!-- Center -->
+    <h1>The Wonders of CSS!</h1>
+
+    <hr>
+
+    <h2>Fun With Text!</h2>
+
+    <!-- Change text color -->
+    <p id="c_red">This text is red.</p>
+    <p id="c_blue"> This text is blue.</p>
+    <p id="c_green">This text is green.</p>
+
+    <!-- Change font-size -->
+    <p id="c_big">This text is BIG!</p>
+    <p id="c_tiny">This text is tiny...</p>
+
+    <!-- Center -->
+    <p id="cen_allign">~~This text is centered~~</p>
+
+    <!-- Bold -->
+    <p id="bold">If we have something important to say, we can make it bold!</p>
+
+    <!-- Change font -->
+    <p id="diff_font">We can even change our font-family if we are feeling creative!</p>
+
+    <!-- Multiple attributes -->
+    <p id="mul_sty">Try combining multiple attributes to make big, orange, bold text!</p>
+
+    <hr>
+
+    <!-- Classes -->
+    <p class="styledFont">We can also apply the same style to multiple HTML elements.</p>
+    <p class="styledFont">Each one of these lines is within a different &ltp&gt tag, yet they all have the same styling.
+    </p>
+    <p class="styledFont">That's because they are all a part of the same CSS class!</p>
+    <p class="styledFont">CSS classes let us define a style once and let us then apply it to multiple elements!</p>
+    <p class="styledFont">In your external CSS file, create a style for the class styledFont.</p>
+    <p class="styledFont">Notice how every time you change the class styledFont, all of the text changes.</p>
+
+    <hr>
+
+    <p>Just as classes can be used to style multiple elements, id's are used to style single, unique elements. Give the following image a border by adding style attributes to your external CSS file. (Hint: Remember to include a border width, style, and color.)</p>
+
+    <!-- Border & id -->
+    <img id="styledImage" alt="Picture of the CSS Icon" src="https://www.viewlike.us/wp-content/uploads/2013/04/css3-markup.jpg">
+
+    <hr>
+
+</body>
+
+</html>
diff --git a/PREWORK_AT/Module-5/style.css b/PREWORK_AT/Module-5/style.css
@@ -0,0 +1,64 @@
+body {
+    background-color: white;
+}
+
+h1 {
+    text-align: center;
+    color: black;
+}
+
+h2 {
+    text-align: left;
+    color: black;
+}
+
+#c_red {
+    color: red;
+}
+
+#c_blue {
+    color: blue;
+}
+
+#c_green {
+    color: green;
+}
+
+#c_big {
+    font-size: x-large;
+}
+
+#c_tiny {
+    font-size: small;
+}
+
+#cen_allign {
+    text-align: center;
+}
+
+#bold {
+    font-weight: bold;
+}
+
+#diff_font {
+    font-family: fantasy;
+}
+
+#mul_sty {
+    font-size: x-large;
+    font-weight: bold;
+    color: orange;
+}
+
+.styledFont {
+    font-size: 12px;
+    font-family: cursive;
+    color: green;
+    font-style: italic;
+}
+
+#styledImage {
+    border: 5px solid orange;
+    width: auto;
+    height: auto;
+}
diff --git a/PREWORK_AT/Module-6/index.html b/PREWORK_AT/Module-6/index.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title>Jiggle Into JavaScript</title>
+    <link rel="stylesheet" href="style.css">
+    <!-- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> -->
+</head>
+
+<body>
+
+    <p>Press the buttons to change the box!</p>
+
+    <div id="box"></div>
+
+    <button id="button1">Grow</button>
+    <button id="button2">Blue</button>
+    <button id="button3">Fade</button>
+    <button id="button4">Reset</button>
+
+    <script type="text/javascript" src="javascript.js"></script>
+
+</body>
+
+</html>
diff --git a/PREWORK_AT/Module-6/indexEx.html b/PREWORK_AT/Module-6/indexEx.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title>Jiggle Into JavaScript</title>
+</head>
+
+<body>
+
+    <p>Press the buttons to move the box!</p>
+
+    <div id="box" style="height:150px; width:150px; background-color:orange; margin:25px"></div>
+
+    <button id="shrinkBtn">Shrink</button>
+    <button id="growBtn">Grow</button>
+    <button id="resetBtn">Reset</button>
+
+    <script type="text/javascript">
+        document.getElementById("shrinkBtn").addEventListener("click", function() {
+
+            document.getElementById("box").style.height = "25px";
+
+        });
+
+        document.getElementById("growBtn").addEventListener("click", function() {
+
+            document.getElementById("box").style.height = "250px";
+
+        });
+
+        document.getElementById("resetBtn").addEventListener("click", function() {
+
+            document.getElementById("box").style.height = "150px";
+
+        });
+    </script>
+
+</body>
+
+</html>
diff --git a/PREWORK_AT/Module-6/javascript.js b/PREWORK_AT/Module-6/javascript.js
@@ -0,0 +1,15 @@
+document.getElementById("button1").addEventListener("click", function() {
+    document.getElementById("box").style = "height:250px; width:250px;"
+});
+
+document.getElementById("button2").addEventListener("click", function() {
+    document.getElementById("box").style = "background-color:blue;"
+});
+
+document.getElementById("button3").addEventListener("click", function() {
+    document.getElementById("box").style.opacity = "0.3";
+});
+
+document.getElementById("button4").addEventListener("click", function() {
+    document.getElementById("box").style = this.style;
+});
diff --git a/PREWORK_AT/Module-6/style.css b/PREWORK_AT/Module-6/style.css
@@ -0,0 +1,10 @@
+body {
+    background-color: rgb(235, 229, 229);
+}
+
+#box {
+    height: 150px;
+    width: 150px;
+    background-color: orange;
+    margin: 25px
+}
diff --git a/PREWORK_AT/Module-7/ScratchActivity/A Game of Cat and Mouse.rtf b/PREWORK_AT/Module-7/ScratchActivity/A Game of Cat and Mouse.rtf
@@ -0,0 +1,8 @@
+{\rtf1\ansi\ansicpg1252\cocoartf2580
+\cocoatextscaling0\cocoaplatform0{\fonttbl\f0\fswiss\fcharset0 Helvetica;}
+{\colortbl;\red255\green255\blue255;}
+{\*\expandedcolortbl;;}
+\margl1440\margr1440\vieww11520\viewh8400\viewkind0
+\pard\tx720\tx1440\tx2160\tx2880\tx3600\tx4320\tx5040\tx5760\tx6480\tx7200\tx7920\tx8640\pardirnatural\partightenfactor0
+
+\f0\fs24 \cf0 https://scratch.mit.edu/projects/534898435}