The goal of this practice is to develop a **web server**with information about the **four bases**: A, C, T and G. Each base should have **its page**, with the following information: **Name**, **letter**, **chemical formula** and a **link** to the wikipedia URL with **more information**. In addition, each page will be in a **different color**. This table describe the **names** of the resources (path) for getting the web pages
The goal of this assignment is to develop a **web server** that serves information about the **four DNA bases**: A, C, T and G. Each base should have **its own page**, with the following information: **Name**, **letter**, **chemical formula**, and a **link** to the wikipedia URL for **further information**. In addition, each page will be in a **different color**. This table describe the **names** of the resources (path) for getting the web pages
| Resource | html File | Description |
|----------|-----------|-------------|
| **/info/A** | A.html | Information about the Adenine base. Color: lightgreen |
| **/info/C** | C.html | Information about the Cytosine base. Color: yellow |
| **/info/G** | G.html | Information about the Guanine base. Color: ligthblue |
| **/info/T** | T.html | Information about the Guanine base. Color: pink |
| **/info/T** | T.html | Information about the Tiamine base. Color: pink |
| **/** | index.html | Main page: index. Color: white |
| any other | error.html | Error page. Color: red |
## Exercises
We will implement the **Web Server** step by step. The exercise will guide you
Let's implement the **web werver** step by step.
### Exercise 1: A.html
***Filename:** P4/A.html
***Filename:** P04/html/info/A.html
Let's start by writing the **HTML page** for the **Adenine** base. We will use it as a **template**. The pages for the other bases will be similar but with a different color and information
Let's start by writing the **HTML page** for the **Adenine** base. We will use it as a **template**. The pages for the other bases will be similar but with a different color and information.
You can **preview** your page with pycham. Just open the html file in pycharm and press on the top right brower icons. For example in firefox's icon:
You can **preview** your page with PyCham. Just open the html file in the program and press on the top right brower icons. For example in firefox's icon:
The page is quite similar to the Page of the **Green server**. Use the **H1 tags** for the base name, and the **P tags** for the **letter** and its**chemical formula**. Finally, you can place **links** to other **URLS** using the **a tag**. In this example you can see how to place a link to the wikipedia's main page:
The page is quite similar to the one we had for the **Green server**. Use the **h1 tags** for the base name, and the **p tags** for the **letter** and for the**chemical formula**. Finally, you can just write **links** to other **URLs** using the **a tag** like follows:
```html
<ahref="https://en.wikipedia.org/">Wikipedia</a>
...
...
@@ -60,70 +60,69 @@ The page is quite similar to the Page of the **Green server**. Use the **H1 tags
### Exercise 2: info/A
***Filename**: P4/EX2.py
***Description**: Write a webserver that returns the **A.html** file when the **info/A** resource is **requested** by the client. When the URL [**http://127.0.0.1:8080/info/A**](http://127.0.0.1:8080/info/A) is written in the browser, we should see the **web page** of the **A base**. If another resource is requested, the server will send a response message with a **blank body** (therefore a blank page will be shown)
***Filename**: P04/e2.py
***Description**: Write a webserver that returns the **A.html** file when the **info/A** resource is **requested** by the client. When the URL [**http://127.0.0.1:8080/info/A**](http://127.0.0.1:8080/info/A) is written in the browser, we should see the **web page** of the **A base**. If another resource is requested, the server will send a response message with a **blank body** (therefore a blank page will be shown).
***Description**: Extend the previous web server for accessing to the web pages of the **C base**, in addition to the A base. It should be available in the **path /info/C**
***Filenames**: P04/html/info/C.html, and P04/e3.py
***Description**: Extend the previous web server to provide information about the **C base**(in addition to the A base). It should be available in the **path /info/C**.
***Description**: Extend the previous web server for accessing to the web pages of the**G** and **T** bases, in addition to A and C. They should be available in the **path /info/G** and **/info/T** respectively
***Filenames**: P04/html/info/G.html, P04/html/info/T.html, and P04/e4.py
***Description**: Extend the previous web server fto provide information about bases**G** and **T** bases, in addition to A and C. They should be available in the **path /info/G** and **/info/T** respectively.
***Description**: Extend the previous web server. If the user tries to access to any other resource not implemented, and error page should be shown
***Filename:** P04/error.html, and P04/e5.py
***Description**: Extend the previous web server. If the user tries to access to any other resource that has not been implemented, and error page should be shown with a red background.
***Description**: Final version of the web server. When you connect to URL: [**http://127.0.0.1:8080/**](http://127.0.0.1:8080/) you get the main page: **index.html** with **links** to the other bases:
***Filename:** P04/html/index.html, and P04/webserver.py
***Description**: Final version of the web server. When you connect to URL: [**http://127.0.0.1:8080/**](http://127.0.0.1:8080/) you get the main page: **index.html** with **links** to the bases.
In addition, **modify** all the other **html** files (A.html, C.html, G.html, T.html and Error.html) for including a **link** to the **main page**. In this **animation** you can see how it works:
In addition, **modify** all the other **html** files (A.html, C.html, G.html, T.html, and error.html) to include a **link** to the **main page**. In this **animation** you can see how it works:
