mccoyweb.github.io/index.html at master · mccoyweb/mccoyweb.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Erik McCoy | Front-End Developer</title>
  <link rel="icon" href="images/favicon.png">
  <link rel="stylesheet" href="CSS/style.css">
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
  <main>
    <section id="hero">
      <div class="container row">
        <img src="images/profile.jpg" alt="" class="profile-img slide-right">
        <div class="profile-text slide-left">
          <h1>Hi, I'm <span class="intro-em">Erik McCoy</span></h1>
          <p>I'm a <span class="intro-em">web developer</span> from New Hampshire now based in <span class="intro-em">Boston, MA</span>. My focus is responsive and accessible front end development.</p>
          <p>You can check out some of my projects below. If you have any questions or are interested in working together, feel free to get in touch.</p>
          <a class="btn btn-dark" target="_blank" rel="noopener noreferrer" href="https://drive.google.com/file/d/1_xcdkjF39i4lXIeoBN-drcQUla8C-Pf1/view?usp=sharing">Resume</a>
        </div>
      </div>
    </section>
    <section class="projects">
      <div class="container">
        <h2>Projects</h2>
        <div class="project row">
          <div class="project-text">
            <h3>Fabulous School of Music</h3>
            <div>
              <p>Website for a music school made with a custom Wordpress theme.</p>
              <p class="tech">Technologies used: Wordpress, PHP, CSS, Html</p>
            </div>
            <a class="btn btn-light" target="_blank" rel="noopener noreferrer" href="https://fabulousmusicschool.com/">See Live</a>
          </div>
          <a class="project-link" target="_blank" rel="noopener noreferrer" href="https://fabulousmusicschool.com/">
            <img src="images/fab-school.jpg" alt="Fabulous School of Music" class="project-img">
          </a>
        </div>
        <div class="project row">
            <div class="project-text">
              <h3>Light and Dark Mode Homepage</h3>
              <div>
                <p>A homepage with a light and dark mode toggle.</p>
                <p class="tech">Technologies used: Html, CSS, JavaScript</p>
              </div>
              <a class="btn btn-light" target="_blank" rel="noopener noreferrer" href="https://mccoyweb.github.io/light-and-dark-homepage/">See Live</a>
              <span class="source-link"><a target="_blank" rel="noopener noreferrer" href="https://github.com/mccoyweb/light-and-dark-homepage">Source Code</a></span>
            </div>
            <a class="project-link" target="_blank" rel="noopener noreferrer" href="https://mccoyweb.github.io/light-and-dark-homepage/">
              <img src="images/light-dark.jpg" alt="Light and Dark Mode Homepage" class="project-img">
            </a>
        </div>
        <div class="project row">
          <div class="project-text">
            <h3>Weather App</h3>
            <div>
              <p>A weather forecast site using the OpenWeather API.</p>
              <p class="tech">Technologies used: React, API, CSS Flexbox</p>
            </div>
            <a class="btn btn-light" target="_blank" rel="noopener noreferrer" href="https://mccoyweb.github.io/weather-app/">See Live</a>
            <span class="source-link"><a target="_blank" rel="noopener noreferrer" href="https://github.com/mccoyweb/weather-app">Source Code</a></span>
          </div>
          <a class="project-link" target="_blank" rel="noopener noreferrer" href="https://mccoyweb.github.io/weather-app/">
            <img src="images/weather-app.jpg" alt="Weather App" class="project-img">
          </a>
        </div>
        <!--<div class="project row">
          <div class="project-text">
            <h3>Memory Game</h3>
            <div>
              <p>A classic memory game built with React.</p>
              <p class="tech">Technologies used: React, CSS, Html</p>
            </div>
            <a class="btn btn-light" target="_blank" rel="noopener noreferrer" href="https://mccoyweb.github.io/mem-murray/">See Live</a>
            <span class="source-link"><a target="_blank" rel="noopener noreferrer" href="https://github.com/mccoyweb/mem-murray">Source Code</a></span>
          </div>
          <a class="project-link" target="_blank" rel="noopener noreferrer" href="https://mccoyweb.github.io/mem-murray/">
            <img src="images/mem-murray.jpg" alt="Memory Game" class="project-img">
          </a>
        </div> -->
        <div class="project row">
          <div class="project-text">
            <h3>Simon Game</h3>
            <div>
              <p>A browser based version of the classic 80s electronic game, with accurate sounds and timing.</p>
              <p class="tech">Technologies used: jQuery, CSS, Html</p>
            </div>
            <a class="btn btn-light" target="_blank" rel="noopener noreferrer" href="https://codepen.io/emccoy/full/vGKJRV">See Live</a>
            <span class="source-link"><a target="_blank" rel="noopener noreferrer" href="https://codepen.io/emccoy/pen/vGKJRV">Source Code</a></span>
          </div>
          <a class="project-link" target="_blank" rel="noopener noreferrer" href="https://codepen.io/emccoy/full/vGKJRV">
            <img src="images/simon.jpg" alt="Simon Game" class="project-img">
          </a>
        </div>
      </div>
    </section>
    <section class="contact">
      <div class="container contact-container">
        <h2>Contact</h2>
        <p>Would you like to work with me? Awesome!</p>
        <a class="btn btn-dark" target="_blank" rel="noopener noreferrer" href="mailto:erikmccoy@gmail.com">Let's Talk</a>
      </div>
    </section>
  </main>
  <footer>
    <div class="container footer-container">
      <a href="#hero"><i class="fa fa-angle-up fa-2x fa-inverse to-top" aria-hidden="true"></i></a>
      <div class="social">
        <a href="https://codepen.io/emccoy" rel="noopener noreferrer" target="_blank" aria-label="codepen"><i class="fa fa-codepen fa-inverse"></i></a>
        <a href="https://www.linkedin.com/in/erik-mccoy-964aa769" rel="noopener noreferrer" target="_blank" aria-label="linkedin"><i class="fa fa-linkedin fa-inverse"></i></a>
        <a href="https://github.com/mccoyweb" rel="noopener noreferrer" target="_blank" aria-label="github"><i class="fa fa-github fa-inverse"></i></a>
        <a href="https://www.freecodecamp.org/mccoyweb" rel="noopener noreferrer" target="_blank" aria-label="free-code-camp"><i class="fa fa-free-code-camp fa-inverse"></i></a>
      </div>
      <hr>
      <p>© 2022 - Erik McCoy</p>
    </div>
  </footer>
</body>
</html>