-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
531 lines (510 loc) · 31.5 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
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
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
<!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">
<title>Welcome! I'm Minnie Liu.</title>
<link href='http://fonts.googleapis.com/css?family=Varela+Round' rel='stylesheet' type='text/css'>
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="http://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
<link href="css/flexslider.css" rel="stylesheet" >
<link href="css/styles.css" rel="stylesheet">
<link href="css/queries.css" rel="stylesheet">
<link href="css/animate.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body id="top">
<header id="home">
<nav>
<div class="container-fluid">
<div class="row">
<div class="col-md-8 col-md-offset-2 col-sm-8 col-sm-offset-2 col-xs-8 col-xs-offset-2">
<nav class="pull">
<ul class="top-nav">
<li><a href="#intro">About Me<span class="indicator"><i class="fa fa-angle-right"></i></span></a></li>
<li><a href="#features">My Experiences <span class="indicator"><i class="fa fa-angle-right"></i></span></a></li>
<li><a href="#responsive">Key Competencies <span class="indicator"><i class="fa fa-angle-right"></i></span></a></li>
<li><a href="#portfolio">Technical Projects <span class="indicator"><i class="fa fa-angle-right"></i></span></a></li>
<li><a href="#team">Affiliated Organizations <span class="indicator"><i class="fa fa-angle-right"></i></span></a></li>
<li><a href="#contact">Get in Touch <span class="indicator"><i class="fa fa-angle-right"></i></span></a></li>
</ul>
</nav>
</div>
</div>
</div>
</nav>
<section class="hero" id="hero">
<div class="container">
<div class="row">
<div class="col-md-12 text-right navicon">
<a id="nav-toggle" class="nav_slide_button" href="#"><span></span></a>
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2 text-center inner">
<h1 class="animated fadeInDown">Welcome to<br> my Personal Portfolio, <span>I'm Minnie Liu!</span></h1>
<p class="animated fadeInUp delay-05s">University of British Columbia<em><br>5th Year Business and Computer Science</em></p>
</div>
</div>
<div class="row">
<div class="col-md-6 col-md-offset-3 text-center">
<a href="#intro" class="learn-more-btn">Learn More About Me</a>
</div>
</div>
</div>
</section>
</header>
<section class="intro text-center section-padding" id="intro">
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2 wp1">
<h1 class="arrow">About Me</h1>
<p>Hello there! Welcome to my e-portfolio, I’m glad you stopped by! Instead of boring you with a mundane bio that you probably wouldn’t read anyways, I will try to entertain you with three fun facts about myself:
<br>
<br>1. I am taller than both my parents. Because of my unusual height, when I was little, my parents thought it would be funny to tell me they found me in a trash can.
</br>
<br>2. When I am not busy debugging my code, you will likely find me kickboxing at the gym, volunteering for non-profit organizations, or traveling around the world.
</br>
<br>3. When I was about two years old, I was best friends with a pet chicken that followed me everywhere.
</br>
<br>
To learn more about my key competencies, technical projects, and communal contributions, please scroll down or click the green button below!
</p>
<a href="#features" class="down-arrow-btn"><i class="fa fa-chevron-down"></i></a>
</div>
</div>
</div>
</section>
<section class="features text-center section-padding" id="features">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="arrow">Love what you do, and you'll do it well</h1>
<div class="features-wrapper">
<div class="col-md-4 wp2">
<div class="icon">
<i class="fa fa-laptop shadow"></i>
</div>
<h2>Work Experiences</h2>
<p align = "left">I have been following my passion of solving problems with technology through my employment positions. As a previous SAP Software Developer Intern, I was challenged with difficult client incidents and grew tremendously as a developer and as a problem-solver. My current position as an Agile Developer Intern on SAP’s Analytics Cloud team has provided me with opportunities to collaborate with stakeholders and take full ownership of the end-to-end development of client-facing features.
</p>
</div>
<div class="col-md-4 wp2 delay-05s">
<div class="icon">
<i class="fa fa-users shadow"></i>
</div>
<h2>Volunteer Experiences</h2>
<p align = "left">During my spare time, I take delight in volunteering for charitable organization that help vulnerable groups and create positive and sustainable impacts in my local community. Besides many annual charitable events that I support, I served as an Executive Director at Richmond Cares Richmond Gives. This is an organization that supports volunteerism and offers specialized programs for vulnerable groups in the community.</p>
</div>
<div class="col-md-4 wp2 delay-1s">
<div class="icon">
<i class="fa fa-heart shadow"></i>
</div>
<h2>Passions</h2>
<p align = "left">When I am not busy with school or communal responsibilities, I enjoy traveling around the world and visiting the historical museums at my destinations. My passions also include playing the piano, kickboxing and baking. If you would like to would like to learn more about my academic, work and communal involvement, I’d love to connect with you through <a href="https://ca.linkedin.com/in/minnieliu">LinkedIn</a> or at [email protected].</p>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
</div>
</section>
<section class="text-center" id="responsive">
<div class="container-fluid nopadding responsive-services">
<div class="wrapper">
<div class="iphone">
<div class="wp3"></div>
</div>
<div class="fluid-white"></div>
</div>
<div class="container designs">
<div class="row">
<div class="col-md-5 col-md-offset-6">
<div id="servicesSlider">
<ul class="slides">
<li>
<h1 class="arrow">Techinical Skills</h1>
<p align= "left">Through my computer science courses and co-op terms, I have acquired extensive experience programming in languages such JavaScript, Java, MySQL, HTML and CSS. I also have a firm grasp of object-oriented design, multi-threads, asynchronization, data structures and algorithms.
</p>
<p align= "left">
With a strong drive to learn and utilize technology to solve everyday problems, I have completed personal projects such as a Web Application called MDHelper that increases the productivity of family physicians. Investing time in personal projects are an excellent way for me to new languages and frameworks such as React, Node.js, and MongoDB.
</p>
</li>
<li>
<h1 class="arrow">Business Skills</h1>
<p align= "left">The commerce courses I have taken equip me with the fundamentals of finance, accounting, logistics, IT management, and human resources. Moreover, the business side of my degree places emphasis on building soft skills that are crucial in any working environment. Through various large-scale group projects, I am able to work productively with a team and motivate others. My commerce courses have also strengthened both my verbal and written communication skills. Furthermore, my experience with case studies has trained me to think critically and solve problems in an efficient manner.</p>
<p>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="swag text-center">
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<h1>Life Begins<span>at<em> the End of </em>Your Comfort Zone</span></h1>
<a href="#portfolio" class="down-arrow-btn"><i class="fa fa-chevron-down"></i></a>
</div>
</div>
</div>
</section>
<section class="portfolio text-center section-padding" id="portfolio">
<div class="container">
<div class="row">
<div id="portfolioSlider">
<ul class="slides">
<li>
<h1 class="arrow">Technical Projects</h1>
<h1> Mind the Gap </h1>
<div class="col-md-4 wp4">
<div class="overlay-effect effects clearfix">
<div class="img" >
<img src="img/mtg1.png" alt="Portfolio Item">
</div>
</div>
<h2>An Android Application…</h2>
<p>Mind the Gap is an Android application that displays real time information of the London Underground including GPS location detection, train arrival times, and nearest stations.</p>
</div>
<div class="col-md-4 wp4 delay-05s">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/mtg2.png" alt="Portfolio Item">
</div>
</div>
<h2>Implementation</h2>
<p>Using JSON parsing, the application extracts live updates on the train arrivals, station locations, and underground lines. Using the OSMDroid and OSMBonusPack library from Java in conjunction with the parsed data, a map with tube lines and tube stations was created to ensure a user-friendly interface.</p>
</div>
<div class="col-md-4 wp4 delay-1s">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/mtg3.png" alt="Portfolio Item">
</div>
</div>
<h2>Relevant Programs</h2>
<p>The backend portion of the application was developed using Java inside the IntelliJ IDEA development environment. Testing of the application was performed with both the Genymotion Android Emulator and JUnit tests in Java.
</div>
</li>
<li>
<h1 class="arrow">Technical Projects</h1>
<h1>MDHelper</h1>
<div class="col-md-4 wp4">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/MDHelper_1.png" alt="Portfolio Item">
</div>
</div>
<h2>A Web Application...</h2>
<p> MDHelper enhaces the productivity of physicians by allowing patients to send medical information before appointments so that physicians can focus on diagnosis and treatment during the consultation
</p>
</div>
<div class="col-md-4 wp4 delay-05s">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/MDHelper_2.png" alt="Portfolio Item">
</div>
</div>
<h2>Implementation</h2>
<p>Utilized HTML5, CSS and JavaScript to implement the multi-page application and used IronRouter to navigate through pages. The Reactive FullCalendar API was used to enable online appointment scheduling. Also integrated MongoDB to store patient and appointment data.
</p>
</div>
<div class="col-md-4 wp4 delay-1s">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/MDHelper_3.png" alt="Portfolio Item">
</div>
</div>
<h2>Relevant Programs</h2>
<p>The front end was developed using HTML, CSS and JavaScript while the back end was implemented using the Meteor.js framework which connects seamlessly with MongoDB. Iron Router was used to navigate through the pages and FullCalendar API was integrated allow appointment scheduling.</p>
</div>
</li>
<li>
<h1 class="arrow">Technical Projects</h1>
<h1>StudyBuddy</h1>
<div class="col-md-4 wp4">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/studybuddy_1.png" alt="Portfolio Item">
</div>
</div>
<h2>A Chrome Extension…</h2>
<p>Studybuddy is a chrome extension that blocks distracting websites so users can focus on important tasks at hand. </p>
</div>
<div class="col-md-4 wp4 delay-05s">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/studybuddy_3.png" alt="Portfolio Item">
</div>
</div>
<h2>Implementation</h2>
<p>The extension is formed by a collection of Javascript, JSON, and HTML files that works asynchronously to accept URLs and inputs and then blocks the specified URLs in the background. Other simple user interactions include turning the extension on and off through a popup in the toolbar.</p>
</div>
<div class="col-md-4 wp4 delay-1s">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/studybuddy_2.png" alt="Portfolio Item">
</div>
</div>
<h2>Relevant Programs</h2>
<p>Using JavaScript Object Notation (JSON) parsing and chrome.local storage in the Chrome API, information was successfully transferred between files to allow for user interaction. Other Chrome APIs such as chome.webRequest and chrome.events were used to implement webpage blocking.</p>
</div>
</li>
<li>
<h1 class="arrow">Technical Projects</h1>
<h1>Dino</h1>
<div class="col-md-4 wp4">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/dino1.png" alt="Portfolio Item">
</div>
</div>
<h2>A Game Application...</h2>
<p>Dino is a Java game application in which players try to explore the game world and collect all the items in as few steps as possible.</p>
</div>
<div class="col-md-4 wp4 delay-05s">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/dino2.png" alt="Portfolio Item">
</div>
</div>
<h2>Implementation</h2>
<p>By implementing Hierarchical Object Oriented Design, the game world along with all entities can be modified in a robust manner. The game camera and collision detection was successfully built through coordinate calculations.</p>
</div>
<div class="col-md-4 wp4 delay-1s">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/dino3.png" alt="Portfolio Item">
</div>
</div>
<h2>Relevant Programs</h2>
<p>The Graphical User Interface (GUI) and the back end of the project was developed using Java IntelliJ IDEA development environment. Testing was implemented through an instance of the JFrame class that ran the current state of the game.</p>
</div>
</li>
<li>
<h1 class="arrow">Technical Projects</h1>
<h1>Accomplish and Reward</h1>
<div class="col-md-4 wp4">
<div class="overlay-effect effects clearfix">
<div class="img" >
<img src="img/todo1.png" alt="Portfolio Item">
</div>
</div>
<h2>An Android Application…</h2>
<p>Reward and Accomplish is an Android Application that connects performance with reward by allowing users to assign a reward to be achieved after items on the to-do list have been completed.</p>
</div>
<div class="col-md-4 wp4 delay-05s">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/todo2.png" alt="Portfolio Item">
</div>
</div>
<h2>Implementation</h2>
<p>By building on the layout files through design and text editors, a collection buttons work together to smoothly transition from one page to the next. User input is accepted through an alert dialogue in which the input is saved to the SQLite Database while progress bars and toast messages work harmoniously to provide progress feedback to users.</p>
</div>
<div class="col-md-4 wp4 delay-1s">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/todo3.png" alt="Portfolio Item">
</div>
</div>
<h2>Relevant Programs</h2>
<p>The Graphical User Interface was coded using Java in the Android Studio development environment. The backend of the project required access to the SQLite Database in order to save the items in the to-do list. Testing was performed on the emulator device provided by Android Studio.
</div>
</li>
<li>
<h1 class="arrow">Technical Projects</h1>
<h1>Missile Madness</h1>
<div class="col-md-4 wp4">
<div class="overlay-effect effects clearfix">
<div class="img" >
<img src="img/mm1.png" alt="Portfolio Item">
</div>
</div>
<h2>A Python Game...</h2>
<p>Missile Madness is a Pygame application in which enemy UFOs descend from the top of the screen and must be destroyed with a missile before it reaches the bottom of the screen.</p>
</div>
<div class="col-md-4 wp4 delay-05s">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/mm2.png" alt="Portfolio Item">
</div>
</div>
<h2>Implementation</h2>
<p>This Pygame application is dependent on a single for-loop that ticks and renders the game display on each clock cycle. The implementation of sprite classes within the program enabled collision detection and sprite spawning while increasing the robustness of the code.</p>
</div>
<div class="col-md-4 wp4 delay-1s">
<div class="overlay-effect effects clearfix">
<div class="img">
<img src="img/mm3.png" alt="Portfolio Item">
</div>
</div>
<h2>Relevant Programs</h2>
<p>This game was coded inside the PyCharm EDU coding environment using Pygame, an extension of Python especially designed for coding games. Throughout the program, the Mixer, Image, and Sprite libraries of Pygame were used to manage and render sprites, detect sprite location, and add sound effects.</p>
</div>
</li>
</ul>
</div>
</div>
</div>
</section>
<div class="ignite-cta text-center">
<div class="container">
<div class="row">
<div class="col-md-12">
<a href="#contact" class="ignite-btn">Connect with me!</a>
</div>
</div>
</div>
</div>
<section class="team text-center section-padding" id="team">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="arrow">Affiliated Organizations</h1>
</div>
</div>
<div class="row">
<div class="team-wrapper">
<div id="teamSlider">
<ul class="slides">
<li>
<div class="col-md-4 wp5">
<img src="img/SAP.jpg">
<h2>SAP Agile Developer</h2>
<p>Took full ownership of the development of client-facing features on SAP Analytics Cloud using Java and JavaScript. Resolved bugs by delivering safe and maintainble solutions.</p>
<div class="social">
<ul class="social-buttons">
<li><a href="https://www.sap.com/canada/index.html" class="social-btn"><i class="fa fa-dribbble"></i></a></li>
</ul>
</div>
</div>
<div class="col-md-4 wp5 delay-05s">
<img src="img/ubc.jpg" >
<h2>UBC CPSC Teaching Assistant</h2>
<p>Lead and assess over 26 students in weekly labs to enhance their understanding of course content. Grade over 500 exams and 2500 assignments each semester with the TA team.</p>
<div class="social">
<ul class="social-buttons">
<li><a href="http://www.ugrad.cs.ubc.ca/~cs121/current/" class="social-btn"><i class="fa fa-dribbble"></i></a></li>
</ul>
</div>
</div>
<div class="col-md-4 wp5 delay-1s">
<img src="img/clc.jpg">
<h2>CLC Assistant</h2>
<p>Offer effective solutions to questions from patrons by connecting them with appropriate resources and effectively resolve technology related problems by testing and troubleshooting technical equipment.</p>
<div class="social">
<ul class="social-buttons">
<li><a href="https://mybcom.sauder.ubc.ca/know-sauder/clc" class="social-btn"><i class="fa fa-dribbble"></i></a></li>
</ul>
</div>
</div>
<div class="col-md-4 wp5 ">
<img src="img/youth.png">
<h2>Youth Now Alumni</h2>
<p>Attend and engage in monthly conferences that addressed leadership and communication skills while gaining hands on experience sitting on an Executive Board of a non-profit organization.</p>
<div class="social">
<ul class="social-buttons">
<li><a href="http://www.volunteerrichmond.ca/programs/leadershiprichmond/youthnow.aspx" class="social-btn"><i class="fa fa-dribbble"></i></a></li>
</ul>
</div>
</div>
<div class="col-md-4 wp5 delay-05s">
<img src="img/art.jpeg">
<h2>Richmond Art Center Teaching Assistant</h2>
<p>Worked collaboratively with the instructor and patiently assist up to 20 students in a local clay class. </p>
<div class="social">
<ul class="social-buttons">
<li><a href="http://richmondartcenter.org/?gclid=Cj0KEQjw4J-6BRD3h_KIoqijwvkBEiQAfcPiBcdloR-Mf_AeclRUvH7zwMfGilF2DCVgXeohUQoWlBIaAoSo8P8HAQ" class="social-btn"><i class="fa fa-dribbble"></i></a></li>
</ul>
</div>
</div>
<div class="col-md-4 wp5 delay-1s">
<img src="img/IB.jpg" >
<h2>International Baccalaureate Alumni</h2>
<p>Graduated the International Baccalaureate program with top scores in the 99.97th percentile (42 out of 45 total). Top IT student of the grade and Winner of IB Information Technology in a Global Society award.</p>
<div class="social">
<ul class="social-buttons">
<li><a href="http://www.ibo.org/" class="social-btn"><i class="fa fa-dribbble"></i></a></li>
</ul>
</div>
</div>
<div class="col-md-4 wp5 ">
<img src="img/piano.jpg" >
<h2>Piano Enthusiast</h2>
<p>Over 7 years of experience playing piano and achieved Royal Conservatory of Music Grade 8 with first class honors.</p>
<div class="social">
<ul class="social-buttons">
<li><a href="http://www.rcmusic.ca/" class="social-btn"><i class="fa fa-dribbble"></i></a></li>
</ul>
</div>
</div>
<div class="col-md-4 wp5 ">
<img src="img/oneclimb.png" >
<h2>One Climb Event Coordinator</h2>
<p>Exceeded in the execution of innovative fundraising events that brought the team to the goal with 50% additional revenue.</p>
<div class="social">
<ul class="social-buttons">
<li><a href="http://oneclimb.ca/" class="social-btn"><i class="fa fa-dribbble"></i></a></li>
</ul>
</div>
</div>
<div class="col-md-4 wp5">
<img src="img/rcrg.jpg">
<h2>Executive Director</h2>
<p>Work with professionals in the field to facilitate sustainable improvements and assist in the development of media content released by the organization.</p>
<div class="social">
<ul class="social-buttons">
<li><a href="http://www.rcrg.org/" class="social-btn"><i class="fa fa-dribbble"></i></a></li>
</ul>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<section class="subscribe text-center">
</section>
<section class="dark-bg text-center section-padding contact-wrap" id="contact">
<a href="#top" class="up-btn"><i class="fa fa-chevron-up"></i></a>
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="arrow">Contact Me</h1>
</div>
</div>
<div class="row contact-details">
<div class="col-md-6">
<div class="light-box box-hover">
<h2><i class="fa fa-envelope"></i><span>Email</span></h2>
<p>[email protected]</p>
</div>
</div>
<div class="col-md-6">
<div class="light-box box-hover">
<h2><i class="fa fa-linkedin"></i><span>LinkedIn</span></h2>
<a href="https://ca.linkedin.com/in/minnieliu">https://ca.linkedin.com/in/minnieliu</a>
</div>
</div>
</section>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/waypoints.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/scripts.js"></script>
<script src="js/jquery.flexslider.js"></script>
<script src="js/modernizr.js"></script>
</body>
</html>