-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
866 lines (798 loc) · 53.4 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
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<title>FrontFest 2018</title>
<meta name="description" content="Segunda edición del evento exclusivamente dedicado al mundo del front-end en Madrid">
<meta name="keywords" content="evento, meetup, conferencia, madrid, software, front-end, frontend, html, css, javascript, desarroollo web" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0" />
<link rel="manifest" href="manifest.json">
<meta name="theme-color" content="#ffcc00">
<link rel="canonical" href="https://frontfest.es" />
<!-- twitter card -->
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@frontfest" />
<meta name="twitter:creator" content="@frontfest" />
<meta name="twitter:url" content="http://frontfest.es" />
<meta name="twitter:title" content="Segunda edición del evento exclusivamente dedicado al mundo del front-end en Madrid" /> <!-- maximum 140 char -->
<meta name="twitter:description" content="Madrid, 17 de febrero de 2018" /> <!-- maximum 140 char -->
<meta name="twitter:image" content="http://frontfest.es/images/logo-280x280.png" /> <!-- when you post this page url in twitter , this image will be shown -->
<!-- twitter card ends from here -->
<!-- facebook open graph -->
<meta property="og:title" content="Segunda edición del evento exclusivamente dedicado al mundo del front-end en Madrid" />
<meta property="og:url" content="http://frontfest.es" />
<meta property="og:locale" content="es_ES" />
<meta property="og:site_name" content="FrontFest" />
<meta property="og:description" content="Madrid, 17 de febrero de 2018" />
<meta property="og:type" content="website" />
<meta property="og:image" content="http://frontfest.es/images/logo-280x280.png" /> <!-- when you post this page url in facebook, this image will be shown -->
<!-- facebook open graph ends from here -->
<link rel="icon" href="images/logo-280x280.png" />
<link href="styles/normalize.min.css" rel="stylesheet">
<link href="styles/flexboxgrid.min.css" rel="stylesheet">
<link href="styles/style.css" rel="stylesheet">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.4/dist/leaflet.css"
integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA=="
crossorigin=""/>
</head>
<body>
<aside class="aside">
<ul class="overlay-menu">
<li><a title="Recursos" href="#2017">Recursos</a></li>
<li><a title="Código de conducta" href="#cdc">Código de conducta</a></li>
<li><a title="Ponentes" href="#ponentes">Ponentes</a></li>
<li><a title="Agenda" href="#agenda">Agenda</a></li>
<li><a title="Patrocinadores" href="#sponsors">Patrocinadores</a></li>
<li><a title="Localización" href="#localizacion">Localización</a></li>
</ul>
</aside>
<nav class="nav" id="nav">
<div class="wrapper">
<ul class="nav-left">
<li>
<a title="Logo" href="/">
<img alt="Logo de FrontFest" src="images/logo.svg" />
</a>
</li>
<li>
<a title="FrontFest en Twitter" target="_blank" href="https://twitter.com/frontfest">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 26 26" version="1.1" width="30" height="30">
<path d="M 25.855469 5.574219 C 24.914063 5.992188 23.902344 6.273438 22.839844 6.402344 C 23.921875 5.75 24.757813 4.722656 25.148438 3.496094 C 24.132813 4.097656 23.007813 4.535156 21.8125 4.769531 C 20.855469 3.75 19.492188 3.113281 17.980469 3.113281 C 15.082031 3.113281 12.730469 5.464844 12.730469 8.363281 C 12.730469 8.773438 12.777344 9.175781 12.867188 9.558594 C 8.503906 9.339844 4.636719 7.246094 2.046875 4.070313 C 1.59375 4.847656 1.335938 5.75 1.335938 6.714844 C 1.335938 8.535156 2.261719 10.140625 3.671875 11.082031 C 2.808594 11.054688 2 10.820313 1.292969 10.425781 C 1.292969 10.449219 1.292969 10.46875 1.292969 10.492188 C 1.292969 13.035156 3.101563 15.15625 5.503906 15.640625 C 5.0625 15.761719 4.601563 15.824219 4.121094 15.824219 C 3.78125 15.824219 3.453125 15.792969 3.132813 15.730469 C 3.800781 17.8125 5.738281 19.335938 8.035156 19.375 C 6.242188 20.785156 3.976563 21.621094 1.515625 21.621094 C 1.089844 21.621094 0.675781 21.597656 0.265625 21.550781 C 2.585938 23.039063 5.347656 23.90625 8.3125 23.90625 C 17.96875 23.90625 23.25 15.90625 23.25 8.972656 C 23.25 8.742188 23.246094 8.515625 23.234375 8.289063 C 24.261719 7.554688 25.152344 6.628906 25.855469 5.574219 "/>
</svg>
</a>
</li>
<li>
<a title="FrontFest en Youtube" target="_blank" href="https://www.youtube.com/channel/UC3mQnUb4NiwhD67H465_sBw">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 96.875 96.875" version="1.1" width="30" height="30">
<path d="M95.201,25.538c-1.186-5.152-5.4-8.953-10.473-9.52c-12.013-1.341-24.172-1.348-36.275-1.341
c-12.105-0.007-24.266,0-36.279,1.341c-5.07,0.567-9.281,4.368-10.467,9.52C0.019,32.875,0,40.884,0,48.438
C0,55.992,0,64,1.688,71.336c1.184,5.151,5.396,8.952,10.469,9.52c12.012,1.342,24.172,1.349,36.277,1.342
c12.107,0.007,24.264,0,36.275-1.342c5.07-0.567,9.285-4.368,10.471-9.52c1.689-7.337,1.695-15.345,1.695-22.898
C96.875,40.884,96.889,32.875,95.201,25.538z M35.936,63.474c0-10.716,0-21.32,0-32.037c10.267,5.357,20.466,10.678,30.798,16.068
C56.434,52.847,46.23,58.136,35.936,63.474z"/>
</svg>
</a>
</li>
<li>
<a title="FrontFest en Telegram" target="_blank" href="https://telegram.me/frontfest">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32" version="1.1" width="30" height="30">
<path d="M 26.070313 3.996094 C 25.734375 4.011719 25.417969 4.109375 25.136719 4.21875 L 25.132813 4.21875 C 24.847656 4.332031 23.492188 4.902344 21.433594 5.765625 C 19.375 6.632813 16.703125 7.757813 14.050781 8.875 C 8.753906 11.105469 3.546875 13.300781 3.546875 13.300781 L 3.609375 13.277344 C 3.609375 13.277344 3.25 13.394531 2.875 13.652344 C 2.683594 13.777344 2.472656 13.949219 2.289063 14.21875 C 2.105469 14.488281 1.957031 14.902344 2.011719 15.328125 C 2.101563 16.050781 2.570313 16.484375 2.90625 16.722656 C 3.246094 16.964844 3.570313 17.078125 3.570313 17.078125 L 3.578125 17.078125 L 8.460938 18.722656 C 8.679688 19.425781 9.949219 23.597656 10.253906 24.558594 C 10.433594 25.132813 10.609375 25.492188 10.828125 25.765625 C 10.933594 25.90625 11.058594 26.023438 11.207031 26.117188 C 11.265625 26.152344 11.328125 26.179688 11.390625 26.203125 C 11.410156 26.214844 11.429688 26.21875 11.453125 26.222656 L 11.402344 26.210938 C 11.417969 26.214844 11.429688 26.226563 11.441406 26.230469 C 11.480469 26.242188 11.507813 26.246094 11.558594 26.253906 C 12.332031 26.488281 12.953125 26.007813 12.953125 26.007813 L 12.988281 25.980469 L 15.871094 23.355469 L 20.703125 27.0625 L 20.8125 27.109375 C 21.820313 27.550781 22.839844 27.304688 23.378906 26.871094 C 23.921875 26.433594 24.132813 25.875 24.132813 25.875 L 24.167969 25.785156 L 27.902344 6.65625 C 28.007813 6.183594 28.035156 5.742188 27.917969 5.3125 C 27.800781 4.882813 27.5 4.480469 27.136719 4.265625 C 26.769531 4.046875 26.40625 3.980469 26.070313 3.996094 Z M 25.96875 6.046875 C 25.964844 6.109375 25.976563 6.101563 25.949219 6.222656 L 25.949219 6.234375 L 22.25 25.164063 C 22.234375 25.191406 22.207031 25.25 22.132813 25.308594 C 22.054688 25.371094 21.992188 25.410156 21.667969 25.28125 L 15.757813 20.75 L 12.1875 24.003906 L 12.9375 19.214844 C 12.9375 19.214844 22.195313 10.585938 22.59375 10.214844 C 22.992188 9.84375 22.859375 9.765625 22.859375 9.765625 C 22.886719 9.3125 22.257813 9.632813 22.257813 9.632813 L 10.082031 17.175781 L 10.078125 17.15625 L 4.242188 15.191406 L 4.242188 15.1875 C 4.238281 15.1875 4.230469 15.183594 4.226563 15.183594 C 4.230469 15.183594 4.257813 15.171875 4.257813 15.171875 L 4.289063 15.15625 L 4.320313 15.144531 C 4.320313 15.144531 9.53125 12.949219 14.828125 10.71875 C 17.480469 9.601563 20.152344 8.476563 22.207031 7.609375 C 24.261719 6.746094 25.78125 6.113281 25.867188 6.078125 C 25.949219 6.046875 25.910156 6.046875 25.96875 6.046875 Z "/>
</svg>
</a>
</li>
</ul>
<ul class="nav-right">
<li>
<a title="Recursos" href="#2017">Recursos</a>
</li>
<li>
<a title="Código de conducta" href="#cdc">Código de conducta</a>
</li>
<li>
<a title="Ponentes" href="#ponentes">Ponentes</a>
</li>
<li>
<a title="Agenda" href="#agenda">Agenda</a>
</li>
<li>
<a title="Patrocinadores" href="#sponsors">Patrocinadores</a>
</li>
<li>
<a title="Localización" href="#localizacion">Localización</a>
</li>
<li>
<a title="Entradas" href="#tickets">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 512 512" width="30" height="30" xml:space="preserve">
<g>
<g>
<g>
<path d="M156.006,92.548H20.216C9.051,92.548,0,101.599,0,112.764v77.31c0,11.274,9.229,20.123,20.503,20.193
c25.086,0.155,45.447,20.61,45.447,45.733s-20.361,45.579-45.447,45.733C9.229,301.804,0,310.653,0,321.926v77.31
c0,11.164,9.051,20.216,20.216,20.216h135.791c3.721,0,6.739-3.016,6.739-6.739V99.287
C162.745,95.564,159.727,92.548,156.006,92.548z"/>
<path d="M492.26,210.312c10.974-0.373,19.74-9.23,19.74-20.21v-77.338c0-11.164-9.051-20.216-20.216-20.216h-281.87
c-3.721,0-6.739,3.016-6.739,6.739v313.426c0,3.722,3.018,6.739,6.739,6.739h281.87c11.164,0,20.216-9.051,20.216-20.216v-77.338
c0-10.98-8.767-19.837-19.74-20.21C433.845,299.7,433.706,212.305,492.26,210.312z M396.494,313.327H270.456
c-11.164,0-20.216-9.051-20.216-20.216s9.051-20.216,20.216-20.216h126.037c11.164,0,20.216,9.051,20.216,20.216
S407.658,313.327,396.494,313.327z M396.494,239.104H270.456c-11.164,0-20.216-9.051-20.216-20.216s9.051-20.216,20.216-20.216
h126.037c11.164,0,20.216,9.051,20.216,20.216S407.658,239.104,396.494,239.104z"/>
</g>
</g>
</g>
</svg>
</a>
</li>
</ul>
<ul class="toggle-menu" id="toggleMenu">
<li id="openMenu">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 24 24" enable-background="new 0 0 24 24" width="30" height="30">
<g>
<path d="M24,3c0-0.6-0.4-1-1-1H1C0.4,2,0,2.4,0,3v2c0,0.6,0.4,1,1,1h22c0.6,0,1-0.4,1-1V3z" />
<path d="M24,11c0-0.6-0.4-1-1-1H1c-0.6,0-1,0.4-1,1v2c0,0.6,0.4,1,1,1h22c0.6,0,1-0.4,1-1V11z" />
<path d="M24,19c0-0.6-0.4-1-1-1H1c-0.6,0-1,0.4-1,1v2c0,0.6,0.4,1,1,1h22c0.6,0,1-0.4,1-1V19z" />
</g>
</svg>
</li>
<li id="closeMenu">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 24 24" enable-background="new 0 0 24 24" width="30" height="30">
<path d="M14.1,11.3c-0.2-0.2-0.2-0.5,0-0.7l7.5-7.5c0.2-0.2,0.3-0.5,0.3-0.7s-0.1-0.5-0.3-0.7l-1.4-1.4C20,0.1,19.7,0,19.5,0 c-0.3,0-0.5,0.1-0.7,0.3l-7.5,7.5c-0.2,0.2-0.5,0.2-0.7,0L3.1,0.3C2.9,0.1,2.6,0,2.4,0S1.9,0.1,1.7,0.3L0.3,1.7C0.1,1.9,0,2.2,0,2.4 s0.1,0.5,0.3,0.7l7.5,7.5c0.2,0.2,0.2,0.5,0,0.7l-7.5,7.5C0.1,19,0,19.3,0,19.5s0.1,0.5,0.3,0.7l1.4,1.4c0.2,0.2,0.5,0.3,0.7,0.3 s0.5-0.1,0.7-0.3l7.5-7.5c0.2-0.2,0.5-0.2,0.7,0l7.5,7.5c0.2,0.2,0.5,0.3,0.7,0.3s0.5-0.1,0.7-0.3l1.4-1.4c0.2-0.2,0.3-0.5,0.3-0.7 s-0.1-0.5-0.3-0.7L14.1,11.3z"/>
</svg>
</li>
</ul>
</div>
</nav>
<main>
<header class="header">
<div class="overlay">
<div class="container container-fluid">
<div class="block">
<div class="logo">
<img alt="Logo de FrontFest" class="logo-svg" src="images/frontfest.svg" />
</div>
<div class="date">
<h1 class="title-white">Madrid</h1>
<h2 class="subtitle-white">17 de febrero de 2018</h2>
</div>
<div class="flex flex-wrap">
<a href="https://blog.frontfest.es" title="Blog" class="btn reverse margin-right">
FrontFest
<img class="height-76 padding-right-12" src="images/blog.png">
<img class="height-20 padding-right-12" src="images/web.svg">
</a>
</div>
</div>
</div>
</div>
</header>
<section class="previous" id="2017">
<div class="container container-fluid">
<div class="row">
<div class="col-xs-12">
<h1>Así fue la primera edición</h1>
<div class="separator"></div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-6">
<p>Si no pudiste asistir a la <a class="yellow-link" target="_blank" href="http://frontfest.github.io/2017">primera edición</a> o quieres volver a ver alguna de las charlas, aquí tienes una lista de reproducción con todos los vídeos.</p>
<div class="flex flex-wrap">
<a title="Lista de reproducción en Youtube" target="_blank" href="https://www.youtube.com/watch?v=1AwIZS1sXQU&list=PLV_VSxFnAJKIQiOVUAccpkqXe_9rmVJTZ" class="btn transparent margin-right">
Charlas<img class="height-32 padding-left-12" src="images/youtube.svg">
</a>
<a title="Teaser" target="_blank" href="https://www.youtube.com/watch?v=NCM-9A9gv6s" class="btn transparent">
Teaser<img class="height-32 padding-left-12" src="images/youtube.svg">
</a>
</div>
<p>También puedes leer las retrospectivas que escribieron algunos de nuestros asistentes. ¡Que las distrutes!</p>
<ul class="list black">
<li><span><a target="_blank" href="https://www.paradigmadigital.com/dev/ha-nacido-una-estrella-front-fest/">Ha nacido una estrella: el Front Fest</a>, por <strong>César Redondo</strong> y <strong>David Attrache</strong></span></li>
<li><span><a target="_blank" href="https://www.vitalinnova.com/evento-del-mes-front-fest/">El evento del mes: Front Fest</a>, por <strong>Clara Morrondo</strong></span></li>
<li><span><a target="_blank" href="https://engineering.ticketea.com/frontfest/">Front Fest 2017</a>, por <strong>Rafael Moro</strong></span></li>
<li><span><a target="_blank" href="http://jorgeatgu.com/blog/retro-front-frest/">Mi retroespecter del FrontFest</a>, por <strong>Jorge Aznar</strong></span></li>
<li><span><a target="_blank" href="https://www.intelygenz.es/front-fest-evento-tecnologias-web/">Front Fest, el evento sobre tecnologías web... al detalle!</a>, por <strong>Noemi Medina</strong></span></li>
<li><span><a target="_blank" href="https://ciudadanob.com/blog/2017/02/21/front-fest-2017-resumen/">Front Fest 2017: el resumen</a>, por <strong>Juan Hernando</strong></span></li>
</ul>
</div>
<div class="col-xs-12 col-md-5 col-md-offset-1 end-xs">
<img class="width-full margin-top" src="images/teaser.jpg">
</div>
</div>
</div>
</section>
<section id="cdc" class="coc">
<div class="overlay">
<div class="container container-fluid">
<div class="row">
<div class="col-xs-12 col-md-8">
<h1>Código de conducta</h1>
<p class="black-text text-shadow">
Nos tomamos muy en serio la promoción de la diversidad y el respeto a los demás. Por eso, antes de comprar una entrada
o mandar una propuesta, desde la organización de FrontFest os pedimos que leáis y aceptéis nuestro código de conducta.
De este modo podremos crear un ambiente agradable y respetuoso en el que nadie se sienta agredido o fuera de lugar.
</p>
</div>
<div class="col-xs-12 col-md-4 flex end-xs middle-xs">
<a title="Leer el código de conducta" href="codigo-conducta.html" class="btn transparent">Leer el código de conducta</a>
</div>
</div>
</div>
</div>
</section>
<section id="ponentes" class="section bg-salmon">
<div class="container container-fluid">
<div class="row">
<div class="col-xs-5">
<h1>Ponentes</h1>
<div class="separator"></div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-5 margin-top-25">
<div class="flex between-xs">
<img class="speaker" src="images/speakers/BelenAlbeza.jpg">
<div class="column flex-1 end-xs align-left padding-left-20">
<div class="flex middle-xs">
<h2>Belén Albeza</h2>
</div>
<p class="handle-tw"><a target="_blank" href="https://twitter.com/ladybenko">@ladybenko</a></p>
<div>
<a target="_blank" title="Web" href="https://belenalbeza.com/"><img class="sn-icon" alt="Web" src="images/sn/home.svg" /></a>
<a target="_blank" title="Twitter" href="https://twitter.com/ladybenko"><img class="sn-icon" alt="Twitter" src="images/twitter.svg" /></a>
<a target="_blank" title="Github" href="https://github.com/belen-albeza"><img class="sn-icon" alt="Github" src="images/sn/github.svg" /></a>
</div>
</div>
</div>
<p>Belén es desarrolladora y trabaja actualmente en el equipo de Developer Relations en Mozilla. Le interesan los estándares web, el código de calidad y el desarrollo de videojuegos. Anteriormente, ha trabajado tanto en startups como en corporaciones, desarrollando aplicaciones, prototipos de I+D y videojuegos. Belén vive actualmente en Barcelona y le gusta el heavy metal, participar en game jams y jugar al Mass Effect.</p>
</div>
<div class="col-md-2 col-xs-0 flex center-xs margin-top-25">
<div class="flex vertical-bars between-xs">
<div></div>
<div></div>
<div></div>
</div>
</div>
<div class="col-xs-12 col-md-5 margin-top-25">
<div class="flex between-xs">
<img class="speaker" src="images/speakers/IvanAbascal.jpg">
<div class="column flex-1 end-xs align-left padding-left-20">
<div class="flex middle-xs">
<h2>Iván Abascal</h2>
</div>
<p class="handle-tw"><a target="_blank" href="https://twitter.com/abalozz">@abalozz</a></p>
<div>
<a target="_blank" title="Twitter" href="https://twitter.com/abalozz"><img class="sn-icon" alt="Twitter" src="images/twitter.svg" /></a>
<a target="_blank" title="Github" href="https://github.com/abalozz"><img class="sn-icon" alt="Github" src="images/sn/github.svg" /></a>
</div>
</div>
</div>
<p>Desarrollador web. Aprendí a programar colaborando en un proyecto de código abierto. En su día organicé los primeros encuentros de @cantabriajs. Empecé a especializarme en el desarrollo frontend, aunque por casualidades de la vida en mi día a día hago backend, así que conozco ambos mundos.</p>
</div>
<div class="col-xs-12 col-md-5 margin-top-25">
<div class="flex between-xs">
<img class="speaker" src="images/speakers/CarlosManas.jpg">
<div class="column flex-1 end-xs align-left padding-left-20">
<h2>Carlos Mañas</h2>
<p class="handle-tw"><a target="_blank" href="https://twitter.com/oneeyedman">@oneeyedman</a></p>
<div>
<a target="_blank" title="Twitter" href="https://twitter.com/oneeyedman"><img class="sn-icon" alt="Twitter" src="images/twitter.svg" /></a>
<a target="_blank" title="Instagram" href="https://www.instagram.com/oneeyedman/"><img class="sn-icon" alt="Instagram" src="images/sn/instagram.svg" /></a>
<a target="_blank" title="Dribbble" href="https://dribbble.com/oneeyedman/"><img class="sn-icon" alt="Dribbble" src="images/sn/dribbble.svg" /></a>
<a target="_blank" title="Github" href="https://github.com/oneeyedman/"><img class="sn-icon" alt="Github" src="images/sn/github.svg" /></a>
</div>
</div>
</div>
<p>Frontend designer en spacenomads.com, parte del equipo de HumansTXT, ilustrador de media noche, tuerto y, ahora, profe implacable en Adalab.</p>
</div>
<div class="col-md-2 col-xs-0 flex center-xs margin-top-25">
<div class="flex vertical-bars between-xs">
<div></div>
<div></div>
<div></div>
</div>
</div>
<div class="col-xs-12 col-md-5 margin-top-25">
<div class="flex between-xs">
<img class="speaker" src="images/speakers/EduardoSada.jpg">
<div class="column flex-1 end-xs align-left padding-left-20">
<h2 class="flex middle-xs">Eduardo Sada</h2>
<p class="handle-tw"><a target="_blank" href="https://twitter.com/aeroalquimia">@aeroalquimia</a></p>
<div>
<a target="_blank" title="Twitter" href="https://twitter.com/aeroalquimia"><img class="sn-icon" alt="Twitter" src="images/twitter.svg" /></a>
<a target="_blank" title="LinkedIn" href="https://www.linkedin.com/in/eduardosada/"><img class="sn-icon" alt="LinkedIn" src="images/sn/linkedin.svg" /></a>
<a target="_blank" title="Codepen" href="https://codepen.io/eduardosada/"><img class="sn-icon" alt="Codepen" src="images/sn/codepen.svg" /></a>
</div>
</div>
</div>
<p>Especialista Javascript en Kairós Digital Solutions. Eduardo es además evangelista de Polymer, con más de 12 años de experiencia en desarrollo Front-end. Hoy se dedica, según su madre, a «hacer caritas y botoncitos» de manera profesional. Suele dar charlas en eventos de programación para no pagar la entrada.</p>
</div>
<div class="col-xs-12 col-md-5 margin-top-25">
<div class="flex between-xs">
<img class="speaker" src="images/speakers/RamonGuijarro.jpg">
<div class="column flex-1 end-xs align-left padding-left-20">
<h2 class="flex middle-xs">Ramón Guijarro</h2>
<p class="handle-tw"><a target="_blank" href="https://twitter.com/soyguijarro">@soyguijarro</a></p>
<div>
<a target="_blank" title="Twitter" href="https://twitter.com/soyguijarro"><img class="sn-icon" alt="Twitter" src="images/twitter.svg" /></a>
<a target="_blank" title="Github" href="https://github.com/soyguijarro"><img class="sn-icon" alt="Github" src="images/sn/github.svg" /></a>
</div>
</div>
</div>
<p>Desarrollador web creativo con interés por el diseño, la comunicación y los datos. Entusiasta de JavaScript y React. Me gusta compartir lo poco que sé todo lo que puedo y me fascinan los nuevos e inesperados usos de la web. Inventarme necesidades personales para resolverlas programando es otra de mis cuestionables virtudes.</p>
</div>
<div class="col-md-2 col-xs-0 flex center-xs margin-top-25">
<div class="flex vertical-bars between-xs">
<div></div>
<div></div>
<div></div>
</div>
</div>
<div class="col-xs-12 col-md-5 margin-top-25">
<div class="flex between-xs">
<img class="speaker" src="images/speakers/VicenteLucendo.jpg">
<div class="column flex-1 end-xs align-left padding-left-20">
<h2 class="flex middle-xs">Vicente Lucendo</h2>
<p class="handle-tw"><a target="_blank" href="https://twitter.com/vlucendo">@vlucendo</a></p>
<div>
<a target="_blank" title="Web" href="http://vlucendo.com/"><img class="sn-icon" alt="Web" src="images/sn/home.svg" /></a>
<a target="_blank" title="Twitter" href="https://twitter.com/vlucendo"><img class="sn-icon" alt="Twitter" src="images/twitter.svg" /></a>
</div>
</div>
</div>
<p>Desarrollador creativo y co-fundador de Veintidós Grados (veintidosgrados.com). Soy el responsable del concepto, desarrollo y animación de los proyectos que hacemos en el estudio. En el pasado también diseñaba mis proyectos pero ahora mi interés se centra en la programación front-end y gráfica (WebGL, shaders, etc) y las posibilidades que abren estas tecnologías.</p>
</div>
<div class="col-xs-12 col-md-5 margin-top-25">
<div class="flex between-xs">
<img class="speaker" src="images/speakers/JoanLeon.jpg">
<div class="column flex-1 end-xs align-left padding-left-20">
<h2 class="flex middle-xs">Joan León</h2>
<p class="handle-tw"><a target="_blank" href="https://twitter.com/nucliweb">@nucliweb</a></p>
<div>
<a target="_blank" title="Twitter" href="https://twitter.com/nucliweb"><img class="sn-icon" alt="Twitter" src="images/twitter.svg" /></a>
<a target="_blank" title="Github" href="https://github.com/nucliweb/"><img class="sn-icon" alt="Github" src="images/sn/github.svg" /></a>
<a target="_blank" title="Instagram" href="https://www.instagram.com/joanleon"><img class="sn-icon" alt="Instagram" src="images/sn/instagram.svg" /></a>
</div>
</div>
</div>
<p>Developer Advocate & Training Manager en Schibsted Spain, pero sigo siendo un CSS & Animation Lover, me apasiona todo lo relacionado con el desarrollo e interacción en la interfaz de usuario en entornos web. Trato de estar al día en todo lo relacionado con HTML5, CSS, SVG y Javascript. Otra de mis pasiones es la de colaborar en proyectos Open Source.
Me encanta compartir conocimiento, ya sea en MeetUps, Conferencias, Workshops o como docente en Escuela IT... siempre activo en @nucliweb compartiendo todos los recursos y novedades del mundo frontend... y últimamente de Creative Coding.</p>
</div>
<div class="col-md-2 col-xs-0 flex center-xs margin-top-25">
<div class="flex vertical-bars between-xs">
<div></div>
<div></div>
<div></div>
</div>
</div>
<div class="col-xs-12 col-md-5 margin-top-25">
<div class="flex between-xs">
<img class="speaker" src="images/speakers/JorgeBarrachina.jpg">
<div class="column flex-1 end-xs align-left padding-left-20">
<h2 class="flex middle-xs">Jorge Barrachina</h2>
<p class="handle-tw"><a target="_blank" href="https://twitter.com/NTKOG">@NTKOG</a></p>
<div>
<a target="_blank" title="Twitter" href="https://twitter.com/NTKOG"><img class="sn-icon" alt="Twitter" src="images/twitter.svg" /></a>
<a target="_blank" title="LinkedIn" href="https://www.linkedin.com/in/jorgebarrachina/"><img class="sn-icon" alt="LinkedIn" src="images/sn/linkedin.svg" /></a>
<a target="_blank" title="Medium" href="https://medium.com/@ntkog"><img class="sn-icon border" alt="Medium" src="images/sn/medium.svg" /></a>
</div>
</div>
</div>
<p>Me apasiona la tecnología, de ahí que haya pasado ya por varios "frentes" en este sector: Administrador de Sistemas, Backend, QA, frontend... Co-fundé y dinamicé HTML5-Spain durante 4 años, en los que compartimos nuestra pasión por aprender y jugar con la tecnología. También colaboro en @yosoytumadre_ti, una iniciativa para concienciar sobre conciliación laboral. Ahora trabajo como DevRel en Esri España.</p>
</div>
<div class="col-xs-12 col-md-5 margin-top-25">
<div class="flex between-xs">
<img class="speaker" src="images/speakers/JavierAbadia.jpg">
<div class="column flex-1 end-xs align-left padding-left-20">
<h2 class="flex middle-xs">Javier Abadía</h2>
<p class="handle-tw"><a target="_blank" href="https://twitter.com/javierabadia">@javierabadia</a></p>
<div>
<a target="_blank" title="Twitter" href="https://twitter.com/javierabadia"><img class="sn-icon" alt="Twitter" src="images/twitter.svg" /></a>
</div>
</div>
</div>
<p>Javier es un curtido desarrollador que ha trabajado en distintos puestos técnicos y de gestión en los últimos 20 años: llevando equipos de desarrollo, evangelizando sobre sistemas de información geográfica e incluso escribiendo software para varios modelos de aviones de combate. Sus ideales son el software con 0 bugs, testeo en modo paranoide, automatización, metodologías ágiles y trabajo en equipo. Corredor y esquiador, ha decidido que su próxima aventura será divertirse haciendo la mejor plataforma de visualización de analíticas de big data que se haya construido jamás (o casi). Javier es Ingeniero en Informática por la Universidad de Zaragoza y tiene un MBA del IE Business School.</p>
</div>
</div>
</div>
</section>
<section id="agenda" class="section-small bg-brown">
<div class="container container-fluid">
<div class="row">
<div class="col-xs-5 margin-bottom">
<h1>Agenda</h1>
<div class="separator"></div>
</div>
</div>
<div class="light-box">
<h5>8:30 - 9:25</h5>
<h3>Acreditación</h3>
</div>
<div class="light-box">
<h5>9:30 - 9:40</h5>
<h3>Presentación</h3>
</div>
<div class="dark-box">
<div class="flex middle-xs margin-bottom">
<img class="rounded avatar margin-right" src="images/speakers/JavierAbadia.jpg">
<div>
<h5>9:45 - 10:30</h5>
<h3>3 soluciones a un mismo problema: ¿cómo implementan la reactividad React, Vue y Angular?</h3>
<h4>Javier Abadía</h4>
</div>
</div>
<p>¿Qué es la reactividad en un framework front-end? ¿Por qué debería importarme?</p>
<p>La sincronización entre datos y vista es el problema central que resuelven todos los frameworks front-end y la solución que cada uno plantea al mismo problema es la principal característica que condiciona forma de desarrollo, rendimiento, operaciones no permitidas, facilidades de depuración...</p>
<p>Entraremos a fondo en las tripas de la implementación de la reactividad en los principales frameworks y veremos las consecuencias prácticas que de ella se derivan.</p>
<p>Si conoces cualquiera de los 3 frameworks, esta charla te ayudará a utilizarlo mejor, y quién sabe si a descubrir que hay otro framework que se adapte mejor a tu caso de uso.</p>
</div>
<div class="dark-box">
<div class="flex middle-xs margin-bottom">
<img class="rounded avatar margin-right" src="images/speakers/IvanAbascal.jpg">
<div>
<h5>10:35 - 11:20</h5>
<h3>¿Estamos creando la web de la forma correcta?</h3>
<h4>Iván Abascal</h4>
</div>
</div>
<p>Creo que es necesario pararnos a pensar un momento y hacernos esta pregunta. ¿Realmente lo estamos haciendo bien?</p>
<p>Las webs cada vez pesan más. El botón de atrás del navegador está dejando de funcionar. Los enlaces ya no son enlaces. Y, venga ya, ¿de verdad necesito todas estas herramientas para comenzar a crear una web? ¿No puedo tirar unos cuantos archivos CSS y JS en una carpeta y ya?</p>
<p>Vamos a analizar de forma objetiva las prácticas que estamos siguiendo hoy en día, y reflexionaremos sobre cuándo está bien seguirlas, y cuándo no. ¿Hasta qué punto Bootstrap agiliza el trabajo? ¿CSS en JS es bueno o malo? ¿Es necesario preprocesar y minificar nuestro código? ¿Realmente necesitas un framework de JavaScript?</p>
<p>La charla será una crítica al panorama actual del desarrollo web. Por supuesto, siempre desde un punto de vista constructivo ;)</p>
</div>
<div class="light-box">
<h5>11:25 - 11:55</h5>
<h3>Desayuno</h3>
</div>
<div class="dark-box">
<div class="flex middle-xs margin-bottom">
<img class="rounded avatar margin-right" src="images/speakers/RamonGuijarro.jpg">
<div>
<h5>12:00 - 12:45</h5>
<h3>Testing práctico con JavaScript</h3>
<h4>Ramón Guijarro</h4>
</div>
</div>
<p>Hoy en día usamos JavaScript para construir complejas aplicaciones web con una cantidad importante de lógica de negocio en el navegador, por lo que tomarse el testing en serio se convierte en una necesidad. Sin embargo en el mundo JavaScript hay una infinidad de herramientas diferentes para este propósito y testear aplicaciones en el navegador presenta algunos desafíos. Mocha, Chai, Jasmine, Ava, Sinon, Karma, Jest... ¿Qué son todas estas herramientas y qué relación tienen? ¿Cómo podemos testear código que utiliza APIs del navegador? ¿Cómo testeamos interfaces de usuario? ¿Cómo integramos los tests en nuestro proyecto?</p>
<p>En esta charla daremos un repaso al testeo de aplicaciones web JavaScript para tratar de responder a todas estas preguntas y algunas más.</p>
</div>
<div class="dark-box">
<div class="flex middle-xs margin-bottom">
<img class="rounded avatar margin-right" src="images/speakers/BelenAlbeza.jpg">
<div>
<h5>12:50 - 13:35</h5>
<h3>Mejorando como desarrolladores</h3>
<h4>Belén Albeza</h4>
</div>
</div>
<p>El mundo del front-end es vertiginoso y siempre hay mil y una cosas nuevas que aprender. ¿Cómo podemos formarnos y mejorar como desarrolladores sin abandonar a nuestra familia, amigos, aficiones, etc.? En esta charla veremos algunos consejos para ello, y cuestionaremos creencias y mitos comunes en la industria del desarrollo de software.</p>
</div>
<div class="light-box">
<h5>13:40 - 14:55</h5>
<h3>Comida</h3>
</div>
<div class="dark-box">
<div class="flex middle-xs margin-bottom">
<img class="rounded avatar margin-right" src="images/speakers/CarlosManas.jpg">
<div>
<h5>15:00 - 15:45</h5>
<h3>Dibujo artístico aplicado al maquetador web</h3>
<h4>Carlos Mañas</h4>
</div>
</div>
<p>Me gustaría animar a los maquetadores más aguerridos a hacer esquemas con papel y lápiz antes de enfrentarse a un trabajo de maquetación.</p>
<p>Para estos esquemas no necesitas gran cosa (todos sabemos dibujar un cuadrado y una línea) pero veo que mis compañeros no lo suelen tener como una opción. La palabra dibujo da como más miedo que <i>parallax</i> o <i>ajax</i>, y me gustaría cambiar eso.</p>
<p>El papel y el lápiz te permiten equivocarte y corregir super rápido, y casi sin consecuencias. Además, cuando separas la estructura del diseño es mucho más fácil modularizar componentes y tener una idea de conjunto de los elementos y de cómo se relacionan entre ellos.</p>
<p>Aparte, estos apuntes se te graban a fuego con una facilidad asombrosa con lo cual luego el trabajo va mucho más fluido, directo y enfocado. Y el tiempo que ahorra es loquísimo.</p>
<p>El título de la charla es un poco un chiste porque en 5º de carrera (yo hice Bellas Artes) el profesor que impartía "Dibujo artístico aplicado al diseño" no sabía dibujar. Y me ha parecido genial porque para estos apuntes no necesitas tener unos conocimientos especiales, pero sí perderle el miedo al papel.</p>
<p>En mi <a href="https://www.instagram.com/explore/tags/frontendnotes">cuenta de instagram</a> podéis ver algunos ejemplos de las notas que tomo en mi día a día.</p>
</div>
<div class="dark-box">
<div class="flex middle-xs margin-bottom">
<img class="rounded avatar margin-negative" src="images/speakers/JoanLeon.jpg">
<img class="rounded avatar margin-right" src="images/speakers/JorgeBarrachina.jpg">
<div>
<h5>15:50 - 16:35</h5>
<h3>El navegador no es un condesador de fluzo, y lo sabes... ¿o no?</h3>
<h4>Joan León y Jorge Barrachina</h4>
</div>
</div>
<p>Cuando pensamos en alguien que domina una materia, imaginamos a alguien que conoce perfectamente el entorno en el que trabaja. Ya que somos frontends, ¿conocemos realmente nuestro entorno natural, el navegador? ¿Sabemos cómo funciona?</p>
<p>Conocer cómo funcionan los navegadores de forma interna, las nuevas funcionalidades y APIs nos ayudará a conseguir lo que realmente es importante, un resultado mucho más optimizado para mejorar la experiencia de usuario. <i>La potencia sin control no sirve de nada</i>.</p>
<p>Ahora que conocemos los tips de las DevTools, es hora de adentrarnos en las entrañas de los navegadores... tenemos auténticas joyas como el Shader Editor para WebGL, el panel Canvas o StackTrace en el Network Panel. ¿Qué esconde <code>chrome://about</code>? ¿Qué nos aporta el engine Servo, Quantum CSS, Quantum DOM o Quantum Render?</p>
</div>
<div class="light-box">
<h5>16:40 - 17:10</h5>
<h3>Merienda</h3>
</div>
<div class="dark-box">
<div class="flex middle-xs margin-bottom">
<img class="rounded avatar margin-right" src="images/speakers/VicenteLucendo.jpg">
<div>
<h5>17:15 - 18:00</h5>
<h3>WebGL y shaders: programando luz</h3>
<h4>Vicente Lucendo</h4>
</div>
</div>
<p>Charla con una introducción donde se repasarán brevemente los requisitos para poder crear una escena 3D en el navegador, y donde posteriormente programaremos un shader sencillo que dará una pequeña muestra de todas las posibilidades que abre este tipo de programación.</p>
<ul>
<li>Qué es WebGL.</li>
<li>Diferencias entre dibujar con la CPU y con la GPU.</li>
<li>Elementos esenciales de una escena.</li>
<li>Qué son los shaders y ejemplos de lo que se puede hacer con ellos.</li>
<li>Vertex shader.</li>
<li>Fragment shader.</li>
<li>Iluminar un objeto paso a paso, con álgebra, sin la ayuda de la funcionalidad de Three.js.</li>
<li>Cambiar el efecto para que parezca "toon shader", al estilo de algunos juegos de Nintendo.</li>
<li>Opcionalmente, si quedara tiempo, podría mostrarse cómo hacer otros efectos artísticos.</li>
</ul>
</div>
<div class="dark-box">
<div class="flex middle-xs margin-bottom">
<img class="rounded avatar margin-right" src="images/speakers/EduardoSada.jpg">
<div>
<h5>18:05 - 18:50</h5>
<h3>Cuida tus modales</h3>
<h4>Eduardo Sada</h4>
</div>
</div>
<p>«Modales», «popups», «ventanitas», llevan con nosotros desde el inicio de la web. Fueron odiadas en los 90, y hoy son la solución a todos nuestros problemas. ¿Quién no ha escuchado a nuestro UX amigo decir «aquí abrimos una modal y ya está»?</p>
<p>¿Te has preguntado alguna vez cuántas maneras hay de crear estas «modales» y cuál es la mejor? Yo sí. No sólo me lo he preguntado sino que también he sufrido encontrando la respuesta.</p>
<p>Desde UX, accesibilidad, performance, y orientación (o no) a componentes. Baja los codos de la mesa, sácate el dedo de la nariz, y pon ese aria-hidden en ese div. Cuida tus modales.</p>
</div>
<div class="light-box">
<h5>18:55 - 19:15</h5>
<h3>Despedida</h3>
</div>
<div class="light-box">
<h5>19:20 - 20:45</h5>
<h3>Networking</h3>
</div>
</div>
</section>
<!-- <section id="c4p" class="c4p">
<div class="container container-fluid">
<div class="row">
<div class="col-xs-12 col-md-5">
<img class="pic" src="images/event/01s.jpg" />
<img class="pic" src="images/event/04s.jpg" />
<img class="pic" src="images/event/06s.jpg" />
</div>
<div class="col-xs-12 col-md-7">
<h1>Call for Proposals</h1>
<div class="separator"></div>
<p><strong>Si estás pensando en mandar una propuesta y ya lo tienes todo claro, ¡muchas gracias y adelante! Y si se te ha pasado por
la cabeza pero no terminas de atreverte a dar el paso, por favor, no dudes en contactar con nosotros y te ayudaremos y
aconsejaremos en la medida de nuestras posibilidades. Todos tenemos cosas interesantes que aportar.</strong></p>
<p>He aquí unas pequeñas indicaciones para transmitir nuestra visión y ayudarte un poco más a elaborar tu idea.</p>
<ul class="list">
<li><span>Ten en cuenta que las charlas han de durar como mucho 45 minutos (preferiblemente 40 más un breve turno de preguntas).
Apostaremos por propuestas de charlas autocontenidas, concretas y con descripciones suficientemente detalladas.</span></li>
<li><span>Queremos hacer énfasis en que este es un evento transversal, y no queremos que sea un monográfico, sino lo más diverso
posible. ¡Ojo! Nos encanta el código, y también queremos tener las tradicionales charlas eminentemente técnicas, pero nos gustaría
abrir el espectro y hacer honor a nuestro nombre. Vamos a valorar también la originalidad, las nuevas experiencias
que podemos aportar como desarrolladores, la interacción con otras disciplinas y la visión social y de futuro.</span></li>
<li><span>Desgraciadamente no podremos dar cabida a charlas demasiado genéricas, del tipo "iniciación a..." o "cómo funciona mi framework favorito".
Aunque puedan ser excelentes en otros contextos, no se adaptan bien a un evento como éste, en el que disponemos de un tiempo muy
limitado para cada ponente.</span></li>
</ul>
<p>Nuestro objetivo es que FrontFest sea una experiencia interesante para todos los asistentes y la comunidad en
general, donde podamos inspirarnos, recabar ideas y aprender de gente experimentada, pero también que nos permita descubrir nuevos talentos del mundo del
frontend.</p>
<p><strong>El Call for Proposals finalizó el 19 de noviembre.</strong></p>
</div>
</div>
</div>
</section> -->
<section id="tickets" class="tickets">
<div class="container container-fluid background-time">
<div class="row">
<div class="col-xs-12">
<h1>Entradas</h1>
</div>
<div class="col-lg-4 col-md-6 col-xs-12">
<div class="ticket">
<div class="flex middle-xs">
<img src="images/eagle.svg" class="ticket-icon">
<div class="margin-left">
<h2>Early Bird</h2>
<small>25 entradas</small>
</div>
</div>
<p>Disponibles a partir del <strong>12 de diciembre</strong> a las <strong>12 del mediodía</strong>.</p>
<ul class="list">
<li><span>Acceso a las 8 charlas en un único track</span></li>
<li><span>Desayuno, comida y merienda</span></li>
<li><span>Bolsa de bienvenida</span></li>
</ul>
<div class="flex margin-top between-xs middle-xs">
<span class="price">25€</span>
<span title="Comprar entrada Early Bird" class="btn disabled">Agotadas :(</span>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 col-xs-12">
<div class="ticket">
<div class="flex middle-xs">
<img src="images/users-group.svg" class="ticket-icon">
<div class="margin-left">
<h2>General</h2>
<small>300 entradas</small>
</div>
</div>
<p>Disponibles a partir del <strong>8 de enero</strong> a las <strong>12 del mediodía</strong>.</p>
<ul class="list">
<li><span>Acceso a las 8 charlas en un único track</span></li>
<li><span>Desayuno, comida y merienda</span></li>
<li><span>Bolsa de bienvenida</span></li>
</ul>
<div class="flex margin-top between-xs middle-xs">
<span class="price">40€</span>
<span title="Comprar entrada general" class="btn disabled">Agotadas :(</span>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 col-xs-12">
<div class="ticket">
<div class="flex middle-xs">
<img src="images/students-cap.svg" class="ticket-icon">
<div class="margin-left">
<h2>Estudiante *</h2>
<small>25 entradas</small>
</div>
</div>
<p>Disponibles a partir del <strong>8 de enero</strong> a las <strong>12 del mediodía</strong>.</p>
<ul class="list">
<li><span>Acceso a las 8 charlas en un único track</span></li>
<li><span>Desayuno, comida y merienda</span></li>
<li><span>Bolsa de bienvenida</span></li>
</ul>
<div class="flex margin-top between-xs middle-xs">
<span class="price">25€</span>
<span title="Comprar entrada con descuento de estudiante" class="btn disabled">Agotadas :(</span>
</div>
</div>
</div>
<div class="col-xs-12 margin-top bold">
* A los portadores de una entrada de estudiante se les requerirá presentar, el mismo día del evento, una fotocopia de la matrícula
(o documento similar) que acredite la condición de estudiante durante el curso actual (2017-18). Más info <a target="_blank" href="http://frontfest.es/blog/descuento-estudiantes.html">aquí</a>.
</div>
</div>
</div>
</section>
<section id="sponsors" class="section sponsors">
<div class="container container-fluid">
<div class="row">
<div class="col-xs-12">
<h1>Patrocinadores</h1>
<div class="separator margin-bottom"></div>
<h2><span class="span-platinum">Platinum</span> <span class="span-black">Sponsors</span></h2>
<div class="platinum-sponsors">
<a target="_blank" href="https://www.paradigmadigital.com">
<img src="images/sponsors/paradigma.png" title="Paradigma">
</a>
<a target="_blank" href="https://machiina.com">
<img src="images/sponsors/machiina.svg" title="Machiina">
</a>
</div>
<h2><span class="span-gold">Gold</span> <span class="span-black">Sponsors</span></h2>
<div class="gold-sponsors">
<a target="_blank" href="http://www.fictizia.com/">
<img src="images/sponsors/fictizia.png" title="Fictizia">
</a>
<a target="_blank" href="http://www.schibsted.es/">
<img src="images/sponsors/schibsted.png" title="Schibsted">
</a>
<a target="_blank" href="https://www.tuenti.es/">
<img src="images/sponsors/tuenti.jpg" title="Tuenti">
</a>
<a target="_blank" href="https://ontruck.com/">
<img src="images/sponsors/ontruck.svg" title="ontruck">
</a>
</div>
<h2><span class="span-silver">Silver</span> <span class="span-black">Sponsors</span></h2>
<div class="silver-sponsors">
<a target="_blank" href="https://www.intelygenz.es">
<img src="images/sponsors/intelygenz.png" title="Intelygenz">
</a>
<a target="_blank" href="https://www.ikoula.es">
<img src="images/sponsors/ikoula.png" title="Ikoula">
</a>
<a target="_blank" href="http://kaleidos.net">
<img src="images/sponsors/kaleidos.png" title="Kaleidos">
</a>
<a target="_blank" href="http://www.opensistemas.com">
<img src="images/sponsors/opensistemas.png" title="Open Sistemas">
</a>
<a target="_blank" href="https://the-cocktail.com">
<img src="images/sponsors/thecocktail.png" title="The Cocktail">
</a>
<a target="_blank" href="https://www.mozilla.org">
<img src="images/sponsors/mozilla.svg" title="Mozilla">
</a>
</div>
<h2><span class="span-black">Patrocinio en especies</span></h2>
<div class="sponsors-in-kind">
<a target="_blank" href="https://egghead.io">
<img src="images/sponsors/egghead.png" title="egghead">
</a>
<a target="_blank" href="http://gsoproduccion.es/">
<img src="images/sponsors/gso.png" title="GSO Producciones">
</a>
<a target="_blank" href="http://codan.es/">
<img src="images/sponsors/codan.jpg" title="Conchas Codan">
</a>
</div>
<h2><span class="span-black">Colaboradores</span></h2>
<div class="collaborators-sponsors">
<a target="_blank" href="https://www.w3c.es">
<img src="images/sponsors/w3c.png" title="W3C">
</a>
</div>
</div>
</div>
</div>
</section>
<section id="localizacion" class="section bg-salmon-2">
<div class="container container-fluid">
<div class="row">
<div class="col-xs-5">
<h1>Localización</h1>
<div class="separator"></div>
</div>
</div>
<div class="row margin-top middle-xs">
<div class="col-xs-12 col-md-5">
<img class="width-full" src="images/lanave-venue.jpg">
</div>
<div class="col-xs-12 col-md-3">
<div class="center-xs margin-top margin-bottom">
<a href="http://www.lanavemadrid.com/" target="_blank"><img class="width-200" src="images/lanave-logo.png"></a>
<p class="large-text black-text"><strong>Calle Cifuentes, 5</strong><br />
Distrito Villaverde<br />
28021 Madrid</p>
</div>
</div>
<div class="col-xs-12 col-md-3 bg-salmon-2-dark">
<p>
<strong>Cercanías C5</strong><br />
Puente Alcocer
</p>
<p>
<strong>Metro L3</strong><br />
Villaverde Bajo Cruce
</p>
<p>
<strong>Bus (EMT) 59 / 79 / N13</strong><br />
Av. Andalucia - Alcocer
</p>
</div>
</div>
</div>
</section>
<section id="mapid"></section>
</main>
<footer class="footer">
<div class="container container-fluid">
<div class="row">
<div class="col-xs-12 col-md-2">
<img alt="Logo de FrontFest" class="width-full max-width-200" src="images/frontfest-white.svg" />
<p><strong>FrontFest</strong> © 2018</p>
</div>
<div class="col-xs-12 col-md-offset-1 col-md-9">
<p>Para cualquier consulta, duda o sugerencia, no dudes en ponerte en contacto con nosotros mediante un <a title="DM en Twitter" class="link" href="https://twitter.com/frontfest">DM
en Twitter</a> o bien escribiéndonos un email a <a class="link" title="Nuestro email" href="mailto:frontfest@gmail.com">frontfest@gmail.com</a>.</p>
<p class="flex middle-xs">
<img class="small-icon" src="images/group.svg" /><a href="codigo-conducta.html#team">Quiénes somos</a>
<img class="small-icon margin-left" src="images/github-logo.svg" /><a target="_blank" href="https://github.com/frontfest/frontfest.github.io">Código fuente</a>
</p>
</div>
</div>
</div>
</footer>
<script defer src="https://unpkg.com/leaflet@1.3.4/dist/leaflet.js"
integrity="sha512-nMMmRyTVoLYqjP9hrbed9S+FzjZHW5gY1TWCHA5ckwXZBadntCNs8kEqAWdrb9O7rxbCaA4lKTIWjDXZxflOcA=="
crossorigin=""></script>
<script src="scripts/app.js"></script>
</body>
</html>