Skip to content

[Subjects for Tutoring๐Ÿ‘ฉโ€๐Ÿซ] Boilerplate for simple sign-up form

Notifications You must be signed in to change notification settings

humonnom/simple-form

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

9 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

์š”๊ตฌ์‚ฌํ•ญ

  • ํšŒ์›๊ฐ€์ž… form์„ ์™„์„ฑํ•ด์ฃผ์„ธ์š”.
  • ๊ฐ ํ•„๋“œ๋Š” ์œ ํšจ์„ฑ ๊ฒ€์‚ฌ๋ฅผ ํ†ต๊ณผํ•ด์•ผํ•ฉ๋‹ˆ๋‹ค.

์œ ํšจ์„ฑ ๊ฒ€์‚ฌ

field name ์œ ํšจํ•œ ์ž…๋ ฅ
id ํ•„์ˆ˜ ์ž…๋ ฅ, ์ตœ์†Œ 5์ž ์ด์ƒ, ์ตœ๋Œ€ 15์ž ์ดํ•˜
name ํ•„์ˆ˜ ์ž…๋ ฅ
email email ํ˜•์‹ ์ค€์ˆ˜
password ํ•„์ˆ˜ ์ž…๋ ฅ, ์˜๋ฌธ๊ณผ ์ˆซ์ž๋งŒ ํ—ˆ์šฉ, ์ตœ์†Œ 8์ž ์ด์ƒ, ์ตœ๋Œ€ 20์ž ์ดํ•˜
password-confirm ํ•„์ˆ˜ ์ž…๋ ฅ, ์˜๋ฌธ๊ณผ ์ˆซ์ž๋งŒ ํ—ˆ์šฉ, ์ตœ์†Œ 8์ž ์ด์ƒ, password์™€ ๊ฐ™์€ ๊ฐ’์ด์–ด์•ผ ํ•จ
  • ํ•˜๋‚˜๋ผ๋„ ์œ ํšจํ•˜์ง€ ์•Š์€ ์ž…๋ ฅ์ด ์žˆ์„ ๊ฒฝ์šฐ, ์—๋Ÿฌ๋ฉ”์„ธ์ง€๋ฅผ ํ™”๋ฉด์— ํ‘œ์‹œํ•ฉ๋‹ˆ๋‹ค.
  • ๋ฉ”์„ธ์ง€ ๋‚ด์šฉ์€ ์•„๋ž˜์™€ ๊ฐ™์Šต๋‹ˆ๋‹ค.

์—๋Ÿฌ๋ฉ”์„ธ์ง€

  • ํ•„์ˆ˜๊ฐ’ ๋ฏธ์ž…๋ ฅ์‹œ "๊ฐ’์„ ์ž…๋ ฅํ•ด์ฃผ์„ธ์š”." ๋ผ๋Š” ๋ฉ”์„ธ์ง€๋ฅผ ํ‘œ์‹œํ•ฉ๋‹ˆ๋‹ค.

  • ์ตœ์†Œ ๊ธ€์ž์ˆ˜ ๋ฏธ๋งŒ์‹œ "์ตœ์†Œ N์ž ์ด์ƒ ์ž…๋ ฅํ•ด์ฃผ์„ธ์š”." ๋ผ๋Š” ๋ฉ”์„ธ์ง€๋ฅผ ํ‘œ์‹œํ•ฉ๋‹ˆ๋‹ค.

  • ์ตœ๋Œ€ ๊ธ€์ž์ˆ˜ ์ดˆ๊ณผ์‹œ "์ตœ๋Œ€ N์ž ์ดํ•˜๋กœ ์ž…๋ ฅํ•ด์ฃผ์„ธ์š”." ๋ผ๋Š” ๋ฉ”์„ธ์ง€๋ฅผ ํ‘œ์‹œํ•ฉ๋‹ˆ๋‹ค.

  • email ํ˜•์‹ ๋ฌธ์ œ์‹œ "์ด๋ฉ”์ผ ํ˜•์‹์— ๋งž๊ฒŒ ์ž…๋ ฅํ•ด์ฃผ์„ธ์š”." ๋ผ๋Š” ๋ฉ”์„ธ์ง€๋ฅผ ํ‘œ์‹œํ•ฉ๋‹ˆ๋‹ค.

  • password์™€ password-confirm ๋ถˆ์ผ์น˜์‹œ "๋น„๋ฐ€๋ฒˆํ˜ธ๊ฐ€ ์ผ์น˜ํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค." ๋ผ๋Š” ๋ฉ”์„ธ์ง€๋ฅผ ํ‘œ์‹œํ•ฉ๋‹ˆ๋‹ค.

  • password์— ์˜๋ฌธ, ์ˆซ์ž ์™ธ์˜ ๋ฌธ์ž ์ž…๋ ฅ์‹œ "์˜๋ฌธ๊ณผ ์ˆซ์ž๋งŒ ์ž…๋ ฅํ•ด์ฃผ์„ธ์š”." ๋ผ๋Š” ๋ฉ”์„ธ์ง€๋ฅผ ํ‘œ์‹œํ•ฉ๋‹ˆ๋‹ค.

  • ์—๋Ÿฌ๊ฐ€ ์žˆ์„๋•Œ๋Š” ์ œ์ถœ ๋ฒ„ํŠผ์ด Disabled ์ฒ˜๋ฆฌ๋˜์–ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.

  • ์œ ํšจ์„ฑ ๊ฒ€์‚ฌ๋Š” TextField์— ์ž…๋ ฅ์ด ์žˆ์„๋•Œ๋งˆ๋‹ค ์‹ค์‹œ๊ฐ„์œผ๋กœ ์ด๋ฃจ์–ด์ ธ์•ผ ํ•ฉ๋‹ˆ๋‹ค.

์œ ํšจ์„ฑ ๊ฒ€์‚ฌ ํ•จ์ˆ˜ ์˜ˆ์‹œ

<TextField
    name={'id'}
    type="text"
    placeholder="์•„์ด๋””"
    validate={[required, min(5), max(15)]}
/>
  • validate๋Š” ๋ฐฐ์—ด๋กœ ์ „๋‹ฌ๋˜๋ฉฐ, ์ˆœ์„œ๋Œ€๋กœ ๊ฒ€์‚ฌํ•ฉ๋‹ˆ๋‹ค.
  • ์ฒซ๋ฒˆ์งธ ํ•จ์ˆ˜์—์„œ ์‹คํŒจํ•˜๋ฉด ๋’ค์˜ ํ•จ์ˆ˜๋Š” ์‹คํ–‰๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค.
  • validate ํ•จ์ˆ˜๋Š” ์•„๋ž˜์™€ ๊ฐ™์Šต๋‹ˆ๋‹ค.

About

[Subjects for Tutoring๐Ÿ‘ฉโ€๐Ÿซ] Boilerplate for simple sign-up form

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published