# Indico front-end: From spaghetti to lasagna

- Institution: CERN
- Department: Developers@CERN Forum
- Speaker: Alejandro Avilés
- Year: 2017
- Language: English
- Source: [CERN](https://videos.cern.ch/record/3014305)
- Licence: [CERN](http://copyright.web.cern.ch)
- Who can watch: Teens profiles and older (sources give no ratings; placed by Invisible Network from the source's own words)

We will present how we transitioned from legacy spaghetti UI code to a more coherent, easier to understand and maintain ecosystem of front-end technologies and facilities with a strong emphasis in reusable components. In particular, we will share with you: 1) how we use Sass to maintain our home-baked CSS, 2) how we survive in 2017 without front-end Javascript frameworks, and 3) how we use template macros and WTForms for generating consistent HTML transparently..

0:00:00 Slide 1

0:02:12 Slide 2

0:02:46 Slide 3

0:03:41 Slide 4

0:04:15 Slide 5

0:04:31 Slide 6

0:04:35 Slide 7

0:04:58 Slide 8

0:05:21 Slide 9

0:05:33 Slide 10

0:06:11 Slide 11

0:06:42 Slide 12

0:07:17 Slide 13

0:07:21 Slide 14

0:07:25 Slide 15

0:07:40 Slide 16

0:07:44 Slide 17

0:07:48 Slide 18

0:07:52 Slide 19

0:08:00 Slide 20

0:08:04 Slide 21

0:08:23 Slide 22

0:08:27 Slide 23

0:08:34 Slide 24

0:08:42 Slide 25

0:08:46 Slide 26

0:08:50 Slide 27

0:08:54 Slide 28

0:08:58 Slide 29

0:09:05 Slide 30

0:09:09 Slide 31

0:09:13 Slide 32

0:09:17 Slide 33

0:09:25 Slide 34

0:09:29 Slide 35

0:09:34 Slide 36

0:09:56 Slide 37

0:10:23 Slide 38

0:10:50 Slide 39

0:11:17 Slide 40

0:11:28 Slide 41

0:12:30 Slide 42

0:12:53 Slide 43

0:13:05 Slide 44

0:13:17 Slide 45

0:13:55 Slide 46

0:14:11 Slide 47

0:14:22 Slide 48

0:15:05 Slide 49

0:15:36 Slide 50

0:15:51 Slide 51

0:16:18 Slide 52

0:16:30 Slide 53

0:16:34 Slide 54

0:16:42 Slide 55

0:17:24 Slide 56

0:17:36 Slide 57

0:17:43 Slide 58

0:18:03 Slide 59

0:18:07 Slide 60

0:18:14 Slide 61

0:18:22 Slide 62

0:18:26 Slide 63

0:18:34 Slide 64

0:18:41 Slide 65

0:18:49 Slide 66

0:19:55 Slide 67

0:20:22 Slide 68

0:20:53 Slide 69

0:20:57 Slide 70

0:21:01 Slide 71

0:21:24 Slide 72

0:22:10 Slide 73

0:22:37 Slide 74

0:22:41 Slide 75

0:22:45 Slide 76

0:22:49 Slide 77

0:23:28 Slide 78

0:24:14 Slide 79

0:24:26 Slide 80

0:24:37 Slide 81

0:24:41 Slide 82

0:25:12 Slide 83

0:25:43 Slide 84

0:25:58 Slide 85

0:26:41…

## Lectures

1. [Indico front-end: From spaghetti to lasagna](https://invisiblenetwork.ai/learn/cern/3014305/2bfb33684ef4), 30 min (CERN's player)