*[Exercise 4: info/G and info/T](#exercise-4-infog-and-infot)
*[Exercise 5: Error](#exercise-5-error)
*[Exercise 6: Index.html](#exercise-6-indexhtml)
*[End of the session](#end-of-the-session)
*[Credits](#credits)
*[License](#license)
## Introduction
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 Tiamine base. Color: pink |
| **/** | index.html | Main page: index. Color: white |
| any other | error.html | Error page. Color: red |
## Exercises
Let's implement the **web werver** step by step.
### Exercise 1: 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.
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 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>
```
### Exercise 2: info/A
***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).
***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**.
***Filenames**: P04/html/info/G.html, P04/html/info/T.html, and P04/e4.py
***Description**: Extend the previous web server to 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 that has not been implemented, and error page should be shown with a red background.
***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) to include a **link** to the **main page**. In this **animation** you can see how it works:
*[Exercise 4: info/G and info/T](#exercise-4-infog-and-infot)
*[Exercise 5: Error](#exercise-5-error)
*[Exercise 6: Index.html](#exercise-6-indexhtml)
*[End of the session](#end-of-the-session)
*[Credits](#credits)
*[License](#license)
## Introduction
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 Tiamine base. Color: pink |
| **/** | index.html | Main page: index. Color: white |
| any other | error.html | Error page. Color: red |
## Exercises
Let's implement the **web werver** step by step.
### Exercise 1: 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.
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 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>
```
### Exercise 2: info/A
***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).
***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**.
***Filenames**: P04/html/info/G.html, P04/html/info/T.html, and P04/e4.py
***Description**: Extend the previous web server to 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 that has not been implemented, and error page should be shown with a red background.
***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) to include a **link** to the **main page**. In this **animation** you can see how it works:
*[Universidad Rey Juan Carlos de Madrid](https://www.urjc.es/)
*[Escuela Técnica Superior de Ingeniería de Telecomunicaciones (URJC)](https://www.urjc.es/universidad/facultades/escuela-tecnica-superior-de-ingenieria-de-las-telecomunicaciones/content/etsit-escuela-tecnica-superior-de-ingenieria-de-telecomunicacion)
