---
# System prepended metadata

title: Preparing the web application

---

# Preparing the web application

![image](https://hackmd.io/_uploads/Bkxyu_jta.png)


### Purpose
Check that the created UI (web service) works locally before deploying to Azure App Service
As a concrete method, run Flask locally, Check whether HTTP communication is possible with the function created in Chapter 3

### How to create web service?
Create a web application using Flask
This application is a UI for using AOAI and Cognitive Search from a web browser
If you are just testing, it is efficient to debug locally without deploying to a resource, so the steps are summarized below

### Execution steps

Leave the functions created in Chapter 3(azure function) running and perform the following steps

1. Develop a web application (AZURE_CHAT_APP_DEMO)
2. Download/gitclone pre-built Azure_CHAT_APP_DEMO from [git](https://github.com/aifield-company/AZURE_CHAT_APP_DEMO) 
3. Go to "Azure_APP_services" directory and open app_train.py
4. Modify "app_train.py" as below (we are deploying locally so comment out the .net)
```
#functionendpoint = f"https://{functionresource}.azurewebsites.net/api/{functionapp}"
functionendpoint = f"http://localhost:7071/api/{functionapp}"
```
At this time, if there is a difference from the local host URL displayed when debugging the function created in the previous chapter, change the displayed URL. Rewrite to value

Note: Update the requirement.text file to setup the virtual environment

5. run python app_train.py locally 

Note: before that install the required libraries create a requirements.txt file and run the install command

```
# instal in local environment 
 pip install -r requirements.txt

azure-functions
azure-search-documents==11.4.0b6
openai[datalib]==0.27.8

# additional libraries
Flask==2.0.2
gunicorn==21.2.0
Werkzeug==2.2.2
# openai==0.28.1
# azure-search-documents==11.4.0b6
# azure-common==1.1.28
# azure-core==1.29.4
numpy

# instal in local environment 
 pip install -r requirements.txt
```
6. run the application 
```
python app_train.py

```
![image](https://hackmd.io/_uploads/SyBpZFsFa.png)


7. Open the give address with ctrl + left click to open the ip (eg: http://127.0.0.1:8080 )

8. Preview (enter text and send )
![image](https://hackmd.io/_uploads/Hyt4zFitp.png)

Success
