front-end task

.editorconfig

@@ -0,0 +1,9 @@
+# EditorConfig is awesome: https://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+[*]
+end_of_line = lf
+charset = utf-8
+

.eslintignore

@@ -0,0 +1,7 @@
+.idea
+.vscode
+.config
+node_modules/*
+config/*
+public/*
+scripts/*

.eslintrc.json

@@ -0,0 +1,32 @@
+{
+    "root": true,
+    "env": {
+        "browser": true,
+        "es2020": true
+    },
+    "extends": ["xo", "xo-react"],
+    "overrides": [
+        {
+            "extends": ["prettier", "plugin:prettier/recommended"],
+            "files": ["*.ts", "*.tsx", "*.js", "*.jsx"]
+        }
+    ],
+    "ignorePatterns": ["dist", ".eslintrc.js"],
+    "parser": "@typescript-eslint/parser",
+    "parserOptions": {
+        "ecmaVersion": "latest",
+        "sourceType": "module"
+    },
+    "plugins": ["react-refresh"],
+    "rules": {
+        "react-refresh/only-export-components": [
+            "warn",
+            {
+                "allowConstantExport": true
+            }
+        ],
+        "react/function-component-definition": "off",
+        "react/react-in-jsx-scope": "off",
+        "no-unused-vars": "off"
+    }
+}

.gitignore

@@ -1 +1,17 @@
+# dependencies
 node_modules
+
+
+# editors and IDE
+.idea
+.vscode
+
+# production
+/build
+
+
+# misc
+.DS_Store
+.env
+.env.production
+

.husky/commit-msg

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npm run commitlint

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npm run pre-commit

.lintstagedrc.json

@@ -0,0 +1,4 @@
+{
+    "*.{js,jsx,tsx,ts}": "eslint --fix",
+    "*.{md,json,html,css,scss,sass}": "prettier --write"
+}

.prettierrc.json

@@ -0,0 +1,6 @@
+{
+    "tabWidth": 4,
+    "singleQuote": false,
+    "endOfLine": "lf",
+    "printWidth": 100
+}

.xo-config.json

@@ -0,0 +1,3 @@
+{
+    "prettier": true
+}

README.md

@@ -1,49 +1,34 @@
-# Sheypoor frontend-challenge
+# Sheypoor Front-end Task
 
-The task is to implement a **2 step UI wizard** to create a user account. There is no UX or UI constraints, this is 
-up to you to decide. 
+This is a two-steped wizard based on Sheyppor task details.
 
-The User information that we need to collect is described in the User type:
-```
-interface User {
-  name: string
-  age: number
-  email: string
-  newsletter: 'daily' | 'weekly' | 'monthly'
-}
-```
-You can, for example collect the name and age in the first step and then email and newsletter in the second step.
-You may use a routing library such that every step is a separate route but this is completely optional and not 
-required.
+## Features
 
-There is a dummy `sdk` package(implemented in the /sdk folder) which exports a `createUser` function. This function returns a `Promise`.
-Use it to simulate a request that creates a user account. 
-Ex:
+-   BEM methodology applied
+-   Follows Gitflow branching strategy
+-   Follows XO, ESLint and Prettier rules alongside commit-lint, lint-staged and husky hooks
+-   Lazy-loaded components
+-   UI lib free (pure sass)
+-   Extensible and stable architecture
 
-```
-import { createUser } from 'sdk'
+## Libs and Frameworks
 
-const details = {...}
-
-createUser(details).then( ... )
-```
+-   React
+-   TypeScript
+-   React Router
+-   Prettier, ESLint, XO, Husky
+-   SASS
 
-The focus should be on code style and the way you approach the problem implementation wise.
-Feel free to use any other helper library although ideally the more code you write yourself the better.
+## Deployment
 
-### Implementation requirements:
+This app uses **Vite** as development server. To run the project simply copy and paste this command in you terminal
 
-- use either vanilla Javascript or one of the frameworks we use at Sheypoor(React / Knockout.js) or whatever you like
-- use npm to manage dependencies, there is pre-initialized package.json included in this repo
-
-### Getting started:
-
-- Fork the repo
-- Implement your solution
-- Create a PR against this repo
+```bash
+  npm run build
+```
 
-Optional: build the project and deploy (ie make it available as a static project) on 
-[Github Pages](https://pages.github.com/), otherwise please provide detailed instructions
-on how to start the project locally.
+then
 
-Any questions please contact us via email (jobs AT sheypoor.com) :)
+```bash
+  vite preview
+```

commitlint.config.ts

@@ -0,0 +1,7 @@
+import type { UserConfig } from "@commitlint/types";
+
+const Configuration: UserConfig = {
+    extends: ["@commitlint/config-conventional"],
+};
+
+export default Configuration;

index.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>Vite + React + TS</title>
+    </head>
+    <body>
+        <div id="root"></div>
+        <script type="module" src="/src/main.tsx"></script>
+    </body>
+</html>