The Earth | Devpost

Landing page
Sign in page
Dashboard page
Hard working hackers in a discord call approaching midnight

Inspiration

What it does

Daily is a web application consolidating the customers' different exchange funds into one virtual wallet, and providing a means of payment for everyday use much like Apple Pay… But with crypto! The payments are processed in real-time into fiat currencies with the help of trading bots. This gives the user an ease of access to using their crypto without transferring it between exchanges or converting it to FIAT to make purchases.

How we built it

Just like every good idea starts with a problem, every good product starts with a design! We kicked off the first day by discussing the problem. We came to terms on how to tackle the building process- tech stack, task distribution, main goal, Trello board setup, and checking the APIs- all that nitty-gritty stuff.

When choosing a stack, we considered efficiency, speed, and the group's familiarity with the technology. We created this full-stack application using Next.js, a React framework that gives you building blocks to develop web applications. Next.js handles the tooling and configuration needed for React.js and provides additional structure, features, and optimizations for your application.

The Second day started with Kurosh building the Git repository, Santeri looking into the APIs, Roy and Edward working on the Figma design. Viktors as the author of the idea helped with the design process using some of the design templates he had created before the hack. By lunch we managed to finish a large chunk of the design, had the repo up and APIs researched. After lunch we started working on the App itself- landing page, sign-in/up with a wallet connection and dashboard. The work was wrapped up with final touches being done at around 2 AM.

The morning of the third day was spent on largely final design touches, project descriptions, and demo filming.

Challenges we ran into

The initial idea of the login/signup screen was to enable users to also connect their wallets from Binance and Coinbase. As we delved into the API documentation it turned out that for doing that you need to have an established business. As a solution and alternative, we opted to move forward using only the decentralized Metamask wallet connection.

Accomplishments that we're proud of

We have designed and developed a fully functioning full-stack web3 application in under 48 hours. Most of us did not have much experience with Web3, but we still managed to build it by helping each other. Despite our differences in skillset, we collaborated gracefully and, in the process, also got to know, support, and learn from each other.

What we learned

We learned about the fundamentals of Web3.
We learned how to create a full-stack application with Next.js and React.js
We learned about design thinking and design patterns.
We learned about React.js and Next.js best practices
We learned how to collaborate in a team.

What's next for The Earth

Our team members have connected on LinkedIn, Github, etc. We agreed to keep in touch and possibly keep working on the idea even after the hackathon!

Built With

github
javascript
metamask
next.js
react

Submitted to

CodeX 2022

Created by

Initialized the project and created the documentation on the design pattern, pull requests, naming, etc.

I worked on the front and back end alongside Esteban, Edward, and Santeri.

I collaborated with team members throughout the project to ensure everyone was progressing.

Separated the task between the team members to ensure everyone had something to do and helped when needed.

Kurosh Husseini
I worked on the initial design of the web application using Figma, from brainstorming the possible designs with Victors to be synced with the main ideas of the project to coming up with the final UX/UI prototype along with other teammates.

roy
I worked on the Dashboard with Kurosh and Figma design and file exporting with Roy.

While coding it was my first time working with Nextjs so it took me time to get used to the folder system. Eventually I learned a lot with the help of my team and had a lot of fun!

Edward Toonela
I have learned a lot by doing this project with my teammates. We have always worked on discord together, to solve any questions we might have.

I have been both in the backend and frontend, making api requests as well as catching them from the front-end

I've worked mostly as a web3 developer, doing authentication with metamask, using the web3 package 'ethers' and ThirdWebProvided. We have done all transactions on the Goerli Testnet, with the possibility to move it at any time to production on the Ethereum Testnet by changing a variable. We have also made an automatic request for different prices that asks the user to make the transaction to our bot. With a switch to ethereum in real time using coingecko api. At the moment the user makes a transaction we automatically show a link with the hash of the transaction to check it in real time.

We also show the transaction history and balance of a user, using the etherscan api.

I am very happy with the work done during these two intense days, we have learned a lot about Nextjs, React and, above all, Web3 implementation.

Esteban Cabezas
Viktors
Santeri Pohjaranta