# 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/