-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
132 lines (124 loc) · 6.04 KB
/
index.html
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
125
126
127
128
129
130
131
132
<!DOCTYPE HTML>
<html>
<head>
<title>Madeline LeClair</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="assets/css/reset.css" />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/konpa/devicon/df6431e323547add1b4cf45992913f15286456d3/devicon.min.css">
<link rel="icon" type="image/png" sizes="32x32" href="./images/favicon-32x32.png">
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-100749598-2', 'auto');
ga('send', 'pageview');
</script>
</head>
<body>
<nav>
<div class="container">
<h4>MADELINE LECLAIR</h4>
</div>
</nav>
<!-- Header -->
<section class="hero">
<div>
<div class="icon fa-laptop"></div>
<h1>Software Engineer</h1>
<h3>Tackling challenging problems and building cool things</h3>
</div>
</section>
<!-- About -->
<section class="about">
<div class="container" />
<div class="main-contents">
<div class="left-side">
<header>
<h2>About</h2>
</header>
<p>
Officially, I'm a software engineer in NYC that builds and mantains web applications. However, what I actually do is put out fires, make cool things, improve the knowledge of current and future developers, and provide a great experience to users. Programming appeals to me because I can take an abstract idea and turn it into a product that other people can use, and everyday has the possiblity of bring on new challenges.
<br></br>
Outside of work, you can find me making delicious and unique dishes. My favorite things to cook include liquid nitrogen ice cream, duck prosciutto, butterbeer, and homemade tofu. Like programming, I like the challenge and creativity that cooking allows. I also have a variety of <a href="#projects">programming projects</a> that I work on to play around with new technologies and APIs.
</p>
</div>
<div class="right-side">
<div class="image"><img src="images/madeline_leclair.jpg" alt="" /></div>
<div class="section-one-links">
<div><a href="mailto:[email protected]" class="icon fa-envelope"> [email protected]</a></div>
<div><a href="https://github.com/madelineleclair" class="icon fa-github"> /madelineleclair</a></div>
<div><a href="https://angel.co/madeline-leclair" class="icon fa-angellist"> /madeline-leclair</a></div>
<div><a href="https://www.linkedin.com/in/madelineleclair/" class="icon fa-linkedin"> /madelineleclair</a></div>
</div>
</div>
</div>
</div>
</section>
<!-- Skills -->
<section class="skills">
<div class="container">
<div class="main-contents">
<header>
<h2>Skills</h2>
</header>
<ul class="skills-icons">
<li><span class="devicon-ruby-plain-wordmark colored"></span></li>
<li><span class="devicon-rails-plain-wordmark colored"></span></li>
<li><span class="devicon-javascript-plain colored"></span></li>
<li><span class="devicon-react-original-wordmark colored"></span></li>
<li><span class="devicon-jquery-plain-wordmark colored"></span></li>
<li><span class="devicon-postgresql-plain-wordmark colored"></span></li>
<li><span class="devicon-mongodb-plain-wordmark colored"></span></li>
<li><span class="devicon-html5-plain-wordmark colored"></span></li>
<li><span class="devicon-amazonwebservices-plain-wordmark colored"></span></li>
<li><span class="devicon-redis-plain-wordmark colored"></span></li>
<li><span class="devicon-nodejs-plain colored"></span></li>
<li><span class="devicon-express-original-wordmark"></span></li>
<li><span class="devicon-heroku-plain-wordmark colored"></span></li>
</ul>
</div>
</div>
</section>
<!-- Projects -->
<section id="projects" class="projects">
<div class="container">
<div class="main-contents">
<header>
<h2>Projects</h2>
</header>
<ul class="projects-container">
<li class="project">
<a href="https://www.pettime.us"><img src="images/pet-time.png" alt="" /></a>
<div class="text">
<h3>Pet Time</h3>
<p>Pet Time is application I creating to bring people joy through cute animals. Each day, users receive a new curated animal image and quote via text message. The application is built using Node.js, Express, MongoDB, Twilio, React, and Stripe.</p>
<a href="https://www.pettime.us">More</a>
</div>
</li>
<li class="project">
<a href="http://www.programming101.us"><img src="images/programming-101.png" alt="" /></a>
<div class="text">
<h3>Programming 101</h3>
<p>Programming 101 is an online school that I created to teach new programmers to code. The first course in the school is called Coding Bootcamp Prep. The course contains 6+ hours of video content and 100+ lectures on JavaScript to help students get admitted to the bootcamp of their choice.</p>
<a href="https://www.programming101.us">More</a>
</div>
</li>
</ul>
</div>
</div>
</section>
<!-- Footer -->
<footer>
<ul class="icons">
<li><a href="mailto:[email protected]" class="icon fa-envelope"></a></li>
<li><a href="https://github.com/madelineleclair" class="icon fa-github"></a></li>
<li><a href="https://angel.co/madeline-leclair" class="icon fa-angellist"></a></li>
<li><a href="https://www.linkedin.com/in/madelineleclair/" class="icon fa-linkedin"></a></li>
</ul>
</footer>
</body>
</html>