-
Notifications
You must be signed in to change notification settings - Fork 165
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[페이먼츠 미션 Step 1] 윤생(이윤성) 미션 제출합니다. (#205)
* docs: 기능 요구사항 정리 * chore: 프로젝트 초기 세팅 * docs: 기능 요구사항 정리 * feat: InputCardData 컴포넌트 구현 * feat: Card 컴포넌트 구현 * feat: InputCardPassword 컴포넌트 구현 * feat: 카드 추가 폼 컴포넌트 구현 * feat: 카드 추가 페이지 스켈레톤 코드 작성 * feat: format 변환 로직 구현 * docs: 기능 요구사항 최신화 * feat: Card 컴포넌트 스타일 삽입 * feat: FormCardAdd 컴포넌트 스타일 주입 * feat: InputCardData 컴포넌트 스타일 주입 * feat: AddCardPage 상태 관리 로직 및 custom hook 추가 * feat: 문자열 포맷 관련 유틸함수 추가 * feat: 라우팅 관련 로직 추가 * feat: 뒤로가기 버튼 기능 구현 * feat: 재사용되는 헤더 컴포넌트 분리 * feat: 카드 리스트 페이지 마크업 * feat: 각 페이지 라우팅 * feat: input 유효성 검증 관련 유틸 함수 제작 * feat: 이미지 및 정보제공버튼 추가 * refactor: cardNumber 도메인 로직 변경 및 커스텀 훅 추가 * feat: InputCardPassword 컴포넌트 name 속성 추가 * feat: 카드 등록 기능 추가 * docs: 기능 요구사항 최신화 * fix: 만료일 유효성 검증 로직 오류 해결 * feat: 카드 추가 form 입력값 길이 유효성 검사 * refactor: Data Input Custom hook으로 변경 * refactor: Data Input Custom hook으로 변경 * refactor: 불용어 제거 * refactor: 불필요한 상태 제거 * feat: cardList 및 input css 스타일 적용 * feat: 카드 관련 css 스타일링 * feat: 이미 등록된 카드 필터링 기능 추가 * feat: ? 버튼 클릭 시 말풍선 띄우는 기능 추가 * docs: 기능 요구사항 최신화 * refactor: any 타입 제거로 인한 리팩토링 * build: github workflow 추가 * chore: 불필요한 코드 제거 * chore: 불필요한 코드 제거 * refactor: deprecated 된 코드 삭제 * refactor: 의미없는 주석 제거 * refactor: 불필요한 템플릿 리터럴 제거 * refactor: 과도하게 세분화한 컴포넌트 사용 안함 * chore: prettier 설치 * refactor: 컴포넌트 분리 및 AddCardNumberInput 스토리북 작성 * chore: storybook addon 작성 * refactor: 도메인 및 유틸관련 로직 컴포넌트로부터 분리 * refactor: 만료일 입력 컴포넌트 화 * refactor: AddCardExpireDateInput 스토리북 구현 * refactor: AddCardOwnerInput 컴포넌트 분리 * refactor: 보안코드 입력 컴포넌트 분리 * refactor: card password 컴포넌트 분리 * refactor: 로컬스토리지 카드 등록 로직 분리 * refactor: Router 역할 컴포넌트 분리 * refactor: 네이밍 일관성 있게 변경 * refactor: 너무 많은 기능을 가진 메서드 분리 * refactor: 헤더 메모이제이션 적용 * refactor: CardNumber 렌더링 성능 최적화 * refactor: import 가독성 개선 및 타입 분리 --------- Co-authored-by: dladncks1217 <dlaxodud1217@gmail.com>
- Loading branch information
1 parent
65a8a7f
commit 62cbb78
Showing
46 changed files
with
41,237 additions
and
0 deletions.
There are no files selected for viewing
This file contains 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,36 @@ | ||
name: NodeJS with Webpack | ||
|
||
on: | ||
push: | ||
branches: ['step1'] | ||
|
||
jobs: | ||
deploy: | ||
runs-on: ubuntu-latest | ||
permissions: | ||
contents: write | ||
concurrency: | ||
group: ${{ github.workflow }}-${{ github.ref }} | ||
|
||
steps: | ||
- uses: actions/checkout@v3 | ||
- uses: actions/setup-node@v3 | ||
with: | ||
node-version: 18 | ||
|
||
- uses: actions/cache@v3 | ||
id: cache | ||
with: | ||
path: '**/node_modules' | ||
key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }} | ||
restore-keys: | | ||
${{ runner.os }}-node- | ||
- run: npm ci | ||
if: steps.cache.outputs.cache-hit != 'true' | ||
|
||
- run: npm run build | ||
|
||
- uses: peaceiris/actions-gh-pages@v3 | ||
with: | ||
github_token: ${{ secrets.GITHUB_TOKEN }} | ||
publish_dir: ./build |
This file contains 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,23 @@ | ||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. | ||
|
||
# dependencies | ||
/node_modules | ||
/.pnp | ||
.pnp.js | ||
|
||
# testing | ||
/coverage | ||
|
||
# production | ||
/build | ||
|
||
# misc | ||
.DS_Store | ||
.env.local | ||
.env.development.local | ||
.env.test.local | ||
.env.production.local | ||
|
||
npm-debug.log* | ||
yarn-debug.log* | ||
yarn-error.log* |
This file contains 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,7 @@ | ||
{ | ||
"endOfLine": "auto", | ||
"singleQuote": true, | ||
"tabWidth": 2, | ||
"printWidth": 100, | ||
"semi": true | ||
} |
This file contains 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,20 @@ | ||
import type { StorybookConfig } from '@storybook/react-webpack5'; | ||
const config: StorybookConfig = { | ||
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'], | ||
addons: [ | ||
'@storybook/addon-links', | ||
'@storybook/addon-essentials', | ||
'@storybook/preset-create-react-app', | ||
'@storybook/addon-interactions', | ||
'@storybook/addon-styling', | ||
], | ||
framework: { | ||
name: '@storybook/react-webpack5', | ||
options: {}, | ||
}, | ||
docs: { | ||
autodocs: 'tag', | ||
}, | ||
staticDirs: ['../public'], | ||
}; | ||
export default config; |
This file contains 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,16 @@ | ||
import type { Preview } from '@storybook/react'; | ||
import '../src/components/FormCardAdd.css'; | ||
|
||
const preview: Preview = { | ||
parameters: { | ||
actions: { argTypesRegex: '^on[A-Z].*' }, | ||
controls: { | ||
matchers: { | ||
color: /(background|color)$/i, | ||
date: /Date$/, | ||
}, | ||
}, | ||
}, | ||
}; | ||
|
||
export default preview; |
Empty file.
This file contains 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,34 @@ | ||
## 핵심 요구사항 | ||
|
||
- 어플리케이션에 내 카드 정보 등록 | ||
|
||
## 페이지/ 컴포넌트 별 기능 요구사항 정리 | ||
|
||
### 카드 목록 페이지 | ||
|
||
- [x] 카드 추가 버튼 | ||
- [x] 카드 추가 버튼을 눌렀을 때 카드 추가 화면으로 넘어간다, | ||
- [x] 초기 렌더링 시 전체 카드 목록 가져오기 | ||
|
||
### 카드 추가 페이지 | ||
|
||
- [x] 뒤로가기 버튼 클릭 시 이전 페이지로. | ||
|
||
#### 카드 정보 입력 컴포넌트 | ||
|
||
- [x] 입력값들을 입력하면 카드 화면에 바로 반영이 된다. | ||
- [x] 모든 값이 유효한 값이면 다음버튼 클릭 가능하게 한다. | ||
- [x] 다음 버튼을 누르면 데이터를 저장하고 등록하고 카드 목록으로 돌아간다. | ||
- [x] 다음 버튼 눌렀을 때, 이미 등록된 카드를 또 등록했을 경우 오류 메시지 출력한다. | ||
- [x] 카드 소유자 이름 작성 시 몇 글자인지 글자 수를 사용자에게 보여준다. | ||
- [x] 카드 소유자 이름 길이는 30자로 제한한다. | ||
- [x] 소유자 이름은 대문자로 표시한다. | ||
- [x] 보안코드, 비밀번호는 다 온점으로 띄워준다. | ||
- [x] 만료일은 두 글자까지 쓰면 자동으로 / 를 붙인다. | ||
- [x] 카드번호 뒷 8자리는 온점으로 표시한다. | ||
- [x] "?" 버튼에 hover 상태면 cvc에 대한 설명을 보여줌. | ||
- [x] (예외) 입력값이 잘못 들어오면 오류 메시지를 띄워준다. | ||
|
||
### 카드 컴포넌트 | ||
|
||
- [x] 카드 회사, 카드 번호, 카드 소유자명, 만료일 표시한다 |
Oops, something went wrong.