Witch Viewer

A place where you can interact with those wild mythical tokens

Table of Contents

• General Info
• Technologies
• Setup
• Features
• Improvements for future
• Video
• Contacts

General Info

This web app is designed to allow the user to interact with nfts that are queried from a third party api using the crypto coven nfts. I made this app as my final project for Flatiron school

Technologies

• React
• React Apollo
• TypeScript
• HTML
• CSS
• Styled Components
• MUI
• Javascript
• Rails
• Ruby
• Graphql
• Jest
• postgresql

Setup

To run this project:

1. You need to have postgresql installed on your device
2. Clone the repo to your computer
3. (assuming you have postgresql) In the terminal run sudo service postgresql start (you'll need to enter your user's password)
4. In the root directory run bundle install
5. In the root directory run rails db:migrate db:seed
6. Cd into the frontend directory
7. In the frontend directory run npm install
8. In the root directory run rails s
9. Open another terminal, go to the frontend directory and run npm start
10. Go to http://localhost:4000/
11. Create an account and enjoy!

Features

• Create an account / login / logout (auth)
• Infintie scroll with Graphql queries
• like witches and then view them in your favorite witches section
• See the most liked witches
• Click on a witch and see more details about it
• Click on a link on the witch details card that directs you to open sea or the witch source on crypto coven website
• Responsive design

Improvements for future

• Refactoring the code even further -- Even though I re used many components, I also repeated some
• Using styled components or individual css style attached to each component to keep the styling and editing organized and easier to access

Video

Website features

Contacts

Created by
Lior Levy

credits:

witch gif: https://community.king.com/en/bubble-witch-saga/discussion/255975/the-best-witch-gifs

third party api: https://www.cryptocoven.xyz/ https://github.com/dabit3/cryptocoven-api