📖Introduction

Pokémon meet Shakespeare, a simple web translation app. Search for your favourite Pokémon and be greeted with a English Shakespeare style description of your chosen Pokémon.

🛠️ Built using

⛈️ Lighthouse report

✍️ Prerequisites

In order to run this app in your local machine you will need to have the following installed. Docker is optional


✔️	✔️	〰️	✔️

📂 Project Structure

pokedex
├── server
|   ├── __test__                 # all Jest test cases
|   ├── api                      # api endpoint 
|   |   ├── controllers          # route controllers
|   |   ├── middlewares          # middleware helpers for caching and error logs
|   |   ├── routes               # /pokemon routes
|   |   ├── services             # external API request to PokeAPI and Funtransaltion
|   |   └── utils                # utality used within server
|   ├── config                   # configuration of external library tools winston, morgan and express
|   ├── log                      # output log collection
|   └── 
└── client
    ├── cypress                  # Cypress frontend test
    └── src
        ├── components           # different atom sized components
        ├── styles               # reusable styled-component styles
        └── views                # pages

🔄 API Specification

Signature: GET endpoint: /pokemon/{pokemon-name}/

Example: http://localhost:8080/pokemon/charizard/

Output:

{
    "id": 6,
    "name": "charizard",
    "type": [
        {
            "slot": 1,
            "type": {
                "name": "fire",
                "url": "https://pokeapi.co/api/v2/type/10/"
            }
        },
        {
            "slot": 2,
            "type": {
                "name": "flying",
                "url": "https://pokeapi.co/api/v2/type/3/"
            }
        }
    ],
    "image": "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/other/official-artwork/6.png",
    "description": "At which hour this pokémon expels a fie of superhot fire,  
                   the red flame at the tip of its tail burns moo intensely.",
    "translated": true
}

⚡ Usage

This will cover how to run the project locally. To begin simply clone or download the repository

App	Ports
Client	http://localhost:3000
Server	http://localhost:8080

🔌 Run in your local machine

git clone https://github.com/tl-fredwintan/pokedex-shakespeare.git

Navigate to both client & server root folder to run

npm install

Once dependancies have been installed. To boot up both client and server application, go to '/client' folder and run. NOTE: If you have not yet installed nodemon globally you would need to do so. 'npm install -g nodemon'

npm run dev

🐳 Create Docker images

At the root folder of this project should contain docker-compose.yml file. This will spin up two image containers called pokedex_client & pokedex_server. Each container are seperate with their own Dockerfile and but the front-end is dependant on the server. Run the command:

docker-compose up

🧪 Testing

Using the library Jest & Cypress to conduct project testing

Client

Using: Cypress

An end-to-end testing of each component and expected page renders. By executing the command this will run both client & server app and open Cypress window

npm run test

Server

Using: Jest

All test are located within __test__ folder. This test covers all methods that retrieve all the data and compared with expected results.

npm run test

tl-fredwintan/pokedex-shakespeare