---
# System prepended metadata

title: Codeweek 2022

---

# Codeweek 2022
Ich bin Fabian :)


- breytex
- Link: https://tinyurl.com/codeweek22

## Roadmap
1. HTML + CSS lernen
2. Zusammenhang zwischen HTML und JavaScript
3. Einführung in das JavaScript Framework React
4. Anbindung der Software an eine Datenbank
5. Ein eigenes Projekt entwickeln 

### Html lernen
- HTML Starter: https://codesandbox.io/s/html-starter-1wjzq1
- HTML Befehle: https://www.html-seminar.de/befehlsuebersicht.htm
- CSS Befehle: https://www.w3schools.com/cssref/
- flex box: https://css-tricks.com/snippets/css/a-guide-to-flexbox/

### Webseiten
Fabian: https://1wjzq1.csb.app/
Alex:https://eskbog.csb.app/
Talisa:https://tfj1fh.csb.app/
Stella:https://iywj6b.csb.app/
Johanna:https://rsp4vo.csb.app/
Catalin: https://qr20sf.csb.app/
Marlon:https://s03pxg.csb.app/
Dominik: https://qn4de6.csb.app/
Christoph:https://ur6smg.csb.app/
Nick:https://diz993.csb.app/

Codeweek 2021 Spiele:https://hackmd.io/@tjanson/codeweek2021#/

```
@media (max-width: 600px) {
  body {
    background-color: lightblue;
  }
}
```

## Array Cardio
- https://codesandbox.io/s/array-cardio-6jct9g?file=/index.html

```javascript=
 const data = [
        "car",
        "car",
        "truck",
        "truck",
        "bike",
        "walk",
        "car",
        "van",
        "bike",
        "walk",
        "car",
        "van",
        "car",
        "truck"
      ];

const result = {
    car: 5,
    truck: 3,
    bike: 2,
    van: 2
}
```

- String concatination: https://masteringjs.io/tutorials/fundamentals/string-concat

- Lösung Array Cardio: https://codesandbox.io/s/array-cardio-forked-96fm0t

## Todolist app
- https://codesandbox.io/s/vite-mui-router-codeweek-2022-forked-6zdg6p?file=/src/Todolist.tsx
- material ui: https://mui.com/material-ui/react-button/
- stack: https://mui.com/material-ui/react-stack/
- box: https://mui.com/material-ui/react-box/
- useState: https://stackoverflow.com/questions/55757761/handle-an-input-with-react-hooks

- halb-fertige Todo-App: https://codesandbox.io/s/solution-todo-list-m6hy8p

## Evaluation
- http://bsomint.de/index.php?s=sf&id=6918-f47 

## Vercel
vercel.com

dominiks sandbox: https://codesandbox.io/s/vite-mui-router-codeweek-2022-forked-mbe4hx

## Discord

https://discord.gg/JmWSHaJj


## Realtime updates
```typescript
  useEffect(() => {
    supabase.from("*").on("*", reload).subscribe();
    return () => {
      supabase.removeAllSubscriptions();
    };
  }, []);
```
## fertige Seiten
Alex: https://simpleshoppinglist.vercel.app/
Stella: https://todolist-stella.vercel.app/