hack4impact-calpoly · Bolt259 · Nov 5, 2023 · Nov 5, 2023 · Dec 21, 2023 · Dec 21, 2023
diff --git a/README.md → Website1/README.md b/README.md → Website1/README.md
@@ -1,25 +1,25 @@
-# Developer Bootcamp 2023
-
-This is how we will be tracking your milestones throughout bootcamp! By the end of bootcamp, you will have a fullstack personal portfolio website.
-
----
-
-## Setup:
-
-0. Click on the fork button on the top right and create a fork
-1. Click on the green <> Code button above the file list.
-2. Go to the "Local" tab
-3. Copy the HTTPS link
-4. Go to VS Code and do Ctrl/Cmd + Shift + P
-5. Search for the "Git: Clone" action and select
-6. Paste in the repo link and clone
-
-## Creating a PR:
-
-1. Push all changes to your remote fork
-2. Go to the "Pull requests" tab in your GitHub repo
-3. Create a pull request with your changes
-   a. Double check the base is the main bootcamp repo!
-4. Fill out the PR template description!!!
-5. Assign the engineering team as code reviewers
-6. Link the milestone issue to the PR
+# Developer Bootcamp 2023
+
+This is how we will be tracking your milestones throughout bootcamp! By the end of bootcamp, you will have a fullstack personal portfolio website.
+
+---
+
+## Setup:
+
+0. Click on the fork button on the top right and create a fork
+1. Click on the green <> Code button above the file list.
+2. Go to the "Local" tab
+3. Copy the HTTPS link
+4. Go to VS Code and do Ctrl/Cmd + Shift + P
+5. Search for the "Git: Clone" action and select
+6. Paste in the repo link and clone
+
+## Creating a PR:
+
+1. Push all changes to your remote fork
+2. Go to the "Pull requests" tab in your GitHub repo
+3. Create a pull request with your changes
+   a. Double check the base is the main bootcamp repo!
+4. Fill out the PR template description!!!
+5. Assign the engineering team as code reviewers
+6. Link the milestone issue to the PR
diff --git a/Website1/blog.html b/Website1/blog.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <title>LKS Blog</title>
+    <link rel="stylesheet" href="styles.css" />
+</head>
+<body>
+  <nav class="navbar">
+      <h1 class="logo"><a href="index.html">*/LKSHPLY/*</a></h1>
+      <ul class="nav-list">
+        <li><a href="index.html">Home</a></li>
+        <li><a href="blog.html">Blog</a></li>
+        <li><a href="portfolio.html">Portfolio</a></li>
+        <li><a href="resume.html">Resume</a></li>
+        <li><a href="contact.html">Contact</a></li>
+      </ul>
+  </nav>
+  <div class="blog-container">
+    <main>
+      <h1 class="page-title">Blog</h1>
+      life in slo
+      <div id="blog-div"></div>
+      <script src="src\blog.js"></script>
+    </main>
+    <footer class="footer">© 2023 LKSHPLY | All Rights Reserved</footer>
+  </div>
+</body>
+</html>
diff --git a/Website1/contact.html b/Website1/contact.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <title>Contact Info</title>
+        <link rel="stylesheet" href="styles.css" />
+    </head>
+  <body>
+    <nav class="navbar">
+        <h1 class="logo"><a href="index.html">*/LKSHPLY/*</a></h1>
+
+        <ul class="nav-list">
+          <li><a href="index.html">Home</a></li>
+          <li><a href="blog.html">Blog</a></li>
+          <li><a href="portfolio.html">Portfolio</a></li>
+          <li><a href="resume.html">Resume</a></li>
+          <li><a href="contact.html">Contact</a></li>
+        </ul>
+    </nav>
+        <main>
+            <p>Contact Form</p>
+            <form id="contact-form">
+              <!--comment-->
+              <label for="name">Name:</label>
+              <input type="text" id="name" name="name" placeholder="Name" required />
+              <br><br>
+              <!--The "for" attribute references the "name" attribute in <input>.
+              The "name" attribute is necessary once we start tying in JavaScript-->
+              <label for="email">Email:</label>
+              <input type="email" id="email" name="email" placeholder="Email" required />
+              <br><br>
+              <label for="comments">Message:</label>
+              <textarea
+                id="Type here.."
+                name="Type here.."
+                placeholder="Type here.."
+                required
+              ></textarea>
+              <br><br>
+              <input type="submit" value="Submit" />
+
+
+        <h1 class="page-title">Contact Info</h1>
+        Lukas Shipley
+        [email protected]
+        (530)-515-5924
+    </main>
+    <footer class="footer">© 2023 LKSHPLY | All Rights Reserved</footer>
+  </body>
+</html>
diff --git a/Website1/index.html b/Website1/index.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <title>LKSHPLY</title>
+        <link rel="stylesheet" href="styles.css" />
+    </head>
+  <body>
+    <nav class="navbar">
+        <h1 class="logo"><a href="index.html">*/LKSHPLY/*</a></h1>
+        <ul class="nav-list">
+          <li><a href="index.html">Home</a></li>
+          <li><a href="blog.html">Blog</a></li>
+          <li><a href="portfolio.html">Portfolio</a></li>
+          <li><a href="resume.html">Resume</a></li>
+          <li><a href="contact.html">Contact</a></li>
+        </ul>
+    </nav>
+        <main>
+            <h1 class="page-title">Allow Me To Reintroduce Myself.</h1>
+            <div class="about-image">
+                <img src="utahme.jpg" width="350" height="300" alt="me in utah">
+            </div>
+            <div class="about">
+                <div class="about-image"></div>
+                <div class="about-text">
+            <p>I am Lukas Shipley a 20-year-old Computer Engineering major from the countryside of far north California who loves to push the boundaries of technology and exploring nature in all its forms. I have a zest for life that takes me far beyond the confines of a computer screen.
+                As a student in the fascinating world of Computer Engineering, I spends countless hours delving into the complexities of systems, programming languages, and cutting-edge technologies. My curiosity knows no bounds, and I am always eager to explore the next frontier of <strong>innovation</strong>.
+                But what truly sets me apart is my <em>balanced</em> approach to the tech world. I have a <strong>deep passion</strong> for sports and adventure. When I'm not immersed in lines of code, you can find me on the tennis court, the soccer pitch, riding waves while surfing, or conquering new heights through hiking and rock climbing.
+                I am a technologist who embraces the outdoors and values physical well-being and a balanced life style. I believe we should emulate <em>nature</em> when designing new technologies and systems. My path is just starting, and I hope we will be able to work ours together to create something <strong>remarkable</strong>.</p>
+            </div>
+        </div>
+    </main>
+    <footer class="footer">© 2023 LKSHPLY | All Rights Reserved</footer>
+</body>
+</html>
diff --git a/Website1/portfolio.html b/Website1/portfolio.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <title>Portfolio</title>
+        <link rel="stylesheet" href="styles.css" />
+    </head>
+  <body>
+    <nav class="navbar">
+        <h1 class="logo"><a href="index.html">*/LKSHPLY/*</a></h1>
+        <ul class="nav-list">
+          <li><a href="index.html">Home</a></li>
+          <li><a href="blog.html">Blog</a></li>
+          <li><a href="portfolio.html">Portfolio</a></li>
+          <li><a href="resume.html">Resume</a></li>
+          <li><a href="contact.html">Contact</a></li>
+        </ul>
+    </nav>
+    <main>
+        <h1 class="page-title">Portfolio</h1>
+        <h2 class="description">Previously:</h2>
+        <div class="project">
+            <a href="index.html">
+                <img src="simpleHTMLwebsite.png" width="600" height="300" alt="me in utah">
+            </a>
+        </div>
+        <div class="prohect-details">
+            <p class="project-name">
+                Simple HTML Website branded LKSHPLY
+            </p>
+            <p class="project-description">
+                Created a simple navigatable website in HTML
+                <br><br>
+                <a href="index.html">
+                    Learn More..
+                </a>
+            </p>
+        </div>
+        <h2>Projects</h2>
+      <ul>
+        <li>Coming Soon!</li>
+      </ul>
+    </main>
+    <footer class="footer">© 2023 LKSHPLY | All Rights Reserved</footer>
+  </body>
+</html>
diff --git a/Website1/resume.html b/Website1/resume.html
@@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <title>Résumé</title>
+        <link rel="stylesheet" href="styles.css" />
+    </head>
+    <body>
+    <nav class="navbar">
+        <h1 class="logo"><a href="index.html">*/LKSHPLY/*</a></h1>
+        <ul class="nav-list">
+            <li><a href="index.html">Home</a></li>
+            <li><a href="blog.html">Blog</a></li>
+            <li><a href="portfolio.html">Portfolio</a></li>
+            <li><a href="resume.html">Resume</a></li>
+            <li><a href="contact.html">Contact</a></li>
+        </ul>
+    </nav>
+    <main>
+        <h1 class="page-title">Résumé</h1>
+        <a href="resume.pdf" download >Download Résumé</a>
+        <div class="resume"><section class="section"></section>
+            <section class="section"><h2 class="Education">Education</h2></section>
+            <div class="calpoly">
+                <h3 class="calpoly">California Polytechnic State University, San Luis Obispo</h3>
+                <p class="calpoly-info"><em><strong>Bachelor of Science in Computer Engineering</strong></em></p>
+            </div>
+            <section class="section"><h2 class="Coursework">Coursework</h2></section>
+                <ul class="course-list">
+                    <li>Fundamentals of Computer Science (CSC 101)</li>
+                    <li>Data Structures (CSC 202)</li>
+                    <li>Project-Based Object-Oriented Programming & Design (CSC 203)</li>
+                    <li>Systems Programming (CSC 357)</li>
+                    <li>Digital Design (CPE 133)</li>
+                    <li>Computer Design and Assembly Language Programming (CPE 233)</li>
+                    <li>Electric Circuit Analysis I and II w Lab (EE 133 & 143, EE 211 & 241)</li>
+                    <li>A+ Certification Prep/ Cisco IT Essentials</li>
+                </ul>
+
+            <section class="section"><h2 class="Experience">Experience</h2></section>
+
+            <div class="pc-building-business">
+                <h3 class="pc-business">PC Building Business</h3>
+                <p class="pc-description"><em>SUMMER 2021-PRESENT</em></p>
+                <p class="pc-info">
+                    + Assisted clients in determining budget and requirements for their PC
+                    <br><br>
+                    + Compiled a tailored parts list and assembled all components
+                    <br><br>
+                    + Provided post-build troubleshooting support
+                </p>
+            </div>
+
+            <div class="concept-character-design">
+                <h3 class="concept-character-design">Concept & Character Design</h3>
+                <p class="concept-character-description"><em>2015-PRESENT</em></p>
+                <p class="concept-character-info">
+                    + Documented system and computer designs
+                    <br><br>
+                    + Developed a catalog of characters and storylines for future production
+                    <br><br>
+                    + Illustrated concept designs in Fresco
+                </p>
+            </div>
+
+            <section class="section"><h2 class="Skills">Skills</h2></section>
+                <ul class="skill-list">
+                    <li>Python</li>
+                    <li>Java</li>
+                    <li>C</li>
+                    <li>RISC-V Assembly</li>
+                    <li>System Verilog</li>
+                    <li>Group Management</li>
+                    <li>Team Collaboration</li>
+                    <li>Supervising Activities</li>
+                    <li>Budget Management</li>
+                    <li>Research & Design</li>
+                </ul>
+            <section class="section"><h2 class="Projects">Projects</h2></section>
+            <div class="system-designs">
+                <h3 class="system-designs">System Designs in C & Python</h3>
+                <p class="system-designs-description">+ Built frameworks for data management and organization in <em>both</em> Python and C to figure out how both languages worked better</p>
+                <p class="system-designs-info"></p>
+            </div>
+        </div>
+    </main>
+    <footer class="footer">© 2023 LKSHPLY | All Rights Reserved</footer>
+    </body>
+</html>
diff --git a/Website1/resume.pdf b/Website1/resume.pdf
diff --git a/Website1/simpleHTMLwebsite.png b/Website1/simpleHTMLwebsite.png
diff --git a/Website1/src/blog.js b/Website1/src/blog.js
@@ -0,0 +1,50 @@
+var blogs = [
+    {
+        title: "Personal",
+        date: "11/2/2023",
+        description: "Life & sports",
+        slug: "blog-personal",
+    },
+    {
+        title: "Career",
+        date: "11/2/2023",
+        description: "Ventures & projects",
+        slug: "blog-career",
+    },
+    {
+        title: "Exploration",
+        date: "11/2/2023",
+        description: "Nature & hiking",
+        slug: "blog-exploration",
+    },
+    {
+        title: "Tech",
+        date: "11/2/2023",
+        description: "Interests & cutting edge",
+        slug: "blog-tech",
+    },
+];
+function displayBlogPreview() {
+    // Sort the blog previews by date
+    blogs.sort(function (a, b) {
+        return new Date(b.date).getTime() - new Date(a.date).getTime();
+    });
+    // Get the blog list element from the HTML
+    var blogList = document.getElementById("blog-div");
+    // Create a preview for each blog post and append it to the blog list element
+    blogs.forEach(function (_a) {
+        var slug = _a.slug, title = _a.title, date = _a.date, description = _a.description;
+        var link = document.createElement("a");
+        link.href = "blog/".concat(slug, ".html");
+        link.innerHTML = "Read More";
+        var postPreview = document.createElement("div");
+        postPreview.classList.add("post-preview");
+        postPreview.innerHTML = "\n            <h2 class=\"post-title\">".concat(title, "</h2>\n            <h3 class=\"post-subtitle\">").concat(date, "</h3>\n            <p class=\"post-description\">").concat(description, "</p>\n        ");
+        postPreview.appendChild(link);
+        if (blogList) {
+            blogList.appendChild(postPreview);
+        }
+    });
+}
+// Call the displayBlogPreview function to display the blog previews in the HTML
+displayBlogPreview();