PageSourceSearch

https://qped-eu.github.io/

html qped-eu.github.io collected 2026-10-03 09:48:24 UTC 44,431 bytes, 1,168 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charSet="utf-8"/>
5    <meta http-equiv="x-ua-compatible" content="ie=edge"/>
6    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
7    <meta name="generator" content="Gatsby 4.25.7"/>
8    <meta data-react-helmet="true" charSet="utf-8"/>
9    <meta data-react-helmet="true" name="description" content="QPED: Quality-focussed Programming Education"/>
10    <style data-emotion="css-global o6gwfi">html {
11        -webkit-font-smoothing: antialiased;
12        -moz-osx-font-smoothing: grayscale;
13        box-sizing: border-box;
14        -webkit-text-size-adjust: 100%;
15    }
16
17    *, *::before, *::after {
18        box-sizing: inherit;
19    }
20
21    strong, b {
22        font-weight: 700;
23    }
24
25    body {
26        margin: 0;
27        color: rgba(0, 0, 0, 0.87);
28        font-family: "Roboto", "Helvetica", "Arial", sans-serif;
29        font-weight: 400;
30        font-size: 1rem;
31        line-height: 1.5;
32        letter-spacing: 0.00938em;
33        background-color: #fff;
34    }
35
36    @media print {
37        body {
38            background-color: #fff;
39        }
40    }
41
42    body::backdrop {
43        background-color: #fff;
44    }</style>
45    <style data-emotion="css 17ex9l5 i6s8oy 13gsxkh 145tzfz vubbuv 1p86egf eazhar 1d3jr1u 1xvs66j 1wxaqej 2pvxon kkens6 1oevxvn co3dvv ybmzf6 zi638n uj3p8u ldo4d5 1irqs2i 1c0cfyw 1m7nlmx isbt42 15j76c0 b0jfc8 9l3uo3 1etv89n 39bbo6 1ta0opo 1b1jvye 6flbmm 1is0dyx">.css-17ex9l5 {
46        background-color: #fff;
47        color: rgba(0, 0, 0, 0.87);
48        -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
49        transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
50        box-shadow: none;
51        display: -webkit-box;
52        display: -webkit-flex;
53        display: -ms-flexbox;
54        display: flex;
55        -webkit-flex-direction: column;
56        -ms-flex-direction: column;
57        flex-direction: column;
58        width: 100%;
59        box-sizing: border-box;
60        -webkit-flex-shrink: 0;
61        -ms-flex-negative: 0;
62        flex-shrink: 0;
63        position: fixed;
64        z-index: 1100;
65        top: 0;
66        left: auto;
67        right: 0;
68        background-color: #E0BE36;
69        color: rgba(0, 0, 0, 0.87);
70        background-color: transparent;
71        -webkit-transition: all 0.5s;
72        transition: all 0.5s;
73        color: white;
74    }
75
76    @media print {
77        .css-17ex9l5 {
78            position: absolute;
79        }
80    }
81
82    .css-i6s8oy {
83        position: relative;
84        display: -webkit-box;
85        display: -webkit-flex;
86        display: -ms-flexbox;
87        display: flex;
88        -webkit-align-items: center;
89        -webkit-box-align: center;
90        -ms-flex-align: center;
91        align-items: center;
92        padding-left: 16px;
93        padding-right: 16px;
94        min-height: 56px;
95    }
96
97    @media (min-width: 600px) {
98        .css-i6s8oy {
99            padding-left: 24px;
100            padding-right: 24px;
101        }
102    }
103
104    @media (min-width: 0px) {
105        @media (orientation: landscape) {
106            .css-i6s8oy {
107                min-height: 48px;
108            }
109        }
110    }
111
112    @media (min-width: 600px) {
113        .css-i6s8oy {
114            min-height: 64px;
115        }
116    }
117
118    .css-13gsxkh {
119        margin: 0;
120        font: inherit;
121        color: #E0BE36;
122        -webkit-text-decoration: underline;
123        text-decoration: underline;
124        text-decoration-color: rgba(224, 190, 54, 0.4);
125    }
126
127    .css-13gsxkh:hover {
128        text-decoration-color: inherit;
129    }
130
131    .css-145tzfz {
132        display: -webkit-inline-box;
133        display: -webkit-inline-flex;
134        display: -ms-inline-flexbox;
135        display: inline-flex;
136        -webkit-align-items: center;
137        -webkit-box-align: center;
138        -ms-flex-align: center;
139        align-items: center;
140        -webkit-box-pack: center;
141        -ms-flex-pack: center;
142        -webkit-justify-content: center;
143        justify-content: center;
144        position: relative;
145        box-sizing: border-box;
146        -webkit-tap-highlight-color: transparent;
147        background-color: transparent;
148        outline: 0;
149        border: 0;
150        margin: 0;
151        border-radius: 0;
152        padding: 0;
153        cursor: pointer;
154        -webkit-user-select: none;
155        -moz-user-select: none;
156        -ms-user-select: none;
157        user-select: none;
158        vertical-align: middle;
159        -moz-appearance: none;
160        -webkit-appearance: none;
161        -webkit-text-decoration: none;
162        text-decoration: none;
163        color: inherit;
164        text-align: center;
165        -webkit-flex: 0 0 auto;
166        -ms-flex: 0 0 auto;
167        flex: 0 0 auto;
168        font-size: 1.5rem;
169        padding: 8px;
170        border-radius: 50%;
171        overflow: visible;
172        color: rgba(0, 0, 0, 0.54);
173        -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
174        transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
175        margin-right: -12px;
176        color: inherit;
177    }
178
179    .css-145tzfz::-moz-focus-inner {
180        border-style: none;
181    }
182
183    .css-145tzfz.Mui-disabled {
184        pointer-events: none;
185        cursor: default;
186    }
187
188    @media print {
189        .css-145tzfz {
190            -webkit-print-color-adjust: exact;
191            color-adjust: exact;
192        }
193    }
194
195    .css-145tzfz:hover {
196        background-color: rgba(0, 0, 0, 0.04);
197    }
198
199    @media (hover: none) {
200        .css-145tzfz:hover {
201            background-color: transparent;
202        }
203    }
204
205    .css-145tzfz.Mui-disabled {
206        background-color: transparent;
207        color: rgba(0, 0, 0, 0.26);
208    }
209
210    @media (min-width: 0px) {
211        .css-145tzfz {
212            display: block;
213        }
214    }
215
216    @media (min-width: 900px) {
217        .css-145tzfz {
218            display: none;
219        }
220    }
221
222    .css-vubbuv {
223        -webkit-user-select: none;
224        -moz-user-select: none;
225        -ms-user-select: none;
226        user-select: none;
227        width: 1em;
228        height: 1em;
229        display: inline-block;
230        fill: currentColor;
231        -webkit-flex-shrink: 0;
232        -ms-flex-negative: 0;
233        flex-shrink: 0;
234        -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
235        transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
236        font-size: 1.5rem;
237    }
238
239    .css-1p86egf {
240        display: -webkit-box;
241        display: -webkit-flex;
242        display: -ms-flexbox;
243        display: flex;
244        -webkit-flex-direction: row;
245        -ms-flex-direction: row;
246        flex-direction: row;
247        -webkit-align-items: center;
248        -webkit-box-align: center;
249        -ms-flex-align: center;
250        align-items: center;
251    }
252
253    .css-1p86egf > :not(style):not(style) {
254        margin: 0;
255    }
256
257    .css-1p86egf > :not(style) ~ :not(style) {
258        margin-left: 16px;
259    }
260
261    @media (min-width: 0px) {
262        .css-1p86egf {
263            display: none;
264        }
265    }
266
267    @media (min-width: 900px) {
268        .css-1p86egf {
269            display: block;
270        }
271    }
272
273    .css-eazhar {
274        display: -webkit-inline-box;
275        display: -webkit-inline-flex;
276        display: -ms-inline-flexbox;
277        display: inline-flex;
278        -webkit-align-items: center;
279        -webkit-box-align: center;
280        -ms-flex-align: center;
281        align-items: center;
282        -webkit-box-pack: center;
283        -ms-flex-pack: center;
284        -webkit-justify-content: center;
285        justify-content: center;
286        position: relative;
287        box-sizing: border-box;
288        -webkit-tap-highlight-color: transparent;
289        background-color: transparent;
290        outline: 0;
291        border: 0;
292        margin: 0;
293        border-radius: 0;
294        padding: 0;
295        cursor: pointer;
296        -webkit-user-select: none;
297        -moz-user-select: none;
298        -ms-user-select: none;
299        user-select: none;
300        vertical-align: middle;
301        -moz-appearance: none;
302        -webkit-appearance: none;
303        -webkit-text-decoration: none;
304        text-decoration: none;
305        color: inherit;
306        font-family: "Roboto", "Helvetica", "Arial", sans-serif;
307        font-weight: 500;
308        font-size: 0.875rem;
309        line-height: 1.75;
310        letter-spacing: 0.02857em;
311        text-transform: uppercase;
312        min-width: 64px;
313        padding: 6px 8px;
314        border-radius: 4px;
315        -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
316        transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
317        color: #E0BE36;
318        color: inherit;
319    }
320
321    .css-eazhar::-moz-focus-inner {
322        border-style: none;
323    }
324
325    .css-eazhar.Mui-disabled {
326        pointer-events: none;
327        cursor: default;
328    }
329
330    @media print {
331        .css-eazhar {
332            -webkit-print-color-adjust: exact;
333            color-adjust: exact;
334        }
335    }
336
337    .css-eazhar:hover {
338        -webkit-text-decoration: none;
339        text-decoration: none;
340        background-color: rgba(224, 190, 54, 0.04);
341    }
342
343    @media (hover: none) {
344        .css-eazhar:hover {
345            background-color: transparent;
346        }
347    }
348
349    .css-eazhar.Mui-disabled {
350        color: rgba(0, 0, 0, 0.26);
351    }
352
353    .css-eazhar:hover {
354        -webkit-text-decoration: underline;
355        text-decoration: underline;
356    }
357
358    .css-1d3jr1u {
359        height: 50vh;
360        overflow: hidden;
361        position: relative;
362        margin: 0px;
363        padding: 0px;
364    }
365
366    .css-1xvs66j {
367        box-sizing: border-box;
368        display: -webkit-box;
369        display: -webkit-flex;
370        display: -ms-flexbox;
371        display: flex;
372        -webkit-box-flex-wrap: wrap;
373        -webkit-flex-wrap: wrap;
374        -ms-flex-wrap: wrap;
375        flex-wrap: wrap;
376        width: 100%;
377        -webkit-flex-direction: column;
378        -ms-flex-direction: column;
379        flex-direction: column;
380        margin-top: -16px;
381        width: calc(100% + 16px);
382        margin-left: -16px;
383        -webkit-align-items: center;
384        -webkit-box-align: center;
385        -ms-flex-align: center;
386        align-items: center;
387        -webkit-box-pack: center;
388        -ms-flex-pack: center;
389        -webkit-justify-content: center;
390        justify-content: center;
391        background-image: url(/background.jpg);
392        background-repeat: no-repeat;
393        -webkit-background-size: cover;
394        background-size: cover;
395        -webkit-background-position: top;
396        background-position: top;
397        width: 100%;
398        color: white;
399        padding: 16px;
400        -webkit-transition: opacity 1.5s ease-in-out;
401        transition: opacity 1.5s ease-in-out;
402        height: 100%;
403        position: absolute;
404        margin: 0px;
405    }
406
407    .css-1xvs66j > .MuiGrid-item {
408        max-width: none;
409    }
410
411    .css-1xvs66j > .MuiGrid-item {
412        padding-top: 16px;
413    }
414
415    .css-1xvs66j > .MuiGrid-item {
416        padding-left: 16px;
417    }
418
419    .css-1wxaqej {
420        box-sizing: border-box;
421        margin: 0;
422        -webkit-flex-direction: row;
423        -ms-flex-direction: row;
424        flex-direction: row;
425    }
426
427    .css-2pvxon {
428        margin: 0;
429        font-family: "Roboto", "Helvetica", "Arial", sans-serif;
430        font-weight: 400;
431        font-size: 3rem;
432        line-height: 1.167;
433        letter-spacing: 0em;
434        text-align: center;
435    }
436
437    .css-kkens6 {
438        background-color: #D45113;
439        min-width: 340px;
440        min-height: 2px;
441    }
442
443    .css-1oevxvn {
444        margin: 0;
445        font-family: "Roboto", "Helvetica", "Arial", sans-serif;
446        font-weight: 500;
447        font-size: 1.25rem;
448        line-height: 1.6;
449        letter-spacing: 0.0075em;
450        text-align: center;
451    }
452
453    .css-co3dvv {
454        width: 100%;
455        margin-left: auto;
456        box-sizing: border-box;
457        margin-right: auto;
458        display: block;
459        padding-left: 16px;
460        padding-right: 16px;
461        padding-top: 64px;
462        padding-left: 16px;
463        padding-right: 16px;
464        padding-bottom: 48px;
465    }
466
467    @media (min-width: 600px) {
468        .css-co3dvv {
469            padding-left: 24px;
470            padding-right: 24px;
471        }
472    }
473
474    @media (min-width: 900px) {
475        .css-co3dvv {
476            max-width: 900px;
477        }
478    }
479
480    .css-ybmzf6 {
481        margin: 0;
482        font-family: "Roboto", "Helvetica", "Arial", sans-serif;
483        font-weight: 300;
484        font-size: 3.75rem;
485        line-height: 1.2;
486        letter-spacing: -0.00833em;
487        text-align: center;
488        margin-bottom: 0.35em;
489        color: rgba(0, 0, 0, 0.87);
490    }
491
492    .css-zi638n {
493        margin: 0;
494        font-family: "Roboto", "Helvetica", "Arial", sans-serif;
495        font-weight: 400;
496        font-size: 1rem;
497        line-height: 1.5;
498        letter-spacing: 0.00938em;
499        text-align: center;
500        margin-bottom: 0.35em;
501        color: rgba(0, 0, 0, 0.6);
502    }
503
504    .css-uj3p8u {
505        margin: 0;
506        font-family: "Roboto", "Helvetica", "Arial", sans-serif;
507        font-weight: 400;
508        font-size: 1rem;
509        line-height: 1.5;
510        letter-spacing: 0.00938em;
511        text-align: center;
512        color: rgba(0, 0, 0, 0.6);
513    }
514
515    .css-ldo4d5 {
516        display: -webkit-box;
517        display: -webkit-flex;
518        display: -ms-flexbox;
519        display: flex;
520        -webkit-box-pack: center;
521        -ms-flex-pack: center;
522        -webkit-justify-content: center;
523        justify-content: center;
524        width: 100%;
525    }
526
527    .css-1irqs2i {
528        display: -webkit-inline-box;
529        display: -webkit-inline-flex;
530        display: -ms-inline-flexbox;
531        display: inline-flex;
532        -webkit-align-items: center;
533        -webkit-box-align: center;
534        -ms-flex-align: center;
535        align-items: center;
536        -webkit-box-pack: center;
537        -ms-flex-pack: center;
538        -webkit-justify-content: center;
539        justify-content: center;
540        position: relative;
541        box-sizing: border-box;
542        -webkit-tap-highlight-color: transparent;
543        background-color: transparent;
544        outline: 0;
545        border: 0;
546        margin: 0;
547        border-radius: 0;
548        padding: 0;
549        cursor: pointer;
550        -webkit-user-select: none;
551        -moz-user-select: none;
552        -ms-user-select: none;
553        user-select: none;
554        vertical-align: middle;
555        -moz-appearance: none;
556        -webkit-appearance: none;
557        -webkit-text-decoration: none;
558        text-decoration: none;
559        color: inherit;
560        font-family: "Roboto", "Helvetica", "Arial", sans-serif;
561        font-weight: 500;
562        font-size: 0.9375rem;
563        line-height: 1.75;
564        letter-spacing: 0.02857em;
565        text-transform: uppercase;
566        min-width: 64px;
567        padding: 8px 22px;
568        border-radius: 4px;
569        -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
570        transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
571        color: #fff;
572        background-color: #D45113;
573        box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
574    }
575
576    .css-1irqs2i::-moz-focus-inner {
577        border-style: none;
578    }
579
580    .css-1irqs2i.Mui-disabled {
581        pointer-events: none;
582        cursor: default;
583    }
584
585    @media print {
586        .css-1irqs2i {
587            -webkit-print-color-adjust: exact;
588            color-adjust: exact;
589        }
590    }
591
592    .css-1irqs2i:hover {
593        -webkit-text-decoration: none;
594        text-decoration: none;
595        background-color: rgb(148, 56, 13);
596        box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
597    }
598
599    @media (hover: none) {
600        .css-1irqs2i:hover {
601            background-color: #D45113;
602        }
603    }
604
605    .css-1irqs2i:active {
606        box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
607    }
608
609    .css-1irqs2i.Mui-focusVisible {
610        box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
611    }
612
613    .css-1irqs2i.Mui-disabled {
614        color: rgba(0, 0, 0, 0.26);
615        box-shadow: none;
616        background-color: rgba(0, 0, 0, 0.12);
617    }
618
619    .css-1c0cfyw {
620        width: 100%;
621        margin-left: auto;
622        box-sizing: border-box;
623        margin-right: auto;
624        display: block;
625        padding-left: 16px;
626        padding-right: 16px;
627    }
628
629    @media (min-width: 600px) {
630        .css-1c0cfyw {
631            padding-left: 24px;
632            padding-right: 24px;
633        }
634    }
635
636    @media (min-width: 900px) {
637        .css-1c0cfyw {
638            max-width: 900px;
639        }
640    }
641
642    .css-1m7nlmx {
643        box-sizing: border-box;
644        display: -webkit-box;
645        display: -webkit-flex;
646        display: -ms-flexbox;
647        display: flex;
648        -webkit-box-flex-wrap: wrap;
649        -webkit-flex-wrap: wrap;
650        -ms-flex-wrap: wrap;
651        flex-wrap: wrap;
652        width: 100%;
653        -webkit-flex-direction: column;
654        -ms-flex-direction: column;
655        flex-direction: column;
656        margin-top: -32px;
657        width: calc(100% + 32px);
658        margin-left: -32px;
659    }
660
661    .css-1m7nlmx > .MuiGrid-item {
662        max-width: none;
663    }
664
665    .css-1m7nlmx > .MuiGrid-item {
666        padding-top: 32px;
667    }
668
669    .css-1m7nlmx > .MuiGrid-item {
670        padding-left: 32px;
671    }
672
673    .css-isbt42 {
674        box-sizing: border-box;
675        display: -webkit-box;
676        display: -webkit-flex;
677        display: -ms-flexbox;
678        display: flex;
679        -webkit-box-flex-wrap: wrap;
680        -webkit-flex-wrap: wrap;
681        -ms-flex-wrap: wrap;
682        flex-wrap: wrap;
683        width: 100%;
684        -webkit-flex-direction: row;
685        -ms-flex-direction: row;
686        flex-direction: row;
687        margin-top: -16px;
688        width: calc(100% + 16px);
689        margin-left: -16px;
690    }
691
692    .css-isbt42 > .MuiGrid-item {
693        padding-top: 16px;
694    }
695
696    .css-isbt42 > .MuiGrid-item {
697        padding-left: 16px;
698    }
699
700    .css-15j76c0 {
701        box-sizing: border-box;
702        margin: 0;
703        -webkit-flex-direction: row;
704        -ms-flex-direction: row;
705        flex-direction: row;
706        -webkit-flex-basis: 100%;
707        -ms-flex-preferred-size: 100%;
708        flex-basis: 100%;
709        -webkit-box-flex: 0;
710        -webkit-flex-grow: 0;
711        -ms-flex-positive: 0;
712        flex-grow: 0;
713        max-width: 100%;
714    }
715
716    @media (min-width: 600px) {
717        .css-15j76c0 {
718            -webkit-flex-basis: 100%;
719            -ms-flex-preferred-size: 100%;
720            flex-basis: 100%;
721            -webkit-box-flex: 0;
722            -webkit-flex-grow: 0;
723            -ms-flex-positive: 0;
724            flex-grow: 0;
725            max-width: 100%;
726        }
727    }
728
729    @media (min-width: 900px) {
730        .css-15j76c0 {
731            -webkit-flex-basis: 100%;
732            -ms-flex-preferred-size: 100%;
733            flex-basis: 100%;
734            -webkit-box-flex: 0;
735            -webkit-flex-grow: 0;
736            -ms-flex-positive: 0;
737            flex-grow: 0;
738            max-width: 100%;
739        }
740    }
741
742    @media (min-width: 1200px) {
743        .css-15j76c0 {
744            -webkit-flex-basis: 100%;
745            -ms-flex-preferred-size: 100%;
746            flex-basis: 100%;
747            -webkit-box-flex: 0;
748            -webkit-flex-grow: 0;
749            -ms-flex-positive: 0;
750            flex-grow: 0;
751            max-width: 100%;
752        }
753    }
754
755    @media (min-width: 1536px) {
756        .css-15j76c0 {
757            -webkit-flex-basis: 100%;
758            -ms-flex-preferred-size: 100%;
759            flex-basis: 100%;
760            -webkit-box-flex: 0;
761            -webkit-flex-grow: 0;
762            -ms-flex-positive: 0;
763            flex-grow: 0;
764            max-width: 100%;
765        }
766    }
767
768    .css-b0jfc8 {
769        margin: 0;
770        font-family: "Roboto", "Helvetica", "Arial", sans-serif;
771        font-weight: 400;
772        font-size: 2.125rem;
773        line-height: 1.235;
774        letter-spacing: 0.00735em;
775        text-align: center;
776        margin-bottom: 0.35em;
777    }
778
779    .css-9l3uo3 {
780        margin: 0;
781        font-family: "Roboto", "Helvetica", "Arial", sans-serif;
782        font-weight: 400;
783        font-size: 1rem;
784        line-height: 1.5;
785        letter-spacing: 0.00938em;
786    }
787
788    .css-1etv89n {
789        box-sizing: border-box;
790        margin: 0;
791        -webkit-flex-direction: row;
792        -ms-flex-direction: row;
793        flex-direction: row;
794        -webkit-flex-basis: 100%;
795        -ms-flex-preferred-size: 100%;
796        flex-basis: 100%;
797        -webkit-box-flex: 0;
798        -webkit-flex-grow: 0;
799        -ms-flex-positive: 0;
800        flex-grow: 0;
801        max-width: 100%;
802    }
803
804    @media (min-width: 600px) {
805        .css-1etv89n {
806            -webkit-flex-basis: 50%;
807            -ms-flex-preferred-size: 50%;
808            flex-basis: 50%;
809            -webkit-box-flex: 0;
810            -webkit-flex-grow: 0;
811            -ms-flex-positive: 0;
812            flex-grow: 0;
813            max-width: 50%;
814        }
815    }
816
817    @media (min-width: 900px) {
818        .css-1etv89n {
819            -webkit-flex-basis: 33.333333%;
820            -ms-flex-preferred-size: 33.333333%;
821            flex-basis: 33.333333%;
822            -webkit-box-flex: 0;
823            -webkit-flex-grow: 0;
824            -ms-flex-positive: 0;
825            flex-grow: 0;
826            max-width: 33.333333%;
827        }
828    }
829
830    @media (min-width: 1200px) {
831        .css-1etv89n {
832            -webkit-flex-basis: 25%;
833            -ms-flex-preferred-size: 25%;
834            flex-basis: 25%;
835            -webkit-box-flex: 0;
836            -webkit-flex-grow: 0;
837            -ms-flex-positive: 0;
838            flex-grow: 0;
839            max-width: 25%;
840        }
841    }
842
843    @media (min-width: 1536px) {
844        .css-1etv89n {
845            -webkit-flex-basis: 25%;
846            -ms-flex-preferred-size: 25%;
847            flex-basis: 25%;
848            -webkit-box-flex: 0;
849            -webkit-flex-grow: 0;
850            -ms-flex-positive: 0;
851            flex-grow: 0;
852            max-width: 25%;
853        }
854    }
855
856    .css-39bbo6 {
857        margin: 0;
858        -webkit-flex-shrink: 0;
859        -ms-flex-negative: 0;
860        flex-shrink: 0;
861        border-width: 0;
862        border-style: solid;
863        border-color: rgba(0, 0, 0, 0.12);
864        border-bottom-width: thin;
865    }
866
867    .css-1ta0opo {
868        background-color: #465362;
869        color: rgba(255, 255, 255, 0.7);
870        margin-top: 64px;
871    }
872
873    @media (min-width: 0px) {
874        .css-1ta0opo {
875            padding-bottom: 48px;
876            padding-top: 48px;
877        }
878    }
879
880    @media (min-width: 600px) {
881        .css-1ta0opo {
882            padding-bottom: 24px;
883            padding-top: 24px;
884        }
885    }
886
887    .css-1ta0opo ul {
888        margin: 0px;
889        padding: 0px;
890        list-style: none;
891    }
892
893    .css-1ta0opo li {
894        padding-top: 2.4px;
895        padding-bottom: 2.4px;
896        padding-left: 0px;
897        padding-right: 0px;
898    }
899
900    .css-1b1jvye {
901        box-sizing: border-box;
902        display: -webkit-box;
903        display: -webkit-flex;
904        display: -ms-flexbox;
905        display: flex;
906        -webkit-box-flex-wrap: wrap;
907        -webkit-flex-wrap: wrap;
908        -ms-flex-wrap: wrap;
909        flex-wrap: wrap;
910        width: 100%;
911        -webkit-flex-direction: row;
912        -ms-flex-direction: row;
913        flex-direction: row;
914        -webkit-box-pack: justify;
915        -webkit-justify-content: space-between;
916        justify-content: space-between;
917        -webkit-align-items: center;
918        -webkit-box-align: center;
919        -ms-flex-align: center;
920        align-items: center;
921    }
922
923    .css-6flbmm {
924        -webkit-user-select: none;
925        -moz-user-select: none;
926        -ms-user-select: none;
927        user-select: none;
928        width: 1em;
929        height: 1em;
930        display: inline-block;
931        fill: currentColor;
932        -webkit-flex-shrink: 0;
933        -ms-flex-negative: 0;
934        flex-shrink: 0;
935        -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
936        transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
937        font-size: 2.1875rem;
938    }
939
940    .css-1is0dyx {
941        margin: 0;
942        font-family: "Roboto", "Helvetica", "Arial", sans-serif;
943        font-weight: 400;
944        font-size: 0.875rem;
945        line-height: 1.43;
946        letter-spacing: 0.01071em;
947        text-align: center;
948        color: inherit;
949    }</style>
950    <title data-react-helmet="true">QPED: Quality-focussed Programming Education</title>
951    <link data-react-helmet="true" rel="canonical" href="https://www.qped.eu"/>
952</head>
953<body>
954<div id="___gatsby">
955    <div style="outline:none" tabindex="-1" id="gatsby-focus-wrapper">
956        <header class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation0 MuiAppBar-root MuiAppBar-colorPrimary MuiAppBar-positionFixed mui-fixed css-17ex9l5">
957            <div class="MuiToolbar-root MuiToolbar-gutters MuiToolbar-regular css-i6s8oy" style="display:flex">
958                <div style="flex-grow:1"><a aria-current="page"
959                                            class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-13gsxkh"
960                                            href="/"><img src="/logo.png" alt="siteName"
961                                                          style="height:40px;display:block"/></a></div>
962                <button class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorInherit MuiIconButton-edgeEnd MuiIconButton-sizeMedium css-145tzfz"
963                        tabindex="0" type="button" aria-label="open drawer">
964                    <svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv" focusable="false"
965                         aria-hidden="true" viewBox="0 0 24 24" data-testid="MenuIcon">
966                        <path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"></path>
967                    </svg>
968                </button>
969                <div class="MuiStack-root css-1p86egf">
970                    <button class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium css-eazhar"
971                            tabindex="0" type="button">About
972                    </button>
973                    <button class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium css-eazhar"
974                            tabindex="0" type="button">Outputs
975                    </button>
976                    <button class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium css-eazhar"
977                            tabindex="0" type="button">Library
978                    </button>
979                    <button class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium css-eazhar"
980                            tabindex="0" type="button">Partners
981                    </button>
982                    <button class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium css-eazhar"
983                            tabindex="0" type="button">Contact
984                    </button>
985                </div>
986            </div>
987        </header>
988        <div class="MuiBox-root css-1d3jr1u">
989            <div class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-2 MuiGrid-direction-xs-column css-1xvs66j">
990                <div class="MuiGrid-root MuiGrid-item css-1wxaqej"><h3
991                        class="MuiTypography-root MuiTypography-h3 MuiTypography-alignCenter css-2pvxon">QPED</h3></div>
992                <div class="MuiGrid-root MuiGrid-item css-1wxaqej">
993                    <div class="MuiBox-root css-kkens6"></div>
994                </div>
995                <div class="MuiGrid-root MuiGrid-item css-1wxaqej"><h6
996                        class="MuiTypography-root MuiTypography-h6 MuiTypography-alignCenter css-1oevxvn">
997                    Quality-focussed Programming Education</h6></div>
998            </div>
999        </div>
1000        <main class="MuiContainer-root MuiContainer-maxWidthMd css-co3dvv" id="about"><h1
1001                class="MuiTypography-root MuiTypography-h2 MuiTypography-alignCenter MuiTypography-gutterBottom css-ybmzf6">
1002            Improving education in programming</h1>
1003            <p class="MuiTypography-root MuiTypography-body1 MuiTypography-alignCenter MuiTypography-gutterBottom css-zi638n">
1004                Our society heavily depends on software in almost every area of life, ranging from social-media apps
1005                installed on millions of mobile devices up to life-critical software in the automotive or avionic
1006                sector. Because we are so dependent on software, it is important that it functions correctly, can be
1007                maintained and, because it is used in many different contexts and operated by humans, is robust.
1008                Unfortunately, this is not the reality. Although tools and techniques exist to improve software quality,
1009                today&#x27;s programmers seem reluctant to use them.</p>
1010            <p class="MuiTypography-root MuiTypography-body1 MuiTypography-alignCenter css-uj3p8u">To remedy this we
1011                need to redesign the curriculum for software engineering and general computer science studies, and put
1012                more focus on quality assurance and software testing early on. The Erasmus+ Project QPED
1013                (Quality-focused Programming Education) will create new course material and a toolkit to achieve
1014                this.</p>
1015            <p class="MuiTypography-root MuiTypography-body1 MuiTypography-alignCenter MuiTypography-gutterBottom css-zi638n">
1016                The new course material will put emphasis on proper testing as early in the education as possible, to
1017                foster a quality-awareness in students that goes beyond functional correctness as demonstrated by
1018                testing; they will also start thinking about better readable and more robust code.</p>
1019            <p class="MuiTypography-root MuiTypography-body1 MuiTypography-alignCenter MuiTypography-gutterBottom css-zi638n">
1020                To ensure that testing and paying attention to code quality is not only taught early, but also performed
1021                by students from the beginning, we will provide a toolkit that can automatically provide feedback on the
1022                quality of the code produced by students. It will support the most common object-oriented and imperative
1023                programming languages, such as Java, Python and C.</p>
1024            <p class="MuiTypography-root MuiTypography-body1 MuiTypography-alignCenter MuiTypography-gutterBottom css-zi638n">
1025                The toolkit and all material will be provided free of charge and can be used inside the Quarterfall
1026                learning platform.</p>
1027            <div class="MuiBox-root css-ldo4d5"><a
1028                    class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedSecondary MuiButton-sizeLarge MuiButton-containedSizeLarge MuiButton-root MuiButton-contained MuiButton-containedSecondary MuiButton-sizeLarge MuiButton-containedSizeLarge css-1irqs2i"
1029                    tabindex="0" href="ios" style="margin-top:32px">Read more</a></div>
1030        </main>
1031        <div class="MuiContainer-root MuiContainer-maxWidthMd css-1c0cfyw">
1032            <div class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-4 MuiGrid-direction-xs-column css-1m7nlmx">
1033                <div class="MuiGrid-root MuiGrid-item css-1wxaqej" id="library">
1034                    <div class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-2 css-isbt42">
1035                        <div class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 css-15j76c0">
1036                            <div class="MuiBox-root css-ldo4d5"><h4
1037                                    class="MuiTypography-root MuiTypography-h4 MuiTypography-alignCenter MuiTypography-gutterBottom css-b0jfc8">
1038                                Library</h4></div>
1039                        </div>
1040                        <div class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 css-15j76c0"><p
1041                                class="MuiTypography-root MuiTypography-body1 css-9l3uo3">We publish several tools and
1042                            libraries written as part of the QPED project on<!-- --> <a
1043                                    href="https://github.com/qped-eu" target="_blank">GitHub</a>. The following
1044                            libraries are available:</p>
1045                            <ul>
1046                                <li><p class="MuiTypography-root MuiTypography-body1 css-9l3uo3"><a
1047                                        href="https://github.com/qped-eu/MASS-checker" target="_blank">MASS checker</a>
1048                                </p></li>
1049                                <li><p class="MuiTypography-root MuiTypography-body1 css-9l3uo3"><a
1050                                        href="https://github.com/qped-eu/mass" target="_blank">MASS configuration
1051                                    generator</a></p></li>
1052                                <li><p class="MuiTypography-root MuiTypography-body1 css-9l3uo3"><a
1053                                        href="https://github.com/qped-eu/rubrics-creation-tool" target="_blank">Rubrics
1054                                    creation tool</a></p></li>
1055                                <li><p class="MuiTypography-root MuiTypography-body1 css-9l3uo3"><a
1056                                        href="https://github.com/qped-eu/PythonChecker" target="_blank">Python style
1057                                    checker tool</a></p></li>
1058                                <li><p class="MuiTypography-root MuiTypography-body1 css-9l3uo3"><a
1059                                        href="https://github.com/quarterfall/cloudcheck" target="_blank">Cloud-based
1060                                    code running server</a></p></li>
1061                                <li><p class="MuiTypography-root MuiTypography-body1 css-9l3uo3"><a
1062                                        href="https://github.com/quarterfall/parseidon" target="_blank">ParseidonJS:
1063                                    analyze design patterns in Mermaid diagrams</a></p></li>
1064                                <li><p class="MuiTypography-root MuiTypography-body1 css-9l3uo3"><a href="./pg.pdf"
1065                                                                                                    target="_blank">Procedural
1066                                    guidance</a></p></li>
1067                                <li><p class="MuiTypography-root MuiTypography-body1 css-9l3uo3"><a
1068                                        href="./broeders2022.pdf" target="_blank">Master thesis: &quot;How do explicit specifications, a
1069                                    test-first approach, and procedural guidance to convert specifications to tests, help to improve c
1069ode
1070                                    quality among students&quot; by Arno Broeders.</a></p></li>
1071                                <li><p class="MuiTypography-root MuiTypography-body1 css-9l3uo3"><a
1072                                        href="https://tile-repository.github.io" target="_blank">TILE repository</a></p>
1073                                </li>
1074                            </ul>
1075                        </div>
1076                    </div>
1077                </div>
1078                <div class="MuiGrid-root MuiGrid-item css-1wxaqej" id="partners">
1079                    <div class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-2 css-isbt42">
1080                        <div class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 css-15j76c0">
1081                            <div class="MuiBox-root css-ldo4d5"><h4
1082                                    class="MuiTypography-root MuiTypography-h4 MuiTypography-alignCenter MuiTypography-gutterBottom css-b0jfc8">
1083                                Partners</h4></div>
1084                        </div>
1085                        <div class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-4 MuiGrid-grid-lg-3 css-1etv89n">
1086                            <a class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-13gsxkh"
1087                               href="https://www.ou.nl" target="_blank"><img src="partners/ou.png" style="width:200px"/></a>
1088                        </div>
1089                        <div class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-4 MuiGrid-grid-lg-3 css-1etv89n">
1090                            <a class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-13gsxkh"
1091                               href="https://www.uni-marburg.de" target="_blank"><img src="partners/marburg.svg"
1092                                                                                      style="width:200px"/></a></div>
1093                        <div class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-4 MuiGrid-grid-lg-3 css-1etv89n">
1094                            <a class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-13gsxkh"
1095                               href="https://www.tue.nl" target="_blank"><img src="partners/tue.png"
1096                                                                              style="width:200px"/></a></div>
1097                        <div class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-4 MuiGrid-grid-lg-3 css-1etv89n">
1098                            <a class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-13gsxkh"
1099                               href="https://www.uoc.edu/" target="_blank"><img src="partners/uoc.png"
1100                                                                                style="width:200px"/></a></div>
1101                        <div class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-4 MuiGrid-grid-lg-3 css-1etv89n">
1102                            <a class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-13gsxkh"
1103                               href="https://www.quarterfall.com" target="_blank"><img src="partners/quarterfall.png"
1104                                                                                       style="width:200px"/></a></div>
1105                    </div>
1106                </div>
1107                <div class="MuiGrid-root MuiGrid-item css-1wxaqej" id="contact">
1108                    <div class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-2 css-isbt42">
1109                        <div class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 css-15j76c0">
1110                            <div class="MuiBox-root css-ldo4d5"><h4
1111                                    class="MuiTypography-root MuiTypography-h4 MuiTypography-alignCenter MuiTypography-gutterBottom css-b0jfc8">
1112                                Contact</h4></div>
1113                        </div>
1114                        <div class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 css-15j76c0"><p
1115                                class="MuiTypography-root MuiTypography-body1 css-9l3uo3">
1115For more information about the
1116                            project, please contact the<!-- --> <a href="mailto:[email protected]">coordinator</a> of
1117                            the project.</p></div>
1118                    </div>
1119                </div>
1120                <div class="MuiGrid-root MuiGrid-item css-1wxaqej">
1121                    <hr class="MuiDivider-root MuiDivider-fullWidth css-39bbo6"/>
1122                    <div class="MuiBox-root css-ldo4d5"><a
1123                            class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-13gsxkh"
1124                            href="https://ec.europa.eu/programmes/erasmus-plus/node_en" target="_blank"><img
1125                            src="/erasmus.png" alt="Erasmus" style="width:400px;margin-top:32px"/></a></div>
1126                </div>
1127            </div>
1128        </div>
1129        <div class="MuiBox-root css-1ta0opo">
1130            <div class="MuiContainer-root MuiContainer-maxWidthMd css-1c0cfyw">
1131                <div class="MuiGrid-root MuiGrid-container css-1b1jvye">
1132                    <div class="MuiGrid-root MuiGrid-item css-1wxaqej"><a href="https://www.linkedin.com/company/qped"
1133                                                                          target="_blank"
1134                                                                          style="margin-left:-5px;color:rgba(255, 255, 255, 0.7)">
1135                        <svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeLarge css-6flbmm" focusable="false"
1136                             aria-hidden="true" viewBox="0 0 24 24" data-testid="LinkedinIcon">
1137                            <path d="M19 3A2 2 0 0 1 21 5V19A2 2 0 0 1 19 21H5A2 2 0 0 1 3 19V5A2 2 0 0 1 5 3H19M18.5 18.5V13.2A3.26 3.26 0 0 0 15.24 9.94C14.39 9.94 13.4 10.46 12.92 11.24V10.13H10.13V18.5H12.92V13.57C12.92 12.8 13.54 12.17 14.31 12.17A1.4 1.4 0 0 1 15.71 13.57V18.5H18.5M6.88 8.56A1.68 1.68 0 0 0 8.56 6.88C8.56 5.95 7.81 5.19 6.88 5.19A1.69 1.69 0 0 0 5.19 6.88C5.19 7.81 5.95 8.56 6.88 8.56M8.27 18.5V10.13H5.5V18.5H8.27Z"></path>
1138                        </svg>
1139                    </a></div>
1140                    <div class="MuiGrid-root MuiGrid-item css-1wxaqej"><p
1141                            class="MuiTypography-root MuiTypography-body2 MuiTypography-alignCenter css-1is0dyx">
1142                        Copyright © QPED 2023.</p></div>
1143                </div>
1144            </div>
1145        </div>
1146    </div>
1147    <div id="gatsby-announcer"
1148         style="position:absolute;top:0;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0"
1149         aria-live="assertive" aria-atomic="true"></div>
1150</div>
1151<script id="gatsby-script-loader">/*<![CDATA[*/
1152window.pagePath = "/";
1153window.___webpackCompilationHash = "d8afd2f4ae454f08f8fe";/*]]>*/</script>
vendor: 1 bytes, line 1153
1153
1154<script id="gatsby-chunk-mapping">/*<![CDATA[*/
1155window.___chunkMapping = {
1156    "app": ["/app-0fcd6a7d9884621fef04.js"],
1157    "component---src-pages-index-tsx": ["/component---src-pages-index-tsx-4414a380a1baee545330.js"],
1158    "component---src-pages-io-1-tsx": ["/component---src-pages-io-1-tsx-608a57dc60325be39c54.js"],
1159    "component---src-pages-io-2-tsx": ["/component---src-pages-io-2-tsx-51b62c1ac38f00a4be20.js"],
1160    "component---src-pages-io-3-tsx": ["/component---src-pages-io-3-tsx-57e3e9d7f876dd658582.js"],
1161    "component---src-pages-io-4-tsx": ["/component---src-pages-io-4-tsx-1e89a1c474b6937b5daa.js"],
1162    "component---src-pages-ios-tsx": ["/component---src-pages-ios-tsx-bd01efdc6b22cd2fd371.js"]
1163};/*]]>*/</script>
vendor: 1 bytes, line 1163
1163
1164<script src="/app-0fcd6a7d9884621fef04.js" async=""></script>
vendor: 1 bytes, line 1164
1164
1165<script src="/framework-70b2ccb48a8ffea0847a.js" async=""></script>
vendor: 1 bytes, line 1165
1165
1166<script src="/webpack-runtime-24ea6e91e6a7b43b1b0a.js" async=""></script>
1166
1167</body>
1168</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.