matthew-israelson.github.io/index.html at master · misraelson/matthew-israelson.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
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600" rel="stylesheet">
    <link rel="stylesheet" href="css/style.css">
    <link rel="shortcut icon" type="image/png" href="img/favicon.png">

    <title>Resume Matthew Israelson</title>
  </head>
  <body>
    <!-- NAVIGTION BURGER -->
    <div class="navigation">
      <!-- hidden checkbox -->
      <input type="checkbox" class="navigation__checkbox" id="navi-toggle">
      <label for="navi-toggle" class="navigation__button">
        <span class="navigation__icon">&nbsp;</span>
      </label>
      <div class="navigation__background">&nbsp;</div>
      <!-- HUGE ELEMENT OCCUPYING ENTIRE VIEWPORT -->
      <nav class="navigation__nav">
        <div class="navigation__header">
          <h1>Contact Info <br> + <br> Social Links</h1>
        </div>
        <ul class="navigation__list">
          <li class="navigation__item"><a href="mailto: misraelson@gmail.com" target="_blank" class="navigation__link">01. Email</a></li>
          <li class="navigation__item"><a href="https://linkedin.com/in/matthew-israelson" target="_blank" class="navigation__link">02. LinkedIn</a></li>
          <li class="navigation__item"><a href="https://github.com/misraelson" target="_blank" class="navigation__link">03. Github</a></li>
          <!-- <li class="navigation__item"><a href="#" class="navigation__link">04. Blog</a></li> -->
        </ul>
      </nav>
    </div>

    <!-- MAIN SECTION -->
    <div class="container">
      <div class="header">
        <div class="header__sub">Hey, I'm</div>
        <div class="header__name">Matthew Israelson</div>
      </div>
      <div class="circle-cutout">
        <div class="circle-cutout__photo">
          <!-- <img src="" alt="Profile Image" class="circle-cutout__photo--image"> -->
          <div class="circle-cutout__photo--image"></div>
        </div>
      </div>

      <section class="main">
        <!-- TECHNICAL SKILLS -->
        <h1>TECHNICAL SKILLS</h1>
        <div class="hover">&darr; Hover Over The Cards &darr;</div>
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--11"></div>
            <div class="card__heading">
              Web Technologies + Frameworks
              <h2>Full-Stack Development + Deployment</h2>
              <div class="card__logo card__logo--box">
                <div class="card__logo card__logo--img card__logo--11"></div>
                <div class="card__logo card__logo--img card__logo--12"></div>
                <div class="card__logo card__logo--img card__logo--13"></div>
                <div class="card__logo card__logo--img card__logo--14"></div>
              </div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__skills">
              <ul>
                <li>HTML5, CSS3</li>
                <li>JavaScript</li>
                <li>Ruby on Rails / API Architecture</li>
                <li>React JS</li>
                <li>Redux</li>
                <li>React Native</li>
              </ul>
              <ul>
                <li>PostgreSQL with ActiveRecord</li>
                <li>Sidekiq + Redis with ActiveJob</li>
                <li>RSPEC + Cucumber Integration Testing</li>
                <li>AWS CLI, EC2 + Deployment on AWS</li>
                <li>Heroku CLI + Deployment</li>
              </ul>
            </div>
          </div>
        </div>
        <!-- PROFESSIONAL EXPERIENCE -->
        <h1>Professional Experience</h1>
        <!-- JOIST -->
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--joist"></div>
            <div class="card__heading">
              Joist
              <h2>Full Stack Developer</h2>
              <div class="card__logo card__logo--joist"></div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__details">
              <h2>Contributions</h2>
              <ul>
                <li>Migrated key component of legacy Ember application to React microservice front-end with modern Redux</li>
                <li>Improved Rails monolith gateway service and several microservice API’s</li>
                <li>Built responsive design system during migration of the homeowner document preview from static pdf to dynamic HTML.</li>
                <li>Automated a much requested feature of undeleting select user data.</li>
              </ul>
              <span>
                Website: &nbsp;
                <a href="https://www.joist.com/">Joist</a>
              </span>
            </div>
          </div>
        </div>
        <!-- COMMUNITY GARDEN BUILDERS -->
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--cgb"></div>
            <div class="card__heading">
              Community Garden Builders
              <h2>Full Stack Developer</h2>
              <div class="card__logo card__logo--cgb"></div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__details">
              <h2>Contributions</h2>
              <ul>
                <li>Collaborated closely with the business owner, UX/UI designers and market researchers to build high quality software that solved mission critical community garden sign-up and management problems</li>
                <li>Followed best practices in software development such as two-week SCRUM sprints, TDD for our backend API, continuous integration and deployment on Heroku</li>
                <li>Thoughtfully translated design wireframes to fully interactive front-end code using React with the new hooks API</li>
                <li>Prioritized responsive first design principles to build for a variety of screen sizes from mobile to tablet to large desktops.</li>
              </ul>
              <span>
                Website: &nbsp;
                <a href="https://www.communitygardenapp.com/">Community Garden Builders</a>
              </span>
            </div>
          </div>
        </div>
        <!-- WOODSEER -->
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--1"></div>
            <div class="card__heading">
              Woodseer Dividend Forecasting
              <h2>Ruby on Rails Developer</h2>
              <div class="card__logo card__logo--1"></div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__details">
              <h2>Contributions</h2>
              <ul>
                <li>Built out new design specs for client-facing landing page that could display live data pulled from Rails backend.</li>
                <li>Expanded test coverage for main dividend forecasting algorithm in RSPEC</li>
                <li>Wrote integration tests for admin functionality within main Woodseer dash via Cucumber and RSPEC</li>
                <li>Designed and implemented front-end code for a daily accuracy score badge displayed in the 'live-data' section</li>
                <li>Implemented mobile optimization using SCSS media queries</li>
              </ul>
              <span>
                Website: &nbsp;
                <a href="http://woodseer.com">Woodseer Global</a>
              </span>
            </div>
          </div>
        </div>
        <!-- CODECORE BOOTCAMP -->
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--2"></div>
            <div class="card__heading">
              CodeCore Developer Bootcamp
              <h2>Teachers Assistant</h2>
              <div class="card__logo card__logo--2"></div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__details">
              <h2>Contributions</h2>
              <ul>
                <li>Expand students knowledge of JavaScript, React, Rails, NodeJS and SQL</li>
                <li>Guide students through coding challenges and homework assignments</li>
                <li>Help with project scope and project planning for graduation projects</li>
                <li>Mark and give feedback on homework assignments</li>
                <li>Lead career development workshops to hone resumes, cover letters and interview prep</li>
              </ul>
              <span>
                Website: &nbsp;
                <a href="http://codecore.ca">CodeCore Developer Bootcamp</a>
              </span>
            </div>
          </div>
        </div>
        <!-- REDLINE MEDIA -->
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--3"></div>
            <div class="card__heading">
              Red Line Media
              <h2>PHP Customization</h2>
              <div class="card__logo card__logo--3"></div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__details">
              <h2>Contributions</h2>
              <ul>
                <li>Complete overhaul and redesign of old (circa 2007) era company site</li>
                <li>Mobile-ready, full-size auto-play video background on splash landing section</li>
                <li>Installed and implemented new Wordpress theme</li>
                <li>Customized logo asset colors and animation effects</li>
                <li>Wrote pure HTML + CSS to link to boutique contact form</li>
              </ul>
              <span>
                Website: &nbsp;
                <a href="http://redlinemedialive.com">Red Line Media</a>
              </span>
            </div>
          </div>
        </div>
        <!-- BUCHA BREW -->
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--4"></div>
            <div class="card__heading">
              Bucha Brew Kombucha
              <h2>Shopify Store Developer</h2>
              <div class="card__logo card__logo--4"></div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__details">
              <h2>Contributions</h2>
              <ul>
                <li>Full-stack shopify design and development</li>
            <li>Wrote Liquid code to create an order form for wholesale and retail clients</li>
            <li>Implemented a customer tagging system to enable tiered pricing for different customer types</li>
              </ul>
              <span>
                Website: &nbsp;
                <a href="https://www.buchabrew.ca/">Bucha Brew Kombucha</a>
              </span>
            </div>
          </div>
        </div>

        <h1>My previous work experience</h1>
        <!-- RISE KOMBUCHA -->
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--5"></div>
            <div class="card__heading">
              Rise Kombucha
              <h2>Microbiology and Quality Assurance</h2>
              <div class="card__logo card__logo--5"></div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__details">
              <h2>Contributions</h2>
              <ul>
                <li>Responisble for data entry and tracking of key metrics related to Kombucha microbial health and wellness</li>
                <li>Oversaw 3x growth in production capacity as we moved to a new production facility</li>
                <li>Collaborated with key members of management and quality team to scale and transfer process to new equipment stack</li>
              </ul>
              <span>
                Website: &nbsp;
                <a href="http://risekombucha.com">Rise Kombucha</a>
              </span>
            </div>
          </div>
        </div>
        <!-- QSV BIOLOGICS -->
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--6"></div>
            <div class="card__heading">
              QSV Biologics
              <h2>Microbiologist and Manufacturing Technician</h2>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__details">
              <h2>Contributions</h2>
              <ul>
                <li>Oversaw process of purification of pharmaceutical product intended for Stage 3 (human) clinical trials</li>
                <li>Responisble for training new employees on homogenization process + proper machine maintenance</li>
              </ul>
            </div>
          </div>
        </div>

        <h1>These are some of my personal passion projects...</h1>
        <!-- SHMOOVER -->
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--7"></div>
            <div class="card__heading">
              Shmoover
              <h2>Ruby on Rails, OAUTH, GMAPS API, AWS, Stripe</h2>
              <div class="card__logo card__logo--7"></div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__details">
              <h2>Uber style hailing app connecting you with a 'micro-mover' in your area </h2>
              <ul>
                <li>Integrated Stripe API for secure payments with 'managed accounts' to allow for a frictionless transfer of funds to Shmoover' accounts</li>
                <li>Single table inheritance to rollify User model with polymorphic associations between Shmoovers, Shmoovees and Helpers</li>
                <li>OAuth with Facebook for easy account creation</li>
                <li>Utilized Google Maps API with the Geocoder Gem for geolocation and routing of jobs for movers</li>
                <li>Deployed via AWS Elactic Beanstalk with EC2 server suite + secured with SSL certificate</li>
              </ul>
              <span>
                Website: &nbsp;
                <a href="https://shmoover.com">Shmoover</a>
              </span>
            </div>
          </div>
        </div>
      <!-- JUST BREATHING -->
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--8"></div>
            <div class="card__heading">
              Just Breathing
              <h2>React Native + Expo</h2>
              <div class="card__logo card__logo--8"></div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__details">
              <h2>A mobile application to guide you into deeper, calmer breath</h2>
              <ul>
                <li>React implementation of Start-Stop-Pause buttons and state, a session timer that counts up and can be paused, and stateful components to track if cycle is on the inhale or exhale breath</li>
                <li>Utlization of Expo's built in animation library for smooth easing transitions between in-breath/out-breath in the breath ball component</li>
                <li>Custom sound design and use of Expo Sound API to play different lengths of sound clips in response to duration of breaths per minute the user selects</li>
              </ul>
              <span>
                <!-- Website: &nbsp; -->
                <!-- <a href="http://justbreathing.com">Download on the App Store!</a> -->
              </span>
            </div>
          </div>
        </div>
        <!-- STREAKERS -->
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--9"></div>
            <div class="card__heading">
              Streakers
              <h2>React + Chart.js + Ruby on Rails API + Redis/Sidekiq + Heroku</h2>
              <div class="card__logo card__logo--9"></div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__details">
              <h2>Activity tracker with animated charts and automatic streak updates</h2>
              <ul>
                <li>Used AXIOS library to send requests to Rails API backend</li>
                <li>Tested API request/response routes with Postman</li>
                <li>Integrated react immutability helper for clean state updates</li>
                <li>Added Chart.js and randomColor.js for animated, eye-popping user data display charts</li>
                <li>Customized CRON jobs with Redis and Sidekiq for updating streak objects in the background every 24 hours</li>
                <li>Deployed via Heroku with React project submoduled inside Rails application structure</li>
              </ul>
              <span>
                Website: &nbsp;
                <a href="https://streakers.herokuapp.com/">Streakers</a>
              </span>
            </div>
          </div>
        </div>
        <!-- ACADEMICS -->
        <h1>This is where I studied coding and earned my degree</h1>
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--10"></div>
            <div class="card__heading">
              Degrees and Certificates
              <h2>University of Alberta</h2>
              <h2>CodeCore Bootcamp</h2>
              <h2>Udemy</h2>
              <div class="card__logo card__logo--10"></div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__skills">
              <h3>University of Alberta <br> 2008</h3>
              <h4>Bachelor of Science</h4>
              <h3>CodeCore Bootcamp <br> 2016</h3>
              <h4>Full-stack Web Development Certificate</h4>
              <h3>Udemy <br> 2018</h3>
              <h4>Dissecting Ruby on Rails 5 Certificate of Completion</h4>
              <h3>Udemy <br> 2019</h3>
              <h4>Advanced Front-End Design CSS + SASS Certificate of Completion</h4>
              <h3>Udemy  <br> 2019 - In Progress</h3>
              <h4>Complete React Developer Course</h4>
            </div>
          </div>
        </div>

        <!-- VOLUNTEER -->
        <h1>Volunteer and Hobbies</h1>
        <div class="card">
          <div class="card__side card__side--front">
            <div class="card__picture card__picture--12"></div>
            <div class="card__heading">
              Community Organizations
              <h2>Activities</h2>
              <div class="card__logo card__logo--box">
                <div class="card__logo card__logo--img card__logo--16"></div>
                <div class="card__logo card__logo--img card__logo--17"></div>
                <div class="card__logo card__logo--img card__logo--15"></div>
              </div>
            </div>
          </div>
          <div class="card__side card__side--back">
            <div class="card__skills">
              <h3>Mercy Ships Medical Aid <br> 2004</h3>
              <h4>6 month health-care outreach in Sierra Leone</h4>
              <h3>One Yoga For The People <br> 2017-2019</h3>
              <h4>2+ years experience</h4>
              <h3>Music Production <br> 2009-Present</h3>
              <h4>Proficient in Ableton Live Mixing + Sound Design</h4>
            </div>
          </div>
        </div>
      </div>

      </section>
    </div>
  </body>
</html>