Device-Emulator

Device-Emulator is an application which emulates the behavior of controllers so they don't need to be hit multiple times for data fetching. This application will be primarily used by developers at Errigal on top of their internal apps like RDF, SNMP manager, and can be extended to work with other with minimal/no changes in the existing code-base.

The purpose of the Device Emulator is to provide reliable testing mocks for network devices. This is achieved by establishing a proxied connection between the development machine and the device to be tested and caching the responses corresponding to each request. In practice, this means that the first of any particular request goes straight through to the device, while all subsequent requests receive a cached copy of the response.

The emulator is divided into two parts: the proxy server itself, and the proxy api server for modifying the database of requests and responses.

BackEnd Proxy Server & Express API

FrontEnd

Device Emulator

Presentation The slides were presented on Wednesday, 3rd April 2019. They give a concise definition of the problem statement and other relevant details regarding the project.

The apps are deployed on scotty as follows

Proxy Server - Hostname : 10.5.5.30 Port : 3000

Express Api - Hostname : 10.5.5.30 Port : 8080 FrontEnd -

Prerequisite

Ensure you have Node.js latest stable build installed. The build should be accompanied with npm to install the packages.

• Git clone https://bitbucket.org/errigal/device_emulator/src/node-proxies/
• CD into device_emulator and make sure you're on the node-proxies branch
• Run npm install in the project root directory. Once the install completes, the proxy can be started with node express_proxy and the server with node express_server [they will be served on different ports respectively]
• The device emulator expects details of the database to be provided on launch. This can be accomplished with a dbparams file in the working directory, or preferably using environment variables as follows:

DBHOST The host url of the database

username DBUSER The user which the device emulator will be logged in to MySQL as

password DBPASS The password for the database user

database DBNAME The name of the database where our data will be stored

• Additionally, the details can be passed directly using a command line argument like DBNAME=proxy DBHOST=localhost DBUSER=proxy DBPASS=notsame1 node express_proxy.js
• If the above steps are completed successfully, the proxy should be running and ready to use.

To use the device emulator, the end user must adjust their network settings to forward all traffic to the proxy server

Windows If you are using Windows, open the Internet Options dialog by launching the Control Panel, selecting “Network and Internet”, and then selecting “Internet Options”. Select the Connections tab, then the LAN Settings button, which will open the LAN settings dialog. Check the box marked “Use a proxy server for your LAN” Check the box “Bypass proxy server for local addresses” Enter the proxy server's address in the address box, and set the Port number to 3000 Save changes by clicking OK.

Mac Open the Network window by opening System Preferences and clicking Network Click the Advanced button with your current network selected Click the Proxies tab and check both HTTP and HTTPS proxies For both protocols, enter the proxy server address and set the port to 3000 Click Ok, then Apply to save the settings

The proxy runs on port 3000 and provides both a HTTP and HTTPS proxy using the hoxy node.js library. HTTPS is achieved by an imposter server certified by a fake CA which must be explicitly trusted by the development computer to work. Once the proxy is running, it records every request-response pair to pass through it and saves them to a MySQL database.

To use the proxy server to access HTTPS endpoints, it is necessary to have the local computer trust the fake CA used by the Device Emulator. The CA cert and key files are saved in the Drive folder for this project, for the purposes of this guide, only the cert file is needed.

Fake Certificates

Windows If you're using Microsoft Windows, click the search box on the taskbar or in the Start menu, and type “mmc” to launch the Microsoft Management Console. Click the “File” menu and click “Add/Remove Snap-In.” Click “Certificates” under “Available Snap-ins,” then click “Add.” Click “OK,” then click “Computer account” and the “Next” button.

Click “Local Computer,” then click the “Finish” button. Double-click “Certificates (Local Computer)” in the tree menu, then right-click “Trusted Root Certification Authorities Store.” Click “All Tasks” in the pop-up menu, then click “Import.” Follow the instructions to find and import the certificate in question.

Mac If you're using an Apple Mac computer, you can import a root certificate for a certificate authority using the Keychain system.

Type “Keychain Access” in the Spotlight search box, opened by clicking the magnifying glass in the top right of macOS. Click the icon to launch the app, then click the “File” menu and “Import Items.” Browse to find the root certificate file, and choose “System” in the “Destination Keychain” drop-down menu.

Enter your password if prompted to do so, and log in and out of the computer, or restart it. If the certificate doesn't seem to be immediately trusted – for example, you're receiving warnings or errors attempting to access resources – reopen “Keychain Access.” Right-click the certificate and click “Get Info.” Open the “Trust” menu, and under “When Using This Certificate,” check “Always Trust.”

## Overview

Device-Emulator-Front-End is an easy to use user-interface created for the device-emulator project. The purpose of this project is let developers get an overview of the recently called devices through various internal applications along with their request/response data respectively.

## Installation requirements.

This application is bootstrapped using [Create-React-App](https://github.com/facebook/create-react-app) and uses [Device-Emulator-API Server](https://10.5.5.30:8080) as an API end-point. To run the project locally,

1. Git clone this repository

 `git clone git@bitbucket.org:errigal/device-emulator-frontend.git`
 Cd into **device-emulator**

2. Ensure you've Node/Npm/Yarn installed to download the dependencies. The project uses following versions.

1. Node : v8.12.0
2. NPM : 6.4.1
3. Yarn : 1.9.4

3. It is recommended to use Yarn for downloading all the dependencies. But in it's absence, NPM would do the job. Perform the following commands from inside the project folder (directory where package.json is located)

 `yarn install` or `npm install`

4. Once the dependencies are downloaded, you can run the development project server by `npm start` . This should run the application on one of the available ports and the browser will be directed towards that port.

5. The environment variables file needs to be created manually (.env) and the data for the same will be sent to via slack. You can copy,paste that data and re-run the application to get the enviroment varibales working.

## Libraries Used

• [ReactJs](https://reactjs.org/)
• [Redux](https://redux.js.org/)
• [React-Redux](https://github.com/reduxjs/react-redux)
• [React-Router](https://github.com/ReactTraining/react-router)
• [React-Connected-Router](https://github.com/supasate/connected-react-router) : To keep the routes in-synch with the redux store.
• [Redux-Thunk](https://github.com/reduxjs/redux-thunk)
• [Prettier](https://github.com/prettier/prettier) : Code formatting.
• [ES-Lint](https://eslint.org/) : Code Linting.
• [Husky](https://github.com/typicode/husky) : Pre-Commit Utility.
• [Axios](https://github.com/axios/axios) : Promise based HTTP client.

#### Third Party React Web Components

- [Semantic UI React](https://react.semantic-ui.com/) : Component Based Styling library.

#### Style-Guide

- The application uses Semantic UI React components over the traditional semantic UI classes. - To over-ride the default styles of any component, look for styles.css files inside the components root directory & use '!important' attribute on the class which is suppose to be over-ridden.