: Web2.0과 Web3.0에서 블록체인을 이해하고 불공평한 교육문제를 해결하기 위한 영어교육 플랫폼 Dapp을 개발
🌐 목표
플랫폼에 맞게 영어교육과 함께 유저와 제공자 모두 경제적으로 부담없이 경제적으로 도움이 되는 생태계를 구축하려고 노력하였습니다. 블록체인 네트워크를 기반으로 영어 공부, 영어와 관련된 커뮤니티가 있는 하나의 생태계 플랫폼입니다. 토큰 TUT를 실제로 배포하여 활용하였고, 강좌구매와 유저 친화적인 커뮤니티 활동이 가능하는 것을 목표로 하였습니다
🙏 기술 스택
Front
- Typescript
- Javascript
- Node.js
- React, Redux
- Bootstrap
- JWS
Back
- Node.js
- Express
- web3.js
- ether.js
- postman
- Mysql
- Cheerio
SmartContract
- Solidity
- Ganache
- Ethers
- Web3
- Remix
- Etherscan
- Metamask
🙏 기능구현
- UI 구성
- 로그인 & 회원기가입 기능
- 커뮤니케이션 게시판 기능
- 회원가입 활동시 토큰발행
- 토큰 소각처로 강좌구매
- 영화 추천 커뮤니티
🕛 회원가입 화면
실제로 회원을 가입을 했을 때 중앙서버에서 지갑 주소와 프라이빗키를 생성 후에 주소에 토큰을 발급하고 관리를 하였습니다.
유저 편의성을 위해 실제로 자동으로 토큰을 추가
토큰을 실제로 받고 확인할 수 있으며 메타마스크로도 연동하고 실제 스마트컨트렉트에 토큰을 민팅한것도 확인 가능합니다!
🕒강좌 구매 화면
실제로 토큰을 활용하여 강좌 구매를 실행하고 크롤링하여 영어 단어 학습을 레벨에 맞게 할 수 있게 실행하였고 결과까지 확인가능합니다.
🕔게시물 화면
공지사항이나 의견을 받을 수 있는 게시판과 영어 컨텐츠 추천 화면을 만들었습니다.
🌐 Code Detail
let contract = new web3.eth.Contract(contractABI, tokenAddress, {
from: fromAddress,
});
let amount = web3.utils.toHex(web3.utils.toWei("10")); //lec_price로 TUT 갯수 설정
let data = contract.methods.transfer(toAddress, amount).encodeABI();
sendErcToken();
function sendErcToken() {
let txObj = {
gas: web3.utils.toHex(100000),
to: tokenAddress,
value: "0x00",
data: data,
from: fromAddress,
};
web3.eth.accounts.signTransaction(txObj, privateKey, (err, signedTx) => {
if (err) {
return console("signTransaction ERROR!", err);
} else {
console.log(signedTx);
return web3.eth.sendSignedTransaction(
signedTx.rawTransaction,
(err, res) => {
if (err) {
console.log(err);
} else {
// web3.eth.getBalance(toAddress);
console.log(res);
}
}
);
}
});
}🤔 회고
Keep(장점, 유지할 점)
빠른 피드백, 매일 학습과 프로젝트 진행도를 피드백을 하며 팀원들과 같이 진행사항을 공유하며 부족한점을 채울 수 있었다. 협업에서는 이런 부분들이 나에게도 팀원들에게도 많은 도움을 줄 수 있고 같은 방향을 바라볼 수 있겠다는 확신이 들었다. 나 스스로에게는 학습에 대해서 무서워하지 않았다는 것에 만족했다. 실제로 전 프로젝트를 했을 때와는 다르게 경험들이 마인드셋을 가져왔었다. 이런 부분들을 살려 자신감과 꾸준함을 살린다며 강점들을 더 살릴 수 있을 것이다 !
Problem(단점, 변경 또는 버릴 점)
블록체인 생태계에 대한 이해, 생태계를 유지하고 컨트렉트를 계속 수정하면서 전체적인 틀을 잡는 부분에 혼란이 있었다. 서비스적인 측면과 web3를 활용할 수 있는 측면, 중앙서버에 대한 관리, 스마트컨트랙트에 대한 보안 여러 부분들 고려하면서 동선을 바꿔서 시간을 많이 소모하였다. 특히 마무리에 스왑기능을 구현하고 싶었지만 시간문제로 진행하지 못한 부분과 컨트렉트 가스비와 속도 측면도 고려하면서 컨트렉트를 진행하지 못하여서 많은 아쉬움이 남았다.
Try(시도할 점, 앞으로의 행동)
처음 마주하는 스택들, 확실히 처음에 접했을 때는 이해라는 측면에서 접근하기 보다는 프로젝트를 위해서 사용한다는 느낌을 많이 봤았다. 진짜 “나의 것”인지에 대한 질문을 한다면 사실 그렇지 못한 부분들이 많을 것이다. 좀 더 부딪혀보고 나에게 맞는 방법을 찾는다면 자신감과 실제로 나의것이 될 수 있을 것이다 ! 좀더 구체적인 계획, 열정을 가지고 다양한 프로젝트를 만들어볼 계획이다!
Detail ) 추후계획을 세울려고합니다!
프론트 : 넷플릭스와 유사한 api와 비동기 처리에 익숙해지기위한 프로젝트를 만들고 있습니다!
백엔드 : slack과 같은 DB구축과 라이브채팅을 활용한 백엔드 학습을 진행하려고 합니다!
스마트컨트렉트 : 마스터링 솔리디티 학습과 현재 진행한 프로젝트에 활용 가능한 레이어2 폴리곤과 유니스왑을 활용한 프로젝트를 제작하려합니다!
<깃헙 참조>
