local, session storage ์ค local์ ํ์ฉํด ๋ณด์!local ์ ๋ธ๋ผ์ฐ์ ๊ฐ ๋ซํ๋ฉด ์ด์์ง๋ session๊ณผ๋ ๋ค๋ฅด๊ฒ ๋ค์ ํด๋น ์ฃผ์๋ก ์ ์ํ๋ฉด ๊ธฐ๋ก์ ๊ฐ๊ณ ์๋ค.์ด๋ฅผ ํ์ฉํด์ ์ฅ๋ฐ๊ตฌ๋ ํน์ ๋ณด๊ด, ์ฆ๊ฒจ์ฐพ๊ธฐ ๊ธฐ๋ฅ์ ๊ตฌํํด ๋ณด์!!์ ์ฅํ๊ธฐ๋ฐฐ์ด ์ ์ฅ (์
API key ๊ฐ ๋ฑ ๋ณด์ ํน์ ๊ฒฐ์ ๋ฌธ์ ๋ก ์ค์ํ key ๊ฐ์ ์ ์ฅํ๊ณ ํ๊ฒฝ์ ์ผ๋ก ํ์ํ ๋ถ๋ถ์ ์ ์ฅํ๊ณ ์ฌ์ฉํ๊ธฐ ์ํด .env ๋ฅผ ํ์ฉํ๋ค..env ํ์ผ์ฌ์ฉ ํ์ผ์ฒ๋ผ ์ฌ์ฉํ๋ฉด ๋๋ค..env ๋ github ๋ฑ์ ์ฌ๋ฆฌ์ง ์๋๋ก .gitignore์ ์ค์ ํ๋ค.ํ์ง๋ง g
๋ฆฐํธ ์ผ๊ณ !์ฝ์์ ๊ฒฝ๊ณ ์์ด150์ค์ ๋๊ธฐ์ง ์๋ ์ฝ๋ ์ง๊ธฐ๊ดํด ๋ฐฉ์ง๋ก ์ฐ๋กํ๋ง, ๋๋ฐ์ด์ค ๊ฑธ๊ธฐ (300ms ์ ๋)observer ์ฌ์ฉํ๋ฉด ๊ผญ ์ธ๋ง์ดํธ ํด๋ฆฐ ํด์ฃผ๊ธฐ์ญ์๋ ๊ดํด์ api ๋ฅผ ๋ถ๋ฌ์ค๊ณ state์ ์ ์ฅ๋๋ ๊ณผ์ ์ ๊ณ ๋ คํ์ฌ ์ฝ๋ ์ง๊ธฐkey ๊ฐ์ ๋ ธ์ถ๋์ง ์๋
npm ์ผ๋ก๋ง ์ฌ์ฉํด ์ค๋ค๊ฐ yarn ์ ์จ๋ณด์๊ณ ํ์ ์ ๋..์ ...brew install yarn์์ํ์๋ง์ ์ค๋ฅ..error https://registry.yarnpkg.com/grip_assn: Not found์ด๋ฌ์ง๋ง..์ง๊ธ ๋ถํฐ ์์.registry
๋ก๋ฉ์ ์ฉ๋์ด ํฐ ์ด๋ฏธ์ง๋ ์์ฒญ๋๊ฒ ๋ก๋ฉ ์๋๋ฅผ ์ ํ ์ํจ๋ค.์ด์ฐจํผ ํ๋ฉด ๊ฝ์ฐจ๊ฒ ๋์ฐ๋ ์ด๋ฏธ์ง๊ฐ ์๋๋ผ๋ฉด ํฌ๊ธฐ์ ๋ง๋ ์ด๋ฏธ์ง๋ฅผ ์ ๋ก๋ํ๊ณ ํฌ๊ธฐ์ ๋ง๋ ํด์๋๋ก ์ต์ ํ์์ผ์ ์ ๋ก๋ํ๋ฉด ์พ์ ํ ๋ก๋ฉ์๋๋ฅผ ๋ง๋ค์ด์ค๋ค.https://squoosh.app/์ด๋ฏธ์ง์ ์ฌ์ฉ
๋๋ผ์ด๊ฑด ๋์ณ๋๋ค.๋ชจ๋ฌ์ ๊ตฌํํ๊ธฐ ์ํด ๊ฐ์ฌ๋๊ป ์ถ์ฒ๋ฐ์ React Portal์ ์์๋ณด์.https://ko.reactjs.org/docs/portals.html๊ณต์ ๋ฌธ์ ์ฝ์ด์ฃผ๊ณ !portal์ DOM ํธ๋ฆฌ์ ์ด๋์๋ ์กด์ฌํ ์ ์๊ณ ์ผ๋ฐ์ ์ธ React ์์
์ฝ๋ฉ ์ปจ๋ฒค์ ์ ์๋ฐฐ๋๋ ์ฝ๋๋ ์ํฐ ํจํด์ ์๋ ๊ฒ์ถํ๋ ๋๊ตฌ.vscode extension installvscode settings ์ต์ ์ค์ settings ์์ eslint, stylelint ๊ฒ์ํด์์ฌ์ฉํ๊ณ ์ ํ๋ validate ์ค์ ํด์ฃผ๊ธฐ!ํ๋ก์ ํธ์ eslint
email ํ์ค ์ ๊ท์id ๋ js ํน์ ๋์ ํ ๋๋ง ์ฌ์ฉ.import CheckActive from โimages/check_active.svgโ;svg ํ์ผ์ index.jsx ์ ๋ฃ๊ณ export ํด์ ์ฌ์ฉํ๊ธฐcx (classnames)react-use์ด๋ฒคํธ ๋ง๊ธฐ
json ๋ฐ์ดํฐ๋ฅผ ์ ๋ฆฌํ์ฌ excel ๋ก ๋ด๋ ค๋ฐ๊ธฐnpm install write-excel-fileํ์ฉ๋ง๋ค์ด์ง ํจ์๋ฅผ ์คํ์ํค๋ฉด data๋ฅผ ๊ฐ๋ ์ง์ ๋ ํ์ผ๋ช ์ผ๋ก excel ํ์ผ์ ๋ค์ด๋ก๋ ํ๊ฒ ๋๋ค!!
โ๐ฝ ์ํฐ๋ ํ๋ฆฌ์จ๋ณด๋ฉ ์ฝ์ค์์๋ ์๊ฐ๋ฃ ๋ฌด๋ฃ, ์ฐธ๊ฐ๋น 50๋ง์์ ๋ฐ์ต๋๋ค. ์ดํ ์ฝ์ค ์์ฃผ(1.์ฐธ๊ฐ๊ธฐ์ 70% ์ด์ ์ง์ 2.๊ณผ์ ์ ์ถ 3.๋๋ฃํผ๋๋ฐฑ 4.์ถ๊ฒฐ)์ ์ทจ์ ํ๋ ์ง์๊ธ 50๋ง์(์ ์ธ๊ณต๊ณผ ํ)์ ์ง๊ธํฉ๋๋ค. ์ด๋ฌํ 1) ์ ์ฑ ์ ๋์ ํ ์ด์ ์ 2) ์ง์์ ํฌ
๊ณต๋ฐฑ๊ธฐ ์ด์ ๊ฐ๋ฐ์๊ฐ๋ ์ด์ ํ๋ก ํธ์๋ ์ ํ์ด์ react ์ ํ์ด์ ์นํ์ด์ง์ ๋ํ์ ์ํ๋ ์์น์ ์์น ์ํฌ ์ ์๋๊ฐmargin & paddingfloorflexstyled-components ๋ฅผ ์ค๋ช ํด์ฃผ์ธ์.๋น๋๊ธฐrestfulhttp ๋ฉ์๋ ์ค๋ช get post ์ฅ๋จhoo
ํจ์คํธ์บ ํผ์ค ํ๋ก ํธ์๋ ์คํํธ์ ํธ๋ ๊ณผ์ ์๋ฃ
์ฃผ์ ์ ์ => ์์ฅ ์กฐ์ฌ => ๊ธฐํ => ๋์์ธ => ๊ฐ๋ฐ๋จ์ํ๊ฒ ํ๋ก์ ํธ ์์๋ฅผ ๋์ดํ๋ฉด ์ด๋ ๋ค.์์ฅ ์กฐ์ฌ์ ๊ธฐํ์ ํ์ฌ ์ฌ์ฉํ๊ณ ์ ํ๋ ์นํ์ด์ง์ ๋ค์ด๊ฐ ๊ธฐ๋ฅ๋ค์ ์์ฑํ๋ค.๊ทธ๋ฆฌ๊ณ ๋์์ธ์ ํตํด ๊ธฐ๋ฅ๋ค์ ๋ฐฐ์นํ๋ค.๊ธฐํ ๋จ๊ณ์์ ์ฌ์ฉ์์ ์ฌ์ฉ์์๋ฑ์ ๊ณ ๋ คํ๊ณ ์๋น ์์์
๋ฐ์ํ ํ์ด์ง ์์ฑ ๊ธฐ๋ณธ ๊ธฐํ ๋ฐ ๋์์ธ ๋ฌธ์ .๋ฐ์ํ ํ์ด์ง๋ฅผ ์์ฑํ๊ธฐ์ํด ๊ณ ๋ ค๋์ด์ผํ ๊ฒ๋ค์ด ๋ง๋ค.๊ธฐํ ๋์์ธ ๋จ๊ณ์์ ๋์น ๊ฒ๋ค์ด ๋ง์ ๊ฐ๋ฐ ๊ณผ์ ์์ ๋ฌธ์ ๋ฐ์.๋ง์ ๋ชจ๋ํฐ ์ฌ์ด์ฆ, ํ ๋ธ๋ฆฟ ์ฌ์ด์ฆ, ์ค๋งํธํฐ ์ฌ์ด์ฆ์ ๋์ํ๊ธฐ ์ํด์์ ๋ฐ์ํ์ ๊ธฐํํ์๋ค.๊ฐ๋ฐ ์์
d3 ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ก ์๊ฐํ ํ๊ธฐ.๋ชฉํ์งํ
๊ฐ์ฅ ์ฃผ๊ฐ ๋๋ ํ์ด์ง ๋ถํฐ ๊ฐ๋ฐํ์ฌ ๋๊ฐ๋ค.main - report page.nav, header, noticelogin์์ผ๋ก ๊ฐ๋ฐ!github organization ์ ๋ง๋ค์ดrepo ๋ฅผ fork ํ์ฌ ์์ !master, develop branch ๋ 1๋ช ์ด์์ a
48์๊ฐ ๋จ๊ธฐ ํ๋ก์ ํธ ํด์ปคํค ์ฐธ์ฌ!
48์๊ฐ ๋จ๊ธฐ ํ๋ก์ ํธ ํด์ปคํค ์ฐธ์ฌ!
48์๊ฐ ๋จ๊ธฐ ํ๋ก์ ํธ ํด์ปคํค ์ฐธ์ฌ!
๋์์ธ ์์!1์ฐจ ๋์์ธ ๊ธฐํ์ 3์ผ!๊ตฌ์ฒด์ ์ธ ๊ธฐ๋ฅ๋ค์ ๋ ผ์ํ๊ณ ํ์ด์ง ์์๋ถํฐ ๋๊น์ง ํ์ํ ๊ธฐ๋ฅ๋ค๊ณผ ์ฌ์ฉ๋ฐฉ์์ ๋ ผ์ํ์๋ค.์์ผ๋ก ๋์์ธ ๊ธฐ๊ฐ๋์ ์ง์์ ์ผ๋ก ํ์ธํ๋ฉฐ ํ์๋ฅผ ํตํด ๊ธฐ๋ฅ ์ฌ์ฉ ์์๊ณผ ๋ฐฉ์์ ๋ง์ถฐ๋์์ธ์ด ์ ๋๋๋ก ๋์์ด๋์ ๊ฐ๋ฐ์๊ฐ ์ํต ํ์!