Skip to content
This repository was archived by the owner on Mar 20, 2023. It is now read-only.

Commit 4d0427d

Browse files
KonradSzwarcKonradSzwarc
authored
Project initialization
* Create project's root package with Yarn 2 * Create apps packages * Update all dependencies * Add Prettier and ESLint * Set `jsx` and `lib` properties separately for each package * Add workspace and interactive tools Yarn plugins * Create shared ui package * Create `clean` script * Create `bootstrap` script * Create /api/users endpoint and use it in the panel * Remove tsdx in favour of using typescript paths to resolve workspaces * Update scripts * Add Renovate to automatically update dependencies * Add Inter font * Update Button typings * Re-export layout components and create additional Button stories * Update project's README * Add icon prop to the Button component
1 parent 952a5b5 commit 4d0427d

Some content is hidden

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

88 files changed

+22046
-1
lines changed

‎.editorconfig

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
root = true
2+
3+
[*]
4+
end_of_line = lf
5+
insert_final_newline = true
6+
7+
[*.{js,ts,tsx,json,yml}]
8+
charset = utf-8
9+
indent_style = space
10+
indent_size = 2
11+
trim_trailing_whitespace = true
12+
max_line_length = 120

‎.eslintrc.js

+159
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,159 @@
1+
const TSCONFIG_PROJECTS = ['tsconfig.eslint.json', 'packages/**/tsconfig.json'];
2+
3+
const FILES_WITH_DEV_DEPENDENCIES = [
4+
'**/*.test.*',
5+
'**/*.spec.*',
6+
'**/vite.config.ts',
7+
'**/next.config.js',
8+
'**/*.stories.tsx',
9+
'**/setupTests.ts',
10+
'scripts/*.js',
11+
];
12+
13+
module.exports = {
14+
root: true,
15+
env: {
16+
jest: true,
17+
},
18+
parser: '@typescript-eslint/parser',
19+
parserOptions: {
20+
ecmaVersion: 2020,
21+
sourceType: 'module',
22+
project: TSCONFIG_PROJECTS,
23+
},
24+
plugins: [
25+
'@typescript-eslint',
26+
'react',
27+
'react-hooks',
28+
'jest',
29+
'jest-dom',
30+
'prettier',
31+
'simple-import-sort',
32+
'testing-library',
33+
],
34+
extends: [
35+
'eslint:recommended',
36+
'airbnb-typescript',
37+
'plugin:@typescript-eslint/recommended',
38+
'plugin:import/typescript',
39+
'plugin:prettier/recommended',
40+
'plugin:jest/recommended',
41+
'plugin:jest-dom/recommended',
42+
'plugin:react-hooks/recommended',
43+
'plugin:testing-library/react',
44+
],
45+
rules: {
46+
// Prevents from writing functions that are too complex (in terms of cyclomatic complexity).
47+
complexity: [2, 10],
48+
49+
// Disabled as we're using simple-import-sort plugin.
50+
'sort-imports': 0,
51+
52+
// Modified to allow for the usage of TypeScript references written with three slashes.
53+
'spaced-comment': [2, 'always', { markers: ['/'] }],
54+
55+
// Many patterns results in creating classes that doesn't use `this` (e.g. DTOs, models).
56+
'class-methods-use-this': 0,
57+
58+
// In many cases TS infers return type of a function so we don't need to provide it explicitly.
59+
'@typescript-eslint/explicit-module-boundary-types': 0,
60+
61+
// In cases we have to declare an unused variable we want to enforce it will be written with `_` prefix.
62+
'@typescript-eslint/no-unused-vars': [2, { argsIgnorePattern: '^_' }],
63+
64+
// Enforce consistency in array types writing. We always use `T[]` instead of `Array<T>`.
65+
'@typescript-eslint/array-type': 2,
66+
67+
// Disallows to create generics that explicitly extends `unknown` as it's the default TS behavior.
68+
'@typescript-eslint/no-unnecessary-type-constraint': 2,
69+
70+
// Enforces some naming conventions across the codebase.
71+
'@typescript-eslint/naming-convention': [
72+
2,
73+
{ selector: 'default', format: ['camelCase', 'UPPER_CASE', 'PascalCase'] },
74+
{ selector: 'function', format: ['camelCase', 'PascalCase'] },
75+
{ selector: 'parameter', format: ['camelCase'], leadingUnderscore: 'allow' },
76+
{ selector: 'typeLike', format: ['PascalCase'] },
77+
78+
// Interfaces shouldn't be prefixed with `I`.
79+
{ selector: 'interface', format: ['PascalCase'], custom: { regex: '^I[A-Z]', match: false } },
80+
81+
// Types shouldn't be prefixed with `T`.
82+
{ selector: 'typeAlias', format: ['PascalCase'], custom: { regex: '^T[A-Z]', match: false } },
83+
84+
// Generics should have meaningful names instead of one-letters.
85+
{ selector: 'typeParameter', format: ['PascalCase'], custom: { regex: '[a-zA-Z]{2,}', match: true } },
86+
],
87+
88+
// Disabled as we're using simple-import-sort plugin.
89+
'import/order': 0,
90+
91+
// To make imports better searchable we always use named exports.
92+
'import/prefer-default-export': 0,
93+
'import/no-default-export': 2,
94+
95+
// Allows for dev dependencies imports in files that wouldn't be a part of production code.
96+
'import/no-extraneous-dependencies': [2, { devDependencies: FILES_WITH_DEV_DEPENDENCIES }],
97+
98+
// Automatically sorts imports to ensure their consistency.
99+
'simple-import-sort/imports': [
100+
2,
101+
{
102+
groups: [
103+
['^\\u0000'], // Side effects.
104+
['^react', '^(?!@coderscamp.*$)@?\\w'], // Packages from node_modules. React-related packages will be first.
105+
['^@coderscamp.'], // Monorepo packages imports.
106+
['^[^.]'], // Absolute imports.
107+
['^\\.'], // Relative imports.
108+
],
109+
},
110+
],
111+
},
112+
overrides: [
113+
{
114+
// Files with React components.
115+
files: ['*.tsx'],
116+
rules: {
117+
// Ensures we provide a key when rendering components in iteration.
118+
'react/jsx-key': 2,
119+
120+
// There is no need for prop types as we use TypeScript.
121+
'react/prop-types': 0,
122+
123+
// We see no reason to prevent props spreading in react components.
124+
'react/jsx-props-no-spreading': 0,
125+
126+
// As the project uses JSX transform, there is no need for importing React explicitly.
127+
'react/react-in-jsx-scope': 0,
128+
129+
// To be consistent we want to always use arrow function when creating components.
130+
'react/function-component-definition': [2, { namedComponents: 'arrow-function' }],
131+
132+
// In many cases undefined is considered a valid value for a prop.
133+
'react/require-default-props': 0,
134+
},
135+
},
136+
{
137+
// Files that have to use CommonJS imports.
138+
files: ['*.js'],
139+
rules: { '@typescript-eslint/no-var-requires': 0 },
140+
},
141+
{
142+
// Files that should to contain a default export.
143+
files: ['*.config.[tj]s', 'packages/website/pages/**/*.tsx', '*.stories.tsx'],
144+
rules: { 'import/no-default-export': 0 },
145+
},
146+
],
147+
settings: {
148+
react: { version: 'detect' },
149+
'import/resolver': {
150+
node: {
151+
paths: ['src'],
152+
extensions: ['.js', '.ts', '.tsx'],
153+
},
154+
typescript: {
155+
project: TSCONFIG_PROJECTS,
156+
},
157+
},
158+
},
159+
};

‎.gitattributes

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/.yarn/** linguist-vendored

‎.github/renovate.json

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"groupName": "All dependencies",
3+
"groupSlug": "all",
4+
"packageRules": [
5+
{
6+
"groupName": "All dependencies",
7+
"groupSlug": "all",
8+
"paths": ["*"]
9+
}
10+
],
11+
"rangeStrategy": "pin",
12+
"schedule": ["before 3am on Friday"],
13+
"separateMajorMinor": false,
14+
"updateLockFiles": true
15+
}

‎.gitignore

+50
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
lerna-debug.log*
8+
.pnpm-debug.log*
9+
10+
# Diagnostic reports
11+
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
12+
13+
# Dependencies
14+
node_modules
15+
16+
# Production
17+
dist
18+
build
19+
20+
# TypeScript
21+
*.tsbuildinfo
22+
23+
# npm
24+
.npm
25+
26+
# ESLint
27+
.eslintcache
28+
29+
# Local env files
30+
.env.local
31+
.env.development.local
32+
.env.test.local
33+
.env.production.local
34+
35+
# OS
36+
.DS_Store
37+
*.pem
38+
39+
# Next.js
40+
.next
41+
out
42+
43+
# Yarn
44+
.yarn/*
45+
!.yarn/patches
46+
!.yarn/releases
47+
!.yarn/plugins
48+
!.yarn/sdks
49+
!.yarn/versions
50+
.pnp.*

‎.npmrc

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
engine-strict = true

‎.prettierrc.js

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
module.exports = {
2+
arrowParens: 'always',
3+
bracketSpacing: true,
4+
endOfLine: 'lf',
5+
htmlWhitespaceSensitivity: 'css',
6+
insertPragma: false,
7+
jsxBracketSameLine: false,
8+
jsxSingleQuote: false,
9+
printWidth: 120,
10+
proseWrap: 'always',
11+
quoteProps: 'as-needed',
12+
requirePragma: false,
13+
semi: true,
14+
singleQuote: true,
15+
tabWidth: 2,
16+
trailingComma: 'all',
17+
useTabs: false,
18+
};

‎.vscode/extensions.json

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"recommendations": [
3+
"coenraads.bracket-pair-colorizer-2",
4+
"msjsdiag.debugger-for-chrome",
5+
"ms-azuretools.vscode-docker",
6+
"mikestead.dotenv",
7+
"dbaeumer.vscode-eslint",
8+
"codezombiech.gitignore",
9+
"silvenon.mdx",
10+
"esbenp.prettier-vscode",
11+
"prisma.prisma",
12+
"redhat.vscode-yaml"
13+
]
14+
}

‎.vscode/settings.json

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"editor.formatOnSave": true,
3+
"editor.codeActionsOnSave": {
4+
"source.fixAll.eslint": true
5+
},
6+
"editor.rulers": [120],
7+
"search.exclude": {
8+
"**/dist": true,
9+
"**/.yarn": true,
10+
"yarn.lock": true
11+
},
12+
"typescript.tsdk": "node_modules/typescript/lib",
13+
"[html]": {
14+
"editor.defaultFormatter": "vscode.html-language-features"
15+
},
16+
"[javascript]": {
17+
"editor.defaultFormatter": "dbaeumer.vscode-eslint"
18+
},
19+
"[json]": {
20+
"editor.defaultFormatter": "esbenp.prettier-vscode"
21+
},
22+
"[prisma]": {
23+
"editor.defaultFormatter": "Prisma.prisma"
24+
},
25+
"[typescript]": {
26+
"editor.defaultFormatter": "dbaeumer.vscode-eslint"
27+
},
28+
"[typescriptreact]": {
29+
"editor.defaultFormatter": "dbaeumer.vscode-eslint"
30+
},
31+
"[yaml]": {
32+
"editor.defaultFormatter": "redhat.vscode-yaml"
33+
}
34+
}

‎.yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs

+77
Large diffs are not rendered by default.

‎.yarn/plugins/@yarnpkg/plugin-workspace-tools.cjs

+29
Large diffs are not rendered by default.

‎.yarn/releases/yarn-2.4.2.cjs

+55
Large diffs are not rendered by default.

‎.yarnrc.yml

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
defaultSemverRangePrefix: ""
2+
3+
nodeLinker: node-modules
4+
5+
plugins:
6+
- path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
7+
spec: "@yarnpkg/plugin-interactive-tools"
8+
- path: .yarn/plugins/@yarnpkg/plugin-workspace-tools.cjs
9+
spec: "@yarnpkg/plugin-workspace-tools"
10+
11+
yarnPath: .yarn/releases/yarn-2.4.2.cjs

‎README.md

+59-1
Original file line numberDiff line numberDiff line change
@@ -1 +1,59 @@
1-
# coderscamp
1+
# CodersCamp
2+
3+
Monorepo containing CodersCamp internal application and its website.
4+
5+
## Project requirements
6+
7+
- [Yarn](https://yarnpkg.com/) (version 2.4 or higher)
8+
- [Node](https://nodejs.org/) (version 14.0 or higher)
9+
- [Docker](https://www.docker.com/)
10+
11+
## How to set up the project?
12+
13+
1. Clone the repository.
14+
2. Run `yarn bootstrap` command to install all dependencies and generate some necessary files.
15+
3. Run `docker-compose up -d` to start a database in the background.
16+
4. On Unix systems, run `chmod -R +x scripts ` to add execute permission to all scripts inside `scripts` directory.
17+
18+
## Packages
19+
20+
This project is organized in a monorepo structure and contains the following workspaces:
21+
22+
- **api** - backend server that serves and is used by the `panel`.
23+
- **panel** - the main application used by CodersCamp participants.
24+
- **shared** - logic that can be shared between all apps (`api`, `panel`, `website`)
25+
- **ui** - design system used across `panel` and `website` workspaces.
26+
- **website** - CodersCamp website.
27+
28+
## Scripts
29+
30+
- **w** - core script that allows you to run all workspace scripts from the root folder. To use it you need to follow this script with the workspace name and the script you want to run inside it. For example, running `yarn w website dev` will run the `dev` script inside the `website` workspace.
31+
- **bootstrap** - installs all dependencies and generates all necessary files.
32+
- **clean** - removes all production output files, node_modules and clears Yarn cache
33+
- **test** - run tests across all workspaces in parallel.
34+
- **eslint** - generic command used by other linter scripts.
35+
- **lint** - runs ESLint for all project files.
36+
- **lint:perf** - runs ESLint and reports performance (time) of every rule.
37+
38+
## What should I do when I ...?
39+
40+
#### want to work with the panel**
41+
- Run `docker-compose up -d` to start the database.
42+
- Run `yarn w api dev` to start the server in development mode.
43+
- Run `yarn w api panel` to start the panel in development mode.
44+
45+
#### want to work with the api**
46+
- Run `docker-compose up -d` to start the database.
47+
- Run `yarn w api dev` to start server in development mode.
48+
49+
#### want to work with the website**
50+
- Run `yarn w website dev` to start the website in development mode.
51+
52+
#### want to create new components**
53+
- Run `yarn w ui storybook` to run the storybook and see all component stories.
54+
55+
#### have troubles when running some script**
56+
- Run `yarn clean` to clean move the entire project to a clean state.
57+
- Run `yarn bootstrap` to populate the project again.
58+
- Check StackOverflow and GitHub pasting the error message you got.
59+
- Write on a development channel on our Slack.

0 commit comments

Comments
 (0)