-
Notifications
You must be signed in to change notification settings - Fork 53
[클린코드 리액트 3기 유소정] 장바구니 미션 Step1 #52
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Open
kaori-killer
wants to merge
39
commits into
next-step:kaori-killer
Choose a base branch
from
kaori-killer:step1
base: kaori-killer
Could not load branches
Branch not found: {{ refName }}
Loading
Could not load tags
Nothing to show
Loading
Are you sure you want to change the base?
Some commits from the old base branch may be removed from the timeline,
and old review comments may become outdated.
Open
Changes from all commits
Commits
Show all changes
39 commits
Select commit
Hold shift + click to select a range
813b6e0
기초 세팅
kaori-killer 97f9784
Revert "기초 세팅"
kaori-killer ae2d2c4
상품 목록 페이지 생성
kaori-killer 1fcaebb
상품들은 n x 4 레이아웃으로 보여진다.
kaori-killer 5faaa6a
prettier, eslint 적용
kaori-killer 08befad
상품 목록, 장바구니, 주문 목록 페이지 생성
kaori-killer fec8ed4
헤더에 있는 버튼을 누르면 그에 맞는 페이지로 이동한다
kaori-killer 3a15913
메인 페이지 장바구니 버튼 클릭 시 체크 박스 모양으로 변환
kaori-killer f431b96
장바구니 페이지 생성
kaori-killer 7d5a311
기본 세팅
kaori-killer 01d923f
상품 리스트를 보여준다
kaori-killer d5aad50
상품을 클릭하면 해당 상품을 상세볼 수 있는 URL로 변경한다
kaori-killer 92b4775
상품 리스트 페이지에서 상품의 장바구니 버튼을 누르면 '장바구니에 추가되었습니다' confirm이 나온다
kaori-killer c0a1f7e
상품 상세보기 페이지에서 상품의 정보를 확인할 수 있다
kaori-killer ae92b0f
장바구니 페이지에 들어가면 장바구니 데이터를 불러와서 리스트를 보여준다
kaori-killer e60c5ff
주문하기 버튼을 누르면 주문하기 페이지로 이동한다
kaori-killer 2f78157
상품 리스트 페이지에서 장바구니 버튼을 누르면 상품이 추가된다
kaori-killer f12afb5
장바구니의 값을 가져오는 부분 추가
kaori-killer ede0549
제품 상세 페이지에서 장바구니 버튼을 누르면 '장바구니에 추가되었습니다' confim과 함께 장바구니에 상품이 추가된다
kaori-killer be61505
Title 부분을 공통 컴포넌트로 분리
kaori-killer a05a160
주문/결제 페이지 section별 컴포넌트로 분할
kaori-killer 9356b17
주문/결제에 대한 리스트를 담는 context api 생성
kaori-killer 175bf84
장바구니에서 상품 선택 버튼을 클릭하면 담고, 해제하면 삭제하기
kaori-killer bc2e931
가격과 수량에 대한 정보를 context api에 추가
kaori-killer 83323a8
장바구니에서 가격을 보여준다
kaori-killer 2f410a9
장바구니에서 수량을 보여준다
kaori-killer 94c0e70
장바구니에서 수량을 증가/감소 시킬 수 있다
kaori-killer e9c8b25
수량을 선택하고 상품을 선택하면 결제예상금액에 수량과가격이 반영된 총 가격이 들어간다
kaori-killer 0d23095
장바구니 아이템을 삭제할 수 있다
kaori-killer dfa317d
장바구니 상품 초기화
kaori-killer c3c60a8
early retrun으로 변환
kaori-killer be53558
BASE_URL을 상수로 분리
kaori-killer 97cce10
toLocaleString 함수에 인자로 대한민국 추가
kaori-killer 799cb9e
자식 요소가 없는 태그는 self closing tag로 변경
kaori-killer 0a661c5
preState로 사용으로 변경
kaori-killer 12e89fb
클릭이 가능한 부분은 cursor를 pointer로 변환
kaori-killer 400d61b
전반적인 글로벌 레이아웃 스타일 적용
kaori-killer 0427025
이미지가 비어있는 경우를 대비하여, 기본 이미지 삽입
kaori-killer dad793b
메해당 element가 없을 때에는 null을 render 하는 방식으로 변경
kaori-killer File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,131 @@ | ||
# Logs | ||
logs | ||
*.log | ||
npm-debug.log* | ||
yarn-debug.log* | ||
yarn-error.log* | ||
lerna-debug.log* | ||
.pnpm-debug.log* | ||
|
||
# Diagnostic reports (https://nodejs.org/api/report.html) | ||
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json | ||
|
||
# Runtime data | ||
pids | ||
*.pid | ||
*.seed | ||
*.pid.lock | ||
|
||
# Directory for instrumented libs generated by jscoverage/JSCover | ||
lib-cov | ||
|
||
# Coverage directory used by tools like istanbul | ||
coverage | ||
*.lcov | ||
|
||
# nyc test coverage | ||
.nyc_output | ||
|
||
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) | ||
.grunt | ||
|
||
# Bower dependency directory (https://bower.io/) | ||
bower_components | ||
|
||
# node-waf configuration | ||
.lock-wscript | ||
|
||
# Compiled binary addons (https://nodejs.org/api/addons.html) | ||
build/Release | ||
|
||
# Dependency directories | ||
node_modules/ | ||
jspm_packages/ | ||
|
||
# Snowpack dependency directory (https://snowpack.dev/) | ||
web_modules/ | ||
|
||
# TypeScript cache | ||
*.tsbuildinfo | ||
|
||
# Optional npm cache directory | ||
.npm | ||
|
||
# Optional eslint cache | ||
.eslintcache | ||
|
||
# Optional stylelint cache | ||
.stylelintcache | ||
|
||
# Microbundle cache | ||
.rpt2_cache/ | ||
.rts2_cache_cjs/ | ||
.rts2_cache_es/ | ||
.rts2_cache_umd/ | ||
|
||
# Optional REPL history | ||
.node_repl_history | ||
|
||
# Output of 'npm pack' | ||
*.tgz | ||
|
||
# Yarn Integrity file | ||
.yarn-integrity | ||
|
||
# dotenv environment variable files | ||
.env | ||
.env.development.local | ||
.env.test.local | ||
.env.production.local | ||
.env.local | ||
|
||
# parcel-bundler cache (https://parceljs.org/) | ||
.cache | ||
.parcel-cache | ||
|
||
# Next.js build output | ||
.next | ||
out | ||
|
||
# Nuxt.js build / generate output | ||
.nuxt | ||
dist | ||
|
||
# Gatsby files | ||
.cache/ | ||
# Comment in the public line in if your project uses Gatsby and not Next.js | ||
# https://nextjs.org/blog/next-9-1#public-directory-support | ||
# public | ||
|
||
# vuepress build output | ||
.vuepress/dist | ||
|
||
# vuepress v2.x temp and cache directory | ||
.temp | ||
.cache | ||
|
||
# Docusaurus cache and generated files | ||
.docusaurus | ||
|
||
# Serverless directories | ||
.serverless/ | ||
|
||
# FuseBox cache | ||
.fusebox/ | ||
|
||
# DynamoDB Local files | ||
.dynamodb/ | ||
|
||
# TernJS port file | ||
.tern-port | ||
|
||
# Stores VSCode versions used for testing VSCode extensions | ||
.vscode-test | ||
|
||
# yarn v2 | ||
.yarn/cache | ||
.yarn/unplugged | ||
.yarn/build-state.yml | ||
.yarn/install-state.gz | ||
.pnp.* | ||
log |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
module.exports = { | ||
env: { | ||
browser: true, | ||
es2021: true, | ||
node: true, | ||
jest: true, | ||
}, | ||
extends: [ | ||
"eslint:recommended", | ||
"plugin:prettier/recommended", | ||
"plugin:react/recommended", | ||
"plugin:react/jsx-runtime", | ||
"plugin:@typescript-eslint/recommended", | ||
"prettier", | ||
], | ||
overrides: [ | ||
{ | ||
files: ["*.ts", "*.tsx"], | ||
}, | ||
], | ||
parser: "@typescript-eslint/parser", | ||
parserOptions: { | ||
ecmaVersion: "latest", | ||
sourceType: "module", | ||
ecmaFeatures: { | ||
jsx: true, | ||
}, | ||
}, | ||
plugins: ["react", "prettier"], | ||
ignorePatterns: ["node_modules/"], | ||
rules: { | ||
"prettier/prettier": "error", | ||
}, | ||
settings: { | ||
react: { | ||
version: "detect", // 사용자가 설치한 버전을 자동으로 선택 | ||
}, | ||
}, | ||
}; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
# Logs | ||
logs | ||
*.log | ||
npm-debug.log* | ||
yarn-debug.log* | ||
yarn-error.log* | ||
pnpm-debug.log* | ||
lerna-debug.log* | ||
|
||
node_modules | ||
dist | ||
dist-ssr | ||
*.local | ||
|
||
# Editor directories and files | ||
.vscode/* | ||
!.vscode/extensions.json | ||
.idea | ||
.DS_Store | ||
*.suo | ||
*.ntvs* | ||
*.njsproj | ||
*.sln | ||
*.sw? |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
node_modules/ | ||
package-lock.json |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
{ | ||
"trailingComma": "es5", | ||
"tabWidth": 2, | ||
"semi": true | ||
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,30 @@ | ||
# React + TypeScript + Vite | ||
|
||
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. | ||
|
||
Currently, two official plugins are available: | ||
|
||
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh | ||
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh | ||
|
||
## Expanding the ESLint configuration | ||
|
||
If you are developing a production application, we recommend updating the configuration to enable type aware lint rules: | ||
|
||
- Configure the top-level `parserOptions` property like this: | ||
|
||
```js | ||
export default { | ||
// other rules... | ||
parserOptions: { | ||
ecmaVersion: "latest", | ||
sourceType: "module", | ||
project: ["./tsconfig.json", "./tsconfig.node.json"], | ||
tsconfigRootDir: __dirname, | ||
}, | ||
}; | ||
``` | ||
|
||
- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked` | ||
- Optionally add `plugin:@typescript-eslint/stylistic-type-checked` | ||
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
import { CartDetail } from "../src/types"; | ||
|
||
const cartList: CartDetail[] = [ | ||
{ | ||
id: 1, | ||
product: { | ||
name: "test", | ||
price: 1234, | ||
imageUrl: "test.com", | ||
id: 1, | ||
}, | ||
}, | ||
{ | ||
id: 5, | ||
product: { | ||
name: "tes11111t", | ||
price: 1234, | ||
imageUrl: "test.com", | ||
id: 10 | ||
} | ||
}; | ||
] | ||
|
||
export default cartList; |
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
readme 파일에는 프로젝트 내용을 간단하게 적어주시는게 좋아요! 🚗
관련 아티클들을 읽어보셔도 좋고,
오픈소스 readme등을 보면서 어떤 내용들이 들어가면 좋을지 보시는것도 많은 도움이 될거에요!