Initial commit

.gitattributes

@@ -0,0 +1,8 @@
+*.css  text eol=crlf
+*.html text eol=crlf
+*.js   text eol=crlf
+*.json text eol=crlf
+*.svg  text eol=crlf
+*.ts   text eol=crlf
+*.tsx  text eol=crlf
+*.vue  text eol=crlf

.gitignore

@@ -0,0 +1,2 @@
+node_modules/
+packages/**/public/

.stylelintrc

@@ -0,0 +1,29 @@
+{
+	"extends": [
+		"stylelint-config-standard",
+		"stylelint-config-standard-vue",
+		"stylelint-config-hudochenkov/order"
+	],
+	"plugins": ["stylelint-no-unsupported-browser-features"],
+	"ignoreFiles": ["node_modules/**", "dist/**"],
+	"rules": {
+		"no-descending-specificity": null,
+		"length-zero-no-unit": [true, { "ignore": ["custom-properties"] }],
+		"function-name-case": "lower",
+		"selector-type-case": "lower",
+		"at-rule-empty-line-before": ["always", { "except": ["first-nested"], "ignore": ["after-comment"] }],
+		"rule-empty-line-before": ["always-multi-line", { "except": ["first-nested"], "ignore": ["after-comment"] }],
+		"declaration-block-no-redundant-longhand-properties": true,
+		"shorthand-property-no-redundant-values": true,
+		"alpha-value-notation": "percentage",
+		"value-keyword-case": ["lower", { "camelCaseSvgKeywords": true }],
+		"plugin/no-unsupported-browser-features": [
+			true,
+			{
+				"severity": "warning",
+				"ignorePartialSupport": true,
+				"ignore": ["css-nesting", "css3-cursors", "text-size-adjust"]
+			}
+		]
+	}
+}

README.md

@@ -0,0 +1,50 @@
+# Frameworks
+This project aims to test out different frontend frameworks by building three different mini applications and seeing how each framework handles things such as reactivity, developer experience, etc.
+
+## Frontend Frameworks
+The current frameworks being tested include:
+- Lit
+- Solid-JS
+- Vue JS
+
+## Package Manager
+The project uses `npm` to manage package dependencies and also uses the workspaces feature of `package.json`.
+
+### Install Dependencies
+The top-level `package.json` file includes shared dependencies and each `package.json` file in the `packages/<subpackage>` folders include their own dependencies.
+
+To install a dependency in a subpackage, run the following command:
+
+```
+npm i -w @frameworks/<name> <dependency>[ <dependency>]
+```
+
+where `<name>` is the name of the subpackage such as `lit` or `vue` and `<dependency>` is the dependency that should be installed.
+
+### Run a Package
+In order to run one of the subpackages, use the following command:
+
+```
+npm run -w @frameworks/<name> dev
+```
+
+where `<name>` is the name of the subpackage such as `lit` or `vue`.
+
+## Technology
+All of the mini applications are written using Typescript for type checking and use the most bleeding edge JavaScript and CSS features currently available.
+
+### CSS
+- CSS Nesting
+- Container Queries
+
+### JavaScript
+- Promise.withResolvers
+
+## Browser Support
+This project is supported by the following browsers:
+- Applie Safari 17.4+
+- Google Chrome 119+
+- Microsoft Edge 119+
+- Mozilla Firefox 121+
+
+[Browserslist](https://browsersl.ist/#q=firefox+%3E%3D+121%0Achrome+%3E%3D+119%0Aedge+%3E%3D+119%0Asafari+%3E%3D+17.4%0Aios_saf+%3E%3D+17.4&region=alt-na)