[Team 26-FE] 1주차 01 PR요청 (이든, 도리)

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,40 @@
+---
+name: Bug report
+about: 버그 등록 (최대한 구체적으로 적어주세요.)
+title: ''
+labels: ''
+assignees: ''
+
+---
+
+---
+
+name: Bug report
+about: Create a report to help us improve
+title: "[FE|BE] 홈 UI 렌더링 실패"
+labels: 'bug'
+assignees: ''
+
+---
+
+## 버그 내용
+
+ex) 00 기능 클릭 시 에러 발생
+
+## 원인
+
+ex)
+1. Go to '...'
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+
+## 우려 사항
+
+ex) 클라이언트가 화내요
+
+## 스크린샷 
+
+스크린샷 1
+
+## 기타

.github/ISSUE_TEMPLATE/feature_request.md

@@ -0,0 +1,30 @@
+---
+name: Feature request
+about: 기능 추가
+title: ''
+labels: ''
+assignees: ''
+
+---
+
+---
+
+name: Feature request
+about: Suggest an idea for this project
+title: '[FE|BE] 00 기능 구현 요청'
+labels: 'feat'
+assignees: ''
+
+---
+
+## 기능 요청사항
+
+ex) 로그인 기능이 필요해요.
+
+## 요청 세부사항
+
+ex) 로그인 기능을 만들어주세요.
+
+## 레퍼런스
+
+ex) 관련 사진 및 링크 첨부

.github/pull_request_template.md

@@ -0,0 +1,22 @@
+### About
+
+ex) OO 기능 구현
+
+### Description
+- 흐름을 간단하게 작성하면 됩니다.
+
+ex)
+구현 사항 요약
+1. OO 구조 설계
+2. OO 클래스 분리
+3. 메서드 구현
+
+
+### Result
+
+ex) 실행, 테스트 결과 또는 사진 첨부
+
+
+### Ref
+
+ex) 관련 이슈 직접 태그, #3, #13

FE/.eslintrc.json

@@ -0,0 +1,60 @@
+{
+  "env": {
+    "browser": true,
+    "es2021": true
+  },
+  "extends": [
+    "airbnb-typescript",
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:import/recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:prettier/recommended"
+  ],
+  "parser": "@typescript-eslint/parser",
+  "parserOptions": {
+    "ecmaFeatures": {
+      "jsx": true
+    },
+    "ecmaVersion": "latest",
+    "sourceType": "module",
+    "project": "./tsconfig.json"
+  },
+  "plugins": ["react", "import", "@typescript-eslint"],
+  "rules": {
+    "prettier/prettier": ["error", {}, { "usePrettierrc": true }],
+    "import/no-extraneous-dependencies": ["error", { "devDependencies": true }],
+    "no-undef": "off",
+    "@typescript-eslint/no-var-require": "off",
+    "@typescript-eslint/no-var-requires": "off",
+    "import/no-unresolved": "off",
+    "no-use-before-define": ["error", { "functions": false }],
+    "react/react-in-jsx-scope": "off",
+    "import/order": [
+      "error",
+      {
+        "groups": ["builtin", "external", ["parent", "sibling"], "index"],
+        "pathGroups": [
+          {
+            "pattern": "@/**",
+            "group": "external",
+            "position": "after"
+          }
+        ],
+        "alphabetize": {
+          "order": "asc",
+          "caseInsensitive": true
+        },
+        "newlines-between": "always"
+      }
+    ]
+  },
+  "settings": {
+    "import/parsers": {
+      "@typescript-eslint/parser": [".ts", ".tsx"]
+    },
+    "import/resolver": {
+      "typescript": {}
+    }
+  }
+}

FE/.gitignore

@@ -0,0 +1,2 @@
+/node_modules
+/dist

FE/.prettierrc

@@ -0,0 +1,9 @@
+{
+  "tabWidth": 2,
+  "semi": true,
+  "singleQuote": true,
+  "useTabs": false,
+  "printWidth": 100,
+  "arrowParens": "avoid",
+  "trailingComma": "all"
+}

FE/babel.config.json

@@ -0,0 +1,10 @@
+{
+  "presets": [
+    ["@babel/preset-react", { "runtime": "automatic" }],
+    [
+      "@babel/preset-env",
+      { "targets": "> 0.25%, not dead", "modules": false, "useBuiltIns": "usage", "corejs": 3 }
+    ],
+    "@babel/preset-typescript"
+  ]
+}

FE/config/webpack.common.js

@@ -0,0 +1,27 @@
+const path = require('path');
+
+const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const webpack = require('webpack');
+// const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
+
+module.exports = {
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, '../src'),
+    },
+    extensions: ['.js', '.jsx', '.ts', '.tsx', '.css'],
+  },
+  entry: `${path.resolve(__dirname, '../src')}/index.tsx`,
+  module: {
+    rules: [],
+  },
+  plugins: [
+    new HtmlWebpackPlugin({
+      template: `${path.resolve(__dirname, '../public')}/index.html`,
+    }),
+    new webpack.ProvidePlugin({ React: 'react' }),
+    new ReactRefreshWebpackPlugin(),
+    // new BundleAnalyzerPlugin(),
+  ],
+};

FE/config/webpack.development.js

@@ -0,0 +1,33 @@
+const { merge } = require('webpack-merge');
+
+const common = require('./webpack.common');
+
+module.exports = merge(common, {
+  mode: 'development',
+  devtool: 'inline-source-map',
+  devServer: {
+    open: false,
+    hot: true,
+    compress: true,
+    port: 3000,
+    historyApiFallback: true,
+    liveReload: true,
+  },
+  output: {
+    filename: '[name].[contenthash].js',
+    publicPath: '/',
+  },
+  module: {
+    rules: [
+      {
+        test: /\.(ts|tsx|js|jsx)$/,
+        use: 'ts-loader',
+        exclude: /node_modules/,
+      },
+      {
+        test: /\.(sa|sc|c)ss$/i,
+        use: ['style-loader', 'css-loader', 'file-loader'],
+      },
+    ],
+  },
+});

FE/config/webpack.production.js

@@ -0,0 +1,47 @@
+const path = require('path');
+
+const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const TerserPlugin = require('terser-webpack-plugin');
+const { merge } = require('webpack-merge');
+
+const common = require('./webpack.common');
+
+module.exports = merge(common, {
+  mode: 'production',
+  devtool: 'cheap-module-source-map',
+  output: {
+    filename: '[name].[contenthash].js',
+    path: path.resolve(__dirname, '../dist'),
+    publicPath: '/',
+    clean: true,
+  },
+  module: {
+    rules: [
+      {
+        test: /\.(ts|tsx|js|jsx)$/,
+        use: 'babel-loader',
+        exclude: /node_modules/,
+      },
+      {
+        test: /\.(sa|sc|c)ss$/i,
+        use: [MiniCssExtractPlugin.loader, 'css-loader'],
+      },
+    ],
+  },
+  plugins: [new MiniCssExtractPlugin()],
+  optimization: {
+    usedExports: true,
+    minimize: true,
+    minimizer: [
+      new TerserPlugin({ terserOptions: { compress: { drop_console: true } } }),
+      new CssMinimizerPlugin(),
+    ],
+    splitChunks: { chunks: 'all' },
+  },
+  performance: {
+    hints: false,
+    maxEntrypointSize: 512000,
+    maxAssetSize: 512000,
+  },
+});