- ํ๋ช : HALP ME!
- ํ์ฅ : ํ์ ์ง
- ํ์ : ๋ฐ์์ฐ, ์ด์ก์, ์๋ณํ
- Site Link :
- Date : 2022/08/17 - 2022/08/30
โก๏ธ ์ง์์๋ต ์ปค๋ฎค๋ํฐ. ์ฌ์ฉ์๋ ์ง๋ฌธ์ ๋ํ ๊ฒ์๊ธ์ ์์ฑํ๊ณ , ๋ค๋ฅธ ์ฌ์ฉ์๋ค์ด ํด๋น ๊ฒ์๊ธ์ ๋ต๋ณ์ ๋๊ธ๋ก ์์ฑํ๋ค. ์ง๋ฌธ์ ํ ์ฌ์ฉ์๋ ๊ฒ์๊ธ์ ๋ฌ๋ฆฐ ๋ต๋ณ ๋๊ธ ์ค ๊ฐ์ฅ ์ ํฉํ ๋ต๋ณ์ ์ฑํํ๋ค. ์ฑํ๋ฐ์ ๋๊ธ์ ์ฌ์ฉ์๋ ICํ ํฐ์ ๋ณด์์ผ๋ก ๋ฐ๋๋ค.
์ด๋ฆ | ํฌ์ง์ |
---|---|
๋ฐ์์ฐ | FE |
์ด์ก์ | FE |
์๋ณํ | BE, SC |
ํ์ ์ง | BE, SC |
๐ปย FE
์น์ View๋ฅผ ์ ์ ํ๋ก์ฐ์ ๋ฐ๋ผ ๊ตฌ์ฑํ ์ ์๊ณ , ๊ฐ๋ฐํ๊ธฐ.
๐ปย SC
์ค๋งํธ ์ปจํธ๋ํธ ๊ฐ๋ฐ์ ์ํด ์๋ฆฌ๋ํฐ ์ธ์ด๋ฅผ ๋ค๋ฃจ๊ณ , ๋ถ์ํ๊ณ , ์ ์ฉ ๊ฐ๋ฅ. ๊ธฐ๋ณธ์ผ๋ก ์ ๊ณต๋๋ ERC-20, ERC-721 ์ค๋งํธ ์ปจํธ๋ํธ ์ฝ๋ ์ธ์ ๋ง๋ถ์ผ ๊ธฐ๋ฅ์ ์์ฉํ์ฌ ์ฝ๋ ์์ฑํด์ผํจ.
โ ์๋ฆฌ๋ํฐ๋ก ์์ฑ๋ ERC-20, ERC-721 ์ฝ๋๋ฅผ ํ์ ํ๊ณ , ์์ฉํ ์ ์๋ค.
๐ปย BE
๋ฐฑ์๋์์ ์ง๊ฐ ์์ฑ, ์๋ช ๋ฐ ์ ์ก ๋ด๋น. ์๋ฒ ๊ตฌ์ถ, ์ง๊ฐ ์์ฑ ๋ฐ ๊ด๋ฆฌ, ์ค๋งํธ ์ปจํธ๋ํธ์ ์๋ฒ๋ฅผ ์ฐ๋ํ์ฌ ์ฌ์ฉ. ๋์ ํ์ธ์ ์ํด ์ค์๊ฐ ํธ๋ํน.
Language | JavaScript | * |
---|---|---|
Server Framework | Node.js | * |
Contract Language | Solidity | SC |
Container | Ganache | SC |
Web Library | React | FE |
Database(DB) | MySQL | BE |
Web Library | Redux | FE |
Web Library | Babel | BE |
Web Library | Bootstrap | FE |
Web Framework | Express.js | BE |
JavaScript Library | Web3.js | SC |
Framework | Truffle | SC |
Framework | OpenZepplin | SC |
Position | ๊ธฐ์ ์คํ |
---|---|
Front-End | React, Redux, Bootstrap |
Back-End | MySQL, Babel, Express |
Smart-Contract | Solidity, Web3.js, Truffle, OpenZepplin |
OS | MacOS, Ubuntu |
---|---|
IDE | VisualStudioCode |
๊ฐ๋ฐ ๋๊ตฌ | Git |
๊ฐ๋ฐ ์ธ์ด | JavaScript, Solidity |
ํ ์คํธ ๋คํธ์ํฌ | Ganache(ETH) |
์ง๊ฐ | MetaMask |
๋ฌธ์ ๊ด๋ฆฌ | Notion |
- ์ฌ์ฉ์๋ ์์ด๋์ ํจ์ค์๋๋ฅผ ์ ๋ ฅํ์ฌ ํ์๊ฐ์ ํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ด๋์ ํจ์ค์๋๋ฅผ ์ฌ์ฉํ์ฌ ๋ก๊ทธ์ธํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ๊ฒ์๊ธ์ ์์ฑํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ๊ฒ์๊ธ ๋ชฉ๋ก์ ํ์ธํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ๊ฒ์๊ธ ์์ธ ๋ด์ฉ์ ํ์ธํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ๊ฒ์๊ธ์ ๋ํ ๋๊ธ์ ์์ฑํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ ์ ๊ฒ์๊ธ์ ๋ฌ๋ฆฐ ๋๊ธ ์ค ํ๋์ ๋๊ธ์ ์ฑํํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ ์ ์ ๋ณด๋ฅผ ํ์ธํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ ์ด ์์ ํ NFT ๋ชฉ๋ก์ ํ์ธํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ ์ด ์์ ํ ํ ํฐ์ ๊ฐ์๋ฅผ ํ์ธํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ ์ด ์์ฑํ ๊ฒ์๊ธ์ ํ์ธํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ ์ ํ ํฐ์ ๋ค๋ฅธ ์ฌ์ฉ์์๊ฒ ์ ์กํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ ์ด ์์ฑํ ๋๊ธ์ด ์ฑํ๋จ์ผ๋ก, ํ ํฐ์ ํ๋ํ ์ ์๋ค.
- ์ฌ์ฉ์๋ NFT๋ฅผ ์์ฑํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ ์ด ์์ฑํ ๊ฒ์๊ธ์ ์์ ํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ ์ด ์์ฑํ ๊ฒ์๊ธ์ ์ญ์ ํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ ์ด ์์ฑํ ๋๊ธ์ ์์ ํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ ์ด ์์ฑํ ๋๊ธ์ ์ญ์ ํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ๊ฒ์๊ธ์ ์ข์์๋ฅผ ํ์ํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ๋๊ธ์ ์ข์์๋ฅผ ํ์ํ ์ ์๋ค.
- ์ฌ์ฉ์๋ ์์ ํ nft๋ฅผ ์ ์กํ ์ ์๋ค
- ์ฌ์ฉ์๋ nft๋ฅผ ๊ณ ์ ๋ ๊ฐ๊ฒฉ์ ๊ตฌ๋งคํ๊ฑฐ๋ ๊ฒฝ๋งคํ ์ ์๋ค
- ์ฌ์ฉ์๋ ์นดํ ๊ณ ๋ฆฌ์ Explore์์ nft ์กฐํ ๋ฐฉ์์ ์ ํํ ์ ์๋ค
Home
- ๊ธฐ๋ณธ Index ํ๋ฉด.
- ์ผ์ชฝ ์๋จ์ ์ฌ์ดํธ ๋ก๊ณ ํด๋ฆญ์ ํ(Home)์ผ๋ก ์ด๋ํ๋ค.
Navigation
- Home ํ๋ฉด ์๋จ์ ์์น.
- Login / Sign ํด๋ฆญ์ login๊ณผ sign ์ ํ ํ๋ฉด์ผ๋ก ์ด๋ํ๋ค.
- Market ํด๋ฆญ์ market ํ๋ฉด์ผ๋ก ์ด๋ํ๋ค.
- Create ํด๋ฆญ์ NFTcreate ํ๋ฉด์ผ๋ก ์ด๋ํ๋ค.
- My Page ํด๋ฆญ์ mypage ํ๋ฉด์ผ๋ก ์ด๋ํ๋ค.
Login / Sign up
- Home ํ๋ฉด ์๋จ์ ์ค๋ฅธ์ชฝ์ ์์น.
- Sign ํด๋ฆญ์ ํ์๊ฐ์ ํ๋ฉด์ผ๋ก ์ด๋ํ๋ค.
- ํ์๊ฐ์ ์ ํ์ํ Id, Password๋ฅผ ํฌํจํ ์ ๋ณด ๊ธฐ์ ํ, ํ์๊ฐ์ ๋ฒํผ์ ํด๋ฆญํ์ฌ ๊ฐ์ ํ๋ค.
- ํ์๊ฐ์ ์ ์คํจํ๋ฉด error message ์ก์ถํ๋ค.
- Login ํด๋ฆญ์ ๋ก๊ทธ์ธ ํ๋ฉด์ผ๋ก ์ด๋ํ๋ค.
- Id, Password ์ ๋ ฅ ํ, ๋ก๊ทธ์ธ ๋ฒํผ ํด๋ฆญ์ผ๋ก ๋ก๊ทธ์ธํ๋ค.
- ๋ก๊ทธ์ธ ์คํจ์ error message ์ก์ถํ๋ค.
- ๋ก๊ทธ์ธ์ ์ฑ๊ณตํ๋ฉด ํ๋ฉด ์ค๋ฅธ์ชฝ ์๋จ์ Login ๋ฒํผ์ด Logout ์ผ๋ก ๋ฐ๋๋ค.
- Logout ํด๋ฆญ์ ์ฌ์ดํธ์์ ๋ก๊ทธ์์ ๋๋ค.
Market
- ๊ฒ์๊ธ ๋ฆฌ์คํธ์ ๊ฒ์๊ธ ํด๋ฆญ์, ๊ฒ์๊ธ์ ์์ธ ํ์ด์ง๋ก ์ด๋ํ๋ค.
- ๊ฒ์๊ธ ๋ฆฌ์คํธ์ ์๋จ์ ์์นํ ๊ฒ์๊ธ ์์ฑ ๋ฒํผ์ ๋๋ฅด๋ฉด ๊ฒ์๊ธ ์์ฑ ํ๋ฉด์ผ๋ก ์ด๋ํ๋ค.
- ํด๋ผ์ด์ธํธ๋ ์๋ฒ์ NFT ์ ๋ณด๋ฅผ ์์ฒญํ๊ณ ์๋ฒ๋ DB์ ์ ์ฅ๋ NFT ์ ๋ณด๋ฅผ ์๋ตํ๋ค.
- ํด๋ผ์ด์ธํธ๋ ์๋ต๋ฐ์ ์ ๋ณด๋ฅผ marketplace ํ์ด์ง์ ๋ณด์ฌ์ค๋ค.
- NFT ์ค ํ๋๋ฅผ ๋๋ ์ ๋ ์ง๊ฐ์ฐ๊ฒฐ์ด ๋์ด์์ผ๋ฉด ๊ตฌ๋งค ํ์ด์ง๋ก, ์๋๋ฉด ์ง๊ฐ ์ฐ๊ฒฐ ํ์ด์ง๋ก ์ด๋ํ๋ค.
Create (NFT Create)
- ์ง๊ฐ ์ฐ๊ฒฐ [URClass eth์ฐ๊ฒฐ]
- ์ฐ๊ฒฐ์ด ๋์ง ์์ ์ํฉ์์ค๋ฅธ์ชฝ ์ ์ง๊ฐ์ ๋๋ฅด๊ฑฐ๋, ์ค๋ฅธ์ชฝ ์ ์ฌ์ฉ์๋ฅผ ๋๋ฅด๊ฑฐ๋, Explore์์ NFT๋ฅผ ๋๋ ์ ๋ ์ด๋ํ๋ค.
- ์ง๊ฐ์ ํด๋ฆญํ๋ฉด MetaMask ์ง๊ฐ์ ํ์ํ๋ค.
- ์ง๊ฐ์ ๋ก๊ทธ์ธํ๋ฉด ์ฌ์ดํธ์ ๋ก๊ทธ์ธ๋๋ค.
- ์ฌ์ฉ์๋ ์์ ์ด ๋ณด์ ํ ICํ ํฐ์ ์ธ์ฆํ๊ณ , NFT ์์ฑ์ ์ํด Create ๋ฒํผ์ ๋๋ฌ create ํ๋ฉด์ผ๋ก ์ด๋ํ๋ค.
- ํด๋ผ์ด์ธํธ๋ ์ฌ์ฉ์์๊ฒ NFT CreationFrom์ ์ ๊ณตํ๋ค.
- ์ฌ์ฉ์๋ ์ด๋ฏธ์ง์ ์ ๋ณด๋ฅผ ์ ๋ ฅํ๊ณ Create NFT ๋ฒํผ์ ํด๋ฆญํ์ฌ NFT ์ ๋ณด๋ฅผ IPFS์ ์ ๋ก๋ ์์ฒญํ๋ค.
- ์ด๋ฏธ์ง๋ฅผ IPFS์ ์ ์ฅ ํ ์ด๋ฏธ์ง IPFS URI๋ฅผ ์ ๋ ฅํ ์ ๋ณด์ ์ถ๊ฐํ์ฌ metadata.json ํ์ผ์ IPFS์ ์ ๋ก๋ํ๋ค.
- ์ ๋ก๋ ์๋ฃ ํ, ์ ๋ก๋๋ ์ด๋ฏธ์ง๋ My Page์ Minted List์์ ํ์ธํ ์ ์๋ค.
My Page
- ๋ก๊ทธ์ธํ ์ฌ์ฉ์์ ์์ธ ์ ๋ณด ํ์ธ.
- ์ฌ์ฉ์๊ฐ ๋ณด์ ํ ICํ ํฐ์ ํ์ธ.
- ์ฌ์ฉ์๊ฐ ๋ณด์ ํ NFT ์กฐํ.
- ๊ตฌ๋งคํ NFT ๋ชฉ๋ก ์กฐํ / ๋ฏผํ ํ NFT ๋ชฉ๋ก ์กฐํ.
- ์ฌ์ฉ์๊ฐ ์์ฑํ ๊ฒ์๊ธ ํ์ธ.
- ์ฌ์ฉ์๊ฐ ์์ฑํ ๋๊ธ ํ์ธ.
ํ์ ๊ตฌํ
- ๋ก๊ทธ์ธ / ๋ก๊ทธ์์
- ํ์๊ฐ์
- ๊ฒ์๊ธ ์ฝ๊ธฐ ๋ฐ ์์ฑ
- ๊ฒ์๊ธ์ ๋ํ ๋๊ธ ์์ฑ
- ๊ฒ์๊ธ์ ์์ฑ์๊ฐ ๋๊ธ ์ฑํ
- ์ฑํ๋ ๋๊ธ์ ์์ฑ์๋ ๋ณด์์ผ๋ก ICํ ํฐ์ ๋ฐ์
- ICํ ํฐ์ ๋ฏผํ ํ NFT ํ ํฐ์ผ๋ก ๊ตํ
- NFT Create๋ฅผ ํ๋ฉด ๋ฐ์ดํฐ๋ฒ ์ด์ค์ ์ ์ฅ
- Minted List์์ ๋ฐ์ดํฐ๋ฅผ ๋ฐ์์์ ๋ณด์ NFT ํ์
์ถ๊ฐ ๊ธฐ๋ฅ ๊ตฌํ
- ๋ด NFT ์ปฌ๋ ์ ํ์ด์ง ์กฐํ ๊ธฐ๋ฅ.
- ์ฌ์ฉ์ NFT ํ์ด์ง ์กฐํ ๊ธฐ๋ฅ.
- ๋ต๋ณ ์ฑํ์ด ์๋ฃ๋ ๊ฒ์๊ธ์ ์๋ฃ ๋ฆฌ์คํธ๋ก ์ด๋ํ๊ธฐ.
- ๋ณด์ ํ ICํ ํฐ๊ณผ NFT ์ ์ก ๊ธฐ๋ฅ.
- ๋ณด์ ํ NFT ํ๋งค ๊ธฐ๋ฅ.
.env
ํ์ผ์ ์์ฑํ์ฌ ๋ค์๊ณผ ๊ฐ์ด ํ๊ฒฝ ๋ณ์๋ฅผ ์ถ๊ฐํ๋ค.
- client
REACT_APP_SECRET_KEY=
REACT_APP_SERVER_URL=http://127.0.0.1:8080
- server
PORT=8080
SERVER_BANNER=
DB_USER_NAME=root
DB_USER_PASSWORD=
DB_DATABASE_NAME=HALP_ME
DB_HOST=127.0.0.1
DB_DIALECT=mysql
- contract
SERVER_ADDRESS=๊ฐ๋์ ์ฒซ๋ฒ์งธ ๊ณ์
SERVER_SECRET_KEY=๊ฐ๋์ ์ฒซ๋ฒ์งธ ๊ณ์ ๋น๋ฐ ํค
CONTRACT_ADDRESS=๋ด๊ฐ ๋ฐฐํฌํ ์ปจํธ๋ํธ ์ฃผ์
RPC_URL=http://127.0.0.1:7545/
# client
cd client
npm install
npm start
# server
cd server
npm install
npm start
# install truffle & ganache
npm install -g truffle
npm install -g ganache-cli
# ํ๋กฌํํธ ์คํ
truffle develop
# ์ปดํ์ผ
compile
# ๋ฐฐํฌ
migrate
# ํ
์คํธ
test