Customer-Web-App

Overview of Customer-Web-App

The Customer-Web-App can be used as a client application and also as server application. It can be used as a backend api with backend-node-server and can also be as an web application with frontend.

Components

The Customer-Web-App have two components which are:

• frontend
• backend-node-server

Table of Contents

• Features
• Requirements
• Usage

Features

• View All Customers
• View Individual Customer Data
• Create New Customer
• Edit Customer Data
• Delete Customer

Requirements

Make sure you have installed all of the following prerequisites on your development machine:

• Git - Download & Install Git. MacOS and Linux machines typically have this already installed.

• Node.js - Download & Install Node.js and the npm package manager. Make sure to get the latest active LTS version.

• Download the Customer-Web-App from this link or use git clone git@github.com:Babanila/Customer-Web-App.git.

How to start backend-node-server(server)

• Go to your computer terminal (command-line interface).
• Locate the downloaded Customer-Web-App folder.
• Change the directory to the Customer-Web-App folder(e.g cd Customer-Web-App).
• Change to the backend-node-server folder(e.g cd backend-node-server).
• Run yarn install.
• To start the server, run yarn start on your terminal.

How to start frontend

Note: Start the backend server before starting the frontend (See above for details)

• Open another computer terminal (command-line interface).
• Locate the downloaded Customer-Web-App folder.
• Change the directory to the Customer-Web-App folder(e.g cd Customer-Web-App).
• Change to the frontend folder(e.g cd frontend).
• Run yarn install.
• Run yarn start.

frontend-react-app Usage

To run frontend-react-app, you need

• A web browser (e.g. Google Chrome, Mozila, Firefox e.t.c).
• A running server ( e.g start server with node server.js or yarn start).

To use the app , follow the steps below.

STEPS

• Enter the localhost address using port 8080 (e.g http://localhost:8080).
• Look at all the customers in the database.
• Click on any customer to see the details.
• E.t.c

Note:

Kindly check the README file in each directory for more  instructions (Hint) for usage.