Skip to content

Commit 48aef71

Browse files
azakharoazakharo
committed
just copied the started (not all the files)
0 parents  commit 48aef71

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

65 files changed

+2389
-0
lines changed

‎.editorconfig

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
root = true
2+
3+
[*.{js,jsx,ts,tsx,css,scss,html,md,json}]
4+
indent_style = space
5+
indent_size = 2
6+
end_of_line = lf
7+
insert_final_newline = true
8+
charset = utf-8
9+
10+
[Makefile]
11+
indent_style = tab

‎.eslintrc.js

Lines changed: 193 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,193 @@
1+
module.exports = {
2+
parser: '@typescript-eslint/parser',
3+
parserOptions: {
4+
ecmaVersion: 2018,
5+
sourceType: 'module',
6+
project: './tsconfig.json',
7+
},
8+
ignorePatterns: ['/*.*'],
9+
extends: [
10+
'airbnb-typescript',
11+
'plugin:@typescript-eslint/recommended',
12+
'plugin:@typescript-eslint/recommended-requiring-type-checking',
13+
'plugin:eslint-comments/recommended',
14+
'plugin:jest/recommended',
15+
'plugin:promise/recommended',
16+
'plugin:unicorn/recommended',
17+
'prettier',
18+
'plugin:storybook/recommended',
19+
],
20+
plugins: [
21+
'@typescript-eslint',
22+
'eslint-comments',
23+
'simple-import-sort',
24+
'import',
25+
'jest',
26+
'jsx-a11y',
27+
'promise',
28+
'react',
29+
'react-hooks',
30+
'unicorn',
31+
'prettier',
32+
],
33+
env: {
34+
node: true,
35+
browser: true,
36+
jest: true,
37+
},
38+
settings: {
39+
react: {
40+
pragma: 'React',
41+
version: 'detect',
42+
},
43+
},
44+
rules: {
45+
'prettier/prettier': 'error',
46+
// Too restrictive, writing ugly code to defend against a very unlikely scenario: https://eslint.org/docs/rules/no-prototype-builtins
47+
'no-prototype-builtins': 'off',
48+
// https://stackoverflow.com/a/64024916/286387
49+
'no-use-before-define': 'off',
50+
// Allow for..of syntax
51+
'no-restricted-syntax': [
52+
'error',
53+
'ForInStatement',
54+
'LabeledStatement',
55+
'WithStatement',
56+
],
57+
// https://basarat.gitbooks.io/typescript/docs/tips/defaultIsBad.html
58+
'import/prefer-default-export': 'off',
59+
'import/no-default-export': 'off',
60+
// It's not accurate in the monorepo style
61+
'import/no-extraneous-dependencies': 'off',
62+
// TODO set off only for TS and JS modules
63+
'import/extensions': 'off',
64+
'import/first': 'error',
65+
'import/newline-after-import': 'error',
66+
'import/no-duplicates': 'error',
67+
'simple-import-sort/imports': 'error',
68+
'simple-import-sort/exports': 'error',
69+
// Too restrictive: https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/destructuring-assignment.md
70+
'react/destructuring-assignment': 'off',
71+
'react/prop-types': 'off',
72+
'react-hooks/rules-of-hooks': 'error',
73+
'react-hooks/exhaustive-deps': 'warn',
74+
// No jsx extension: https://github.com/facebook/create-react-app/issues/87#issuecomment-234627904
75+
'react/jsx-filename-extension': 'off',
76+
'react/require-default-props': 'off',
77+
'react/jsx-props-no-spreading': 'off',
78+
'react/jsx-uses-react': 'off',
79+
'react/react-in-jsx-scope': 'off',
80+
81+
// Allow most functions to rely on type inference. If the function is exported, then `@typescript-eslint/explicit-module-boundary-types` will ensure it's typed.
82+
'@typescript-eslint/explicit-function-return-type': 'off',
83+
'@typescript-eslint/no-use-before-define': [
84+
'error',
85+
{
86+
functions: false,
87+
classes: true,
88+
variables: true,
89+
typedefs: true,
90+
},
91+
],
92+
// Some variable names are defined in the backend (can't change this).
93+
// Also sometimes the following var names are necessary TYPE__TYPE_NAME
94+
'@typescript-eslint/naming-convention': [
95+
'error',
96+
{
97+
selector: 'variable',
98+
format: null, // disable rule
99+
},
100+
{
101+
selector: 'function',
102+
format: ['camelCase'],
103+
},
104+
{
105+
selector: 'typeLike',
106+
format: ['PascalCase'],
107+
},
108+
],
109+
// Common abbreviations are known and readable
110+
'unicorn/prevent-abbreviations': 'off',
111+
// Airbnb prefers forEach
112+
'unicorn/no-array-for-each': 'off',
113+
'unicorn/filename-case': 'off',
114+
// Sometimes need to return null, because undefined is invalid JSX Element
115+
'unicorn/no-null': 'off',
116+
'unicorn/prefer-optional-catch-binding': 'off',
117+
'unicorn/catch-error-name': 'off',
118+
// Difficult to write redux slices with it
119+
'unicorn/consistent-destructuring': 'off',
120+
// Difficult to write redux slices with it
121+
'unicorn/consistent-function-scoping': 'off',
122+
'unicorn/prefer-node-protocol': 'off',
123+
'unicorn/expiring-todo-comments': 'off',
124+
// Enable some rules for async JS
125+
'no-promise-executor-return': 'error',
126+
'require-atomic-updates': 'error',
127+
'max-nested-callbacks': 'error',
128+
'no-return-await': 'error',
129+
},
130+
overrides: [
131+
{
132+
files: [
133+
'**/*.test.js',
134+
'**/*.test.jsx',
135+
'**/*.test.tsx',
136+
'**/*.spec.js',
137+
'**/*.spec.jsx',
138+
'**/*.spec.tsx',
139+
],
140+
env: {
141+
jest: true,
142+
},
143+
},
144+
{
145+
files: ['*.js'],
146+
rules: {
147+
// Allow `require()`
148+
'@typescript-eslint/no-var-requires': 'off',
149+
},
150+
},
151+
/////////////////////////////////////////////
152+
// Integration test may have no any expect()
153+
{
154+
files: ['*.spec.tsx', 'spec.tsx'],
155+
rules: {
156+
'jest/expect-expect': 'off',
157+
},
158+
},
159+
/////////////////////////////////////////////
160+
// override "simple-import-sort" config
161+
{
162+
files: ['*.js', '*.jsx', '*.ts', '*.tsx'],
163+
rules: {
164+
'simple-import-sort/imports': [
165+
'error',
166+
{
167+
groups: [
168+
// Packages `react` related packages come first.
169+
['^react', '^@?\\w'],
170+
// Internal packages.
171+
[
172+
'^src(/.*|$)',
173+
// Parent imports. Put `..` last.
174+
'^\\.\\.(?!/?$)',
175+
'^\\.\\./?$',
176+
// Other relative imports. Put same-folder imports and `.` last.
177+
'^\\./(?=.*/)(?!/?$)',
178+
'^\\.(?!/?$)',
179+
'^\\./?$',
180+
// Images
181+
'^(IMAGES)(/.*|$)',
182+
],
183+
// Side effect imports.
184+
['^\\u0000'],
185+
// Style imports.
186+
['^.+\\.?(css)$'],
187+
],
188+
},
189+
],
190+
},
191+
},
192+
],
193+
};

‎.gitignore

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
/.idea
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# production
12+
/build
13+
14+
# misc
15+
.DS_Store
16+
.env.local
17+
.env.development.local
18+
.env.test.local
19+
.env.production.local
20+
21+
npm-debug.log*
22+
yarn-debug.log*
23+
yarn-error.log*

‎.prettierrc.json

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"singleQuote": true,
3+
"trailingComma": "all",
4+
"bracketSpacing": false,
5+
"arrowParens": "avoid"
6+
}

‎README.md

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
# React.js Typescript application starter
2+
3+
Usage: create fast prototypes, solve test tasks.
4+
5+
## Features:
6+
* You can write Typescript or Javascript code with the latest JS features.
7+
* Babel is used for Typescript transpilation. Typescript compiler is used for the type checking only.
8+
* ESLint for linting Typescript and Javascript code.
9+
* Auto code formatting with Prettier.
10+
* Fully controllable build process with Webpack. There are the development, production configs. The common part is in the common config.
11+
* Webpack dev server with hot reloading
12+
* Production optimized build
13+
* Client-side routing
14+
* Material UI toolkit
15+
* ApiService for working with a backend. Axios is used.
16+
* Login and Main page skeletons.
17+
* Jest configured. Tests can be written in Typescript.
18+
19+
## Quick start
20+
21+
First install dependencies:
22+
23+
```sh
24+
npm install
25+
```
26+
27+
To run in the development mode with hot module reloading:
28+
29+
```sh
30+
npm start
31+
```
32+
33+
That command opens `http://localhost:4000` page in your browser.
34+
35+
36+
To create a production build:
37+
38+
```sh
39+
npm run build
40+
```
41+
See "build" folder for results.

‎jest.config.js

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
module.exports = {
2+
preset: 'ts-jest/presets/js-with-ts',
3+
// TODO replace when adding the integration testing
4+
// testEnvironment: 'jsdom',
5+
testEnvironment: 'node',
6+
moduleDirectories: ['src', 'node_modules'],
7+
rootDir: './',
8+
moduleNameMapper: {
9+
'\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': '<rootDir>/src/__mocks__/fileMock.ts',
10+
'\\.(css|scss)$': 'identity-obj-proxy',
11+
'src/(.*)': '<rootDir>/src/$1',
12+
},
13+
// setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
14+
};

‎package.json

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
{
2+
"name": "my-app",
3+
"version": "0.0.1",
4+
"scripts": {
5+
"start": "webpack serve --config webpack.dev.config.ts",
6+
"build": "webpack --config webpack.prod.config.ts",
7+
"test": "jest --runInBand",
8+
"storybook": "storybook dev -p 6006",
9+
"build-storybook": "storybook build"
10+
},
11+
"dependencies": {
12+
"@emotion/react": "11.11.1",
13+
"@emotion/styled": "11.11.0",
14+
"@mui/icons-material": "5.14.3",
15+
"@mui/material": "5.14.3",
16+
"axios": "1.4.0",
17+
"clsx": "1.2.1",
18+
"formik": "2.4.3",
19+
"react": "18.2.0",
20+
"react-dom": "18.2.0",
21+
"react-router-dom": "6.14.2",
22+
"yup": "0.32.11"
23+
},
24+
"devDependencies": {
25+
"@babel/core": "7.22.9",
26+
"@babel/plugin-transform-runtime": "7.22.9",
27+
"@babel/preset-env": "7.22.9",
28+
"@babel/preset-react": "7.22.5",
29+
"@babel/preset-typescript": "7.22.5",
30+
"@babel/runtime": "7.22.6",
31+
"@storybook/addon-essentials": "7.2.1",
32+
"@storybook/addon-interactions": "7.2.1",
33+
"@storybook/addon-links": "7.2.1",
34+
"@storybook/addon-onboarding": "1.0.8",
35+
"@storybook/addon-styling": "1.3.5",
36+
"@storybook/blocks": "7.2.1",
37+
"@storybook/react": "7.2.1",
38+
"@storybook/react-webpack5": "7.2.1",
39+
"@storybook/testing-library": "0.2.0",
40+
"@types/jest": "29.5.3",
41+
"@types/react": "18.2.18",
42+
"@types/react-dom": "18.2.7",
43+
"@types/react-router-dom": "5.3.3",
44+
"@types/webpack": "5.28.1",
45+
"@typescript-eslint/eslint-plugin": "5.48.0",
46+
"@typescript-eslint/parser": "5.48.0",
47+
"babel-loader": "9.1.3",
48+
"css-loader": "6.8.1",
49+
"eslint": "8.46.0",
50+
"eslint-config-airbnb-typescript": "17.1.0",
51+
"eslint-config-prettier": "8.6.0",
52+
"eslint-plugin-eslint-comments": "3.2.0",
53+
"eslint-plugin-import": "2.28.0",
54+
"eslint-plugin-jest": "27.2.3",
55+
"eslint-plugin-jsx-a11y": "6.7.1",
56+
"eslint-plugin-prettier": "4.2.1",
57+
"eslint-plugin-promise": "6.1.1",
58+
"eslint-plugin-react": "7.33.1",
59+
"eslint-plugin-react-hooks": "4.6.0",
60+
"eslint-plugin-simple-import-sort": "10.0.0",
61+
"eslint-plugin-storybook": "0.6.13",
62+
"eslint-plugin-unicorn": "45.0.2",
63+
"eslint-webpack-plugin": "3.2.0",
64+
"fork-ts-checker-webpack-plugin": "7.2.14",
65+
"html-webpack-plugin": "5.5.3",
66+
"jest": "29.6.2",
67+
"mini-css-extract-plugin": "2.7.6",
68+
"prettier": "2.8.1",
69+
"storybook": "7.2.1",
70+
"style-loader": "3.3.3",
71+
"ts-jest": "29.1.1",
72+
"ts-node": "10.9.1",
73+
"typescript": "4.9.4",
74+
"webpack": "5.88.2",
75+
"webpack-cli": "5.1.4",
76+
"webpack-dev-server": "4.15.1",
77+
"webpack-merge": "5.9.0"
78+
},
79+
"engines": {
80+
"npm": ">=8.19.2 <9.0.0",
81+
"node": ">=18.12.1 <19.0.0"
82+
}
83+
}

0 commit comments

Comments
 (0)