Phone Catalogue Challenge

Project Structure:

Installation

First we need to clone the project

$ git clone https://github.com/f-naranjo/gschallenge.git

Then we will go to the server folder inside the repo and set up:

$ cd server
$ npm i
$ touch .env

Open the .env file we have just created inside server folder and create a new variable PORT with a value of 4000:

PORT=4000

Now we can run the server:

$ npm run start

Now we need to set up the client folder:

$ cd..
$ cd client
$ npm install
$ touch .env

Open the .env file we have just created inside server folder and create a new variable:

REACT_APP_API_URL=http://localhost:4000

Run the App:

npm start

Go to http://localhost:3000 to see the phone catalogue and click the links to see phone details.

You can also navigate to a Phone detail Page by going to the direct link following this structure:

http://localhost/3000/{PhoneName}/detail

If the user tries to go to a link that doesn't exist he will be redirected to a 404 page.

If the server send a bad request, the user will be notified by an error message.

Francisco Naranjo