Y_FE_Toy1_Team13 Pokemon Wiki #9
Conversation
๊ณตํต ์์๋ฅผ ๋ง๋ ๋ค
๊ณตํต ์์๋ฅผ ์์ ํ๋ค.
์ํค ๋งํฌ๋ค์ด ์๋ํฐ ๊ธฐ๋ฅ์ ์ถ๊ฐํ๋ค.
๋์์ธ์ ํตํฉํ๋ค.
๊ณต์ง ํ์ด์ง๋ฅผ ๋ฐ์ํ์ผ๋ก ๋์์ธํ๋ค.
๋ชจ๋ฌ ๋์์ธ์ ์์ ํ๋ค.
README.md ํ์ผ์ ์ ๋ฐ์ดํธํ๋ค.
about page๋ฅผ ์ต์ข ์์ ํ๋ค.
Feat: ์ง์ ๋ฆฌ์คํธ ํ์ด์ง ๋ชจ๋ฌ ๋งํฌ์
๋งํฌ๋ค์ด ์๋ํฐ ๊ตฌํ์ ์ํ ์ด๊ธฐ ์ธํ (์ด์ #7)
There was a problem hiding this comment.
๊ณ ์ ๋ง์ผ์
จ์ต๋๋ค!
ํ๋ก์ ํธ์ ์ปจ์
์ ๋ง์ถฐ ํ๋ก์ ํธ๋ ๋ชจํ๊ฐ์ ๊ฒ ์ฒ๋ผ ๊ด๋ จ๋ ๋๋์ผ๋ก ์ ์๋์ผ๋ฉด ์ด๋ ์๊น ์ถ๋ค์.
- ์ฝ๋ ์คํ์ผ ํต์ผ
- ๋ฐ๋ณต๋๋ ๋ก์ง ๋ฐ UI ๊ณตํตํ
- ์กฐ๊ฑด๋ฌธ / ๋น๋๊ธฐ ๋ฐ๋ณต๋๋ ์ํฉ์ ์ฝ๋ ๋จ์ํ
- ๋น๋๊ธฐ ์๋ฌ ์ฒ๋ฆฌ
์ ๋๋ฅผ ๋ค์ ํ๋ก์ ํธ ๋ ๊ณ ๋ คํด๋ณด์๋ฉด ์ข์ ๊ฒ ๊ฐ์ต๋๋ค!
์ค๋ณต๋๋ ๋ฆฌ๋ทฐ๋ ์๋ตํ์ผ๋, ๋ณธ์ธ์ ์ฝ๋์ ๋ํ ๋ฆฌ๋ทฐ๊ฐ ์๋๋๋ผ๋ ํ ๋ฒ์ฉ ์ฐธ๊ณ ํด์ฃผ์๋ฉด ๊ฐ์ฌํ๊ฒ ์ต๋๋ค~
| @@ -0,0 +1,19 @@ | |||
| <!doctype html> | |||
| <html lang="en"> | |||
There was a problem hiding this comment.
en -> ko๋ก ๋ณ๊ฒฝํ์
์ผ๊ฒ ์ฃ ?
| ); | ||
| }; | ||
|
|
||
| const Button = styled.button<{ backgroundColor: string; hoverColor: string }>` |
There was a problem hiding this comment.
styled component์ ๋๊ธฐ๋ props๋ฅผ DOM element๊น์ง ์ ๋ฌํ์ง ์์ผ๋ ค๋ฉด, prop์ ์ด๋ฆ์ $๋ก ์์ํด์ผํ์ง ์๋์?
| import { MouseEventHandler, ReactNode } from 'react'; | ||
| import styled from 'styled-components'; | ||
|
|
||
| interface Props { |
There was a problem hiding this comment.
CommuteButton ์ธ๋ถ์์ ์ด Props์ ์ ๊ทผํ๋ ค๋ฉด Parameters<typeof CommuteButton>[0] ์ฒ๋ผ ์ ๊ทผํด์ผ ํ๋๋ฐ, ์ด interface์ ์ด๋ฆ์ CommuteButtonProps๋ก ๋ฐ๊พธ๊ณ exportํ๋๋ก ํ๋ฉด ์ข ๋ ์ ๊ทผ์ด ํธํ์ง ์์๊น์?
| ); | ||
| }; | ||
|
|
||
| const Button = styled.button<{ backgroundColor: string; hoverColor: string }>` |
There was a problem hiding this comment.
์ฌ๊ธฐ ์ฌ์ฉ๋ value ๊ฐ๋ค์ Props์์ ๊ฐ์ ธ์ค๋๋ก ์์
ํ๋ฉด, CommuteButton์ props ํ์
์ด ๋ณ๊ฒฝ๋๋ฉด ์ ๋์ ์ผ๋ก ๋ฐ๋ผ๊ฐ๋๋ก ํ ์ ์์ ๊ฒ ๊ฐ์์.
|
|
||
| // ์ปจํ ์คํธ์ ํ์ ์ ์ | ||
| interface UserContextType { | ||
| user: User | null; |
There was a problem hiding this comment.
์ด ํจํด์ด ๋ง์ด ๋ฐ๋ณต๋๋๋ฐ, type Nullable<T> = T | null;๊ฐ์ ํฌํผ๋ฅผ ๋ง๋ค์์ผ๋ฉด ์ด๋ ์๊น์?
| const [editor, setEditor] = useState<string>(''); //์์ฑ์ ์ถ๊ฐ | ||
| const editorRef = useRef<Editor | null>(null); |
There was a problem hiding this comment.
์ฃผ์๋ ์ด๋ฐ ์ด์ ์์ ์ถ๊ฐ๋ ๊ฒ ๊ฐ์๋ฐ, ํธ์ง์์ ํธ์ง๊ธฐ๊ฐ ์ข ํท๊ฐ๋ฆฌ๋ค์...
editorComponentRef์ฒ๋ผ ์กฐ๊ธ ๋ ๊ตฌ์ฒด์ ์ผ๋ก ๋ณ์๋ช
์ ์ง์ด๋ณด๋ฉด ์ด๋จ๊น์?
| } else { | ||
| console.log('๋ฌธ์๊ฐ ์์'); | ||
| } |
There was a problem hiding this comment.
๋ฌธ์๊ฐ ์์ ๋ console์ ์ถ๋ ฅ ์ธ์ ์๋ฌด ๋์์ ์งํํ์ง ์๋๋ฐ, ๋ฌธ์๊ฐ ์กด์ฌํ์ง ์์ผ๋ฉด early return๋ง ํด๋ฒ๋ ค๋ ๋์ง ์์๊น์?
| useEffect(() => { | ||
| const fetchData = async () => { | ||
| try { | ||
| const docRef = doc(db, 'wiki', 'rule'); |
There was a problem hiding this comment.
์ด ์์ญ๋, db ์ปฌ๋ผ ๋ช ๋ง ๋ค๋ฅธ ๊ฑฐ๋ผ๋ฉด ํ ์ปดํฌ๋ํธ๋ก ๋ฌถ์ด๋๋ ๊ฒ ๊ด๋ฆฌํ๊ธฐ ํธํ ๊ฒ ๊ฐ๋ค์.
There was a problem hiding this comment.
์ด๋ฐ ๊ฒ๋ค์ ์ ํธ๋ฆฌํฐ๋ณด๋จ ์ปดํฌ๋ํธ๋ผ๊ณ ๋ณด๋ ๊ฒ ๋ง์ง ์์๊น์?
| const startIndex = newTime.indexOf('T'); | ||
| const lastIndex = newTime.indexOf('.'); | ||
| const formattedTime = newTime.slice(startIndex + 1, lastIndex); |
There was a problem hiding this comment.
getHours() ๋ฑ์ ๋ฉ์๋๋ฅผ ํ์ฉํ๋ ๊ฒ ์กฐ๊ธ ๋ ์์ ํ์ง ์์๊น์?
๐ป Toy Project1
๐ ๊ฐ์
๐ฑ ์ฌ์ดํธ
ํฌ์ผ๋ชฌ์คํฐ๋ฅผ ์ฃผ์ ๋ก ํฌ์ผ๋ชฌ๋ค์ ์ํ ์ํค ์ฌ์ดํธ๋ฅผ ์ ์.
๐งโโ๏ธ ์ญํ ๋ถ๋ด
โจ ๊ตฌํ ๋ด์ฉ
ํ์ ์ ๋ณด ๊ด๋ฆฌ
[ ๋ด๋น ๊ฐ๋ฐ์: ์ ํ์ฐ ]
๊ณต์ง ์บ๋ฌ์
[ ๋ด๋น ๊ฐ๋ฐ์: ์ ์ํ ]
์ํค ํ์ด์ง
[ ๋ด๋น ๊ฐ๋ฐ์: ๊น๋ฏผ์ ]
๊ฐค๋ฌ๋ฆฌ ํ์ด์ง
[ ๋ด๋น ๊ฐ๋ฐ์: ์ค์๋ฏผ ]
์ถํด๊ทผ ๊ธฐ๋ก
[ modal ๊ฐ๋ฐ์: ์ด์ฌ์ค, table ๊ฐ๋ฐ์: ์ ์ํ ]
๐๐ปโโ๏ธ ์ ์ ํ๋ก์ฐ
๐ ๏ธ Stack