feat: add qwik framework section with declaring state (#87)

Co-authored-by: Beaury <Sebastien.Beaury@ca-tjrxqrq9lh.ht.home>

README.md

@@ -299,8 +299,45 @@ How do we solve this ? Developers love having framework overview by examples. It
    * [ ] Router link
    * [ ] Routing
 
+</details><details>
+        <summary>
+            <img width="18" height="18" src="public/framework/qwik.svg" />
+            <b>Qwik</b>
+            <img src="https://us-central1-progress-markdown.cloudfunctions.net/progress/5" /></summary>
+
+* [] Reactivity
+   * [x] Declare state
+   * [ ] Update state
+   * [ ] Computed state
+* [ ] Templating
+   * [ ] Minimal template
+   * [ ] Styling
+   * [ ] Loop
+   * [ ] Event click
+   * [ ] Dom ref
+   * [ ] Conditional
+* [ ] Lifecycle
+   * [ ] On mount
+   * [ ] On unmount
+* [ ] Component composition
+   * [ ] Props
+   * [ ] Emit to parent
+   * [ ] Slot
+   * [ ] Slot fallback
+* [ ] Form input
+   * [ ] Input te t
+   * [ ] Checkbo 
+   * [ ] Radio
+   * [ ] Select
+* [ ] Webapp features
+   * [ ] Fetch data
+   * [ ] Router link
+   * [ ] Routing
+
 </details>
 
+
+
 ## 🤝 Contributing
 
 This site is built with [Astro](https://docs.astro.build). Site content is written in Markdown format located in `content`. For simple edits, you can directly edit the file on GitHub and generate a Pull Request.

content/1-reactivity/1-declare-state/qwik/Name.tsx

@@ -0,0 +1,7 @@
+import { component$, useStore } from '@builder.io/qwik';
+
+export const Name = component$(() => {
+	const store = useStore({ name: 'John' });
+
+	return <h1>Hello {store.name}</h1>;
+});

package.json

@@ -34,6 +34,7 @@
     "@astrojs/tailwind": "^0.1.2",
     "@babel/eslint-parser": "^7.17.0",
     "@babel/plugin-proposal-decorators": "^7.17.9",
+    "@builder.io/qwik": "0.0.20-5",
     "@matschik/lz-string": "^0.0.2",
     "@tailwindcss/typography": "^0.5.2",
     "@types/mdast": "^3.0.10",

pnpm-lock.yaml

@@ -10,6 +10,7 @@ specifiers:
   '@astrojs/tailwind': ^0.1.2
   '@babel/eslint-parser': ^7.17.0
   '@babel/plugin-proposal-decorators': ^7.17.9
+  '@builder.io/qwik': 0.0.20-5
   '@matschik/lz-string': ^0.0.2
   '@tailwindcss/typography': ^0.5.2
   '@types/mdast': ^3.0.10
@@ -60,6 +61,7 @@ devDependencies:
   '@astrojs/tailwind': 0.1.2
   '@babel/eslint-parser': 7.17.0_eslint@8.16.0
   '@babel/plugin-proposal-decorators': 7.17.12
+  '@builder.io/qwik': 0.0.20-5
   '@matschik/lz-string': 0.0.2
   '@tailwindcss/typography': 0.5.2_tailwindcss@3.0.24
   '@types/mdast': 3.0.10
@@ -609,6 +611,11 @@ packages:
       to-fast-properties: 2.0.0
     dev: true
 
+  /@builder.io/qwik/0.0.20-5:
+    resolution: {integrity: sha512-UldU9W4hUXFqFBU7+kSOmri7L49YOkESFdBQpd3fNnUTxc8YxYe4dRBDK67mZIrMCReH0aKCT6YWvQ7caHgZEQ==}
+    engines: {node: '>=14'}
+    dev: true
+
   /@ember-data/rfc395-data/0.0.4:
     resolution: {integrity: sha512-tGRdvgC9/QMQSuSuJV45xoyhI0Pzjm7A9o/MVVA3HakXIImJbbzx/k/6dO9CUEQXIyS2y0fW6C1XaYOG7rY0FQ==}
     dev: true

src/frameworks.mjs

@@ -173,4 +173,19 @@ export default [
 			return files;
 		},
 	},
+	{
+		id: 'qwik',
+		title: 'Qwik',
+		ext: 'html',
+		img: 'framework/qwik.svg',
+		eslint: {
+			files: ['**/qwik/**'],
+			extends: ['eslint:recommended'],
+		},
+		playgroundURL: 'https://qwik.builder.io/playground',
+		documentationURL: 'https://qwik.builder.io/docs/overview',
+		filesSorter(files) {
+			return files;
+		},
+	}
 ];