YugiDeck

2020

react

redux

firebase cloud functions

firebase cloud firestore

firebase authentication

react bootstrap

sweetalert2

react router

react icons

firebase hosting

axios

Description

YugiDeck is a serverless app that allows user to build an unlimited deck of Japanese Yu-Gi-Oh! Trading Card Game developed by Konami. This app is using YGOPRODeck public Yu-Gi-Oh! API to access enormous Yu-Gi-Oh! card database with over 10.000 cards available to view.

I created this app to have a deeper understanding about React, especially React Hooks. I have learned that we can use hooks to separate stateful logic in our components to other functions, make our components cleaner and also allow us to reuse that stateful logic. Hooks are not only making our functional components have state like class component, it's more than that!

In this application, I also focus on studying Firebase services such as Authentication, Cloud Function, Cloud Firestore, and Hosting. I have learned how to write security rules and use cloud functions to restrict and validate CRUD operation on our collections in Cloud Firestore.

Screenshots

scrsht
scrsht
scrsht
scrsht
scrsht