diff --git a/cs-CZ/meta.yml b/cs-CZ/meta.yml
index 4c4b8e7..40b64db 100644
--- a/cs-CZ/meta.yml
+++ b/cs-CZ/meta.yml
@@ -20,14 +20,14 @@ steps:
 - title: Co budeš dělat
 - title: Vytvoř aplikaci
   completion:
-    - engaged
+  - engaged
 - title: Přidej novou stránku
 - title: Vytvoř HTML šablonu
 - title: Použij CSS styl
   completion:
-    - internal
+  - internal
 - title: Dynamický obsah
   completion:
-    - external
+  - external
 - title: 'Výzva'
   challenge: true
diff --git a/cs-CZ/step_1.md b/cs-CZ/step_1.md
index 55670f7..4d737c1 100644
--- a/cs-CZ/step_1.md
+++ b/cs-CZ/step_1.md
@@ -9,22 +9,22 @@ Webový server bude schopen reagovat na dynamický obsah, který uživatel zadá
 
 - Raspberry Pi s nejnovějším operačním systémem Raspberry Pi OS
 
---- collapse ---
----
-title: Instalace Flasku
----
+## --- collapse ---
+
+## title: Instalace Flasku
 
 `Flask` by měl být předinstalován jako součást operačního systému Raspberry Pi, takže bys s ním neměl dělat nic dalšího.
 
 Můžeš jej nainstalovat ručně pomocí příkazu:
 
---- code ---
----
+## --- code ---
+
 language: bash
 line_numbers: false
----
+--------------------------------------------------------
+
 sudo apt install python3-flask
 
---- /code ---
+\--- /code ---
 
---- /collapse ---
\ No newline at end of file
+\--- /collapse ---
\ No newline at end of file
diff --git a/cs-CZ/step_2.md b/cs-CZ/step_2.md
index e62697b..f459bf3 100644
--- a/cs-CZ/step_2.md
+++ b/cs-CZ/step_2.md
@@ -1,101 +1,105 @@
 ## Vytvoř aplikaci
 
---- task ---
+\--- task ---
 
 Otevři terminál a pomocí příkazu `mkdir` vytvoř ve složce dokumentů nový adresář s názvem `webapp`.
 
---- code ---
----
+## --- code ---
+
 language: bash
 line_numbers: false
----
+--------------------------------------------------------
+
 mkdir ~/Documents/webapp
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Pro otevření nového adresáře použij příkaz `cd` pro změnu adresáře.
 
---- code ---
----
+## --- code ---
+
 language: bash
 line_numbers: false
----
+--------------------------------------------------------
+
 cd ~/Documents/webapp
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 V nabídce **Programování** otevři **Thony**.
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Přidej tento kód Pythonu do prázdného souboru.
 
---- code ---
----
+## --- code ---
+
 language: python
 line_numbers: false
----
+--------------------------------------------------------
+
 from flask import Flask
 
-app = Flask(__name__)
+app = Flask(**name**)
 
 @app.route('/')
 def index():
-    return 'Hello world'
+return 'Ahoj světe'
 
-if __name__ == '__main__':
-    app.run(debug=True, host='0.0.0.0')
+if **name** == '**main**':
+app.run(debug=True, host='0.0.0.0')
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Ulož nový soubor s názvem `app.py` do složky `webapp`, kterou jsi právě vytvořil.
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Vrať se do terminálového okna a spusť skript, který jsi právě napsal:
 
---- code ---
----
+## --- code ---
+
 language: bash
 line_numbers: false
----
+--------------------------------------------------------
+
 python3 app.py
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
 Pokud vše funguje správně, okno by mělo ukázat výstup podobný tomuto:
 
 ![spusť webovou aplikaci pi](images/pi-run-web-app.png)
 
---- task ---
+\--- task ---
 
 V nabídce Raspberry Pi otevři **Internet** > **Webový prohlížeč Chromium**
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Do adresního řádku zadej `localhost:5000` a stiskni <kbd>Enter</kbd>. Měl bys vidět uvítací stránku.
 
---- /task ---
+\--- /task ---
 
 ![Flask Ahoj světe](images/flask-hello-world.png)
 
diff --git a/cs-CZ/step_3.md b/cs-CZ/step_3.md
index b474c61..bf673ad 100644
--- a/cs-CZ/step_3.md
+++ b/cs-CZ/step_3.md
@@ -2,10 +2,9 @@
 
 Chceš-li do webové aplikace přidat novou stránku, vytvoř novou **trasu**.
 
---- collapse ---
----
-title: Co je to trasa?
----
+## --- collapse ---
+
+## title: Co je to trasa?
 
 V kódu, který již máš, je jedna trasa:
 
@@ -21,33 +20,33 @@ Tato trasa se skládá ze tří částí:
 - `def index()`: název trasy - `index`
 - `return 'Hello world'`: obsah, který uživatel uvidí - `Hello world`
 
---- /collapse ---
+\--- /collapse ---
 
---- task ---
+\--- task ---
 
 Přidej kód pro novou trasu do souboru `app.py` a soubor **ulož**.
 
---- code ---
----
+## --- code ---
+
 language: python
 line_numbers: true
 line_number_start: 5
 line_highlights: 9-11
----
+----------------------------------------------------------
 
 @app.route('/')
 def index():
-    return 'Ahoj světe'
+return 'Ahoj světe'
 
 @app.route('/dorty')
 def dorty():
-    return 'Vynikající dorty!'
+return 'Vynikající dorty!'
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 V prohlížeči Chromium zadej do adresního řádku adresu `localhost:5000/cakes`.
 
@@ -55,4 +54,4 @@ Měl bys vidět webovou stránku s textem „Mňam dorty!“.
 
 ![Chutné dorty](images/flask-cakes.png)
 
---- /task ---
+\--- /task ---
diff --git a/cs-CZ/step_4.md b/cs-CZ/step_4.md
index 1fe9643..eebe28f 100644
--- a/cs-CZ/step_4.md
+++ b/cs-CZ/step_4.md
@@ -2,42 +2,43 @@
 
 Styl stránky můžeš upravit pomocí **šablony**. Šablona bude používat **HyperText Markup Language (HTML)**.
 
---- task ---
+\--- task ---
 
 Přejdi do terminálu a stiskni <kbd>Ctrl</kbd> + <kbd>C</kbd> pro zastavení Flask serveru.
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Vytvoř adresář `templates` ve tvém adresáři `webapp`:
 
---- code ---
----
+## --- code ---
+
 language: bash
 line_numbers: false
----
+--------------------------------------------------------
+
 mkdir templates
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Vrať se do **Thony** a vytvoř nový soubor. Ulož tento soubor jako `index.html` do složky `templates`.
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Přidej tento kód do souboru `index.html` a **ulož** změny.
 
---- code ---
----
+## --- code ---
+
 language: html
 line_numbers: true
----
+-------------------------------------------------------
 
 <html>
 <body>
@@ -45,73 +46,73 @@ line_numbers: true
 </body>
 </html>
 
---- /code ---
+\--- /code ---
 
 ![Nový soubor s názvem index.html obsahující výše uvedený kód](images/html-file.png)
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Vrať se do souboru `app.py` a změň první řádek kódu:
 
---- code ---
----
+## --- code ---
+
 language: python
 line_numbers: true
----
+-------------------------------------------------------
 
 from flask import Flask, render_template
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Změň trasu `index()` tak, aby používala tvou HTML šablonu `index.html`:
 
---- code ---
----
+## --- code ---
+
 language: python
 line_numbers: true
 line_number_start: 5
 line_highlights: 7
----
+-------------------------------------------------------
 
 @app.route('/')
 def index():
-    return render_template('index.html')
+return render_template('index.html')
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Ulož soubor `app.py` a poté se vrať do terminálu a spusť jej pro restartování serveru:
 
---- code ---
----
+## --- code ---
+
 language: bash
 line_numbers: false
----
+--------------------------------------------------------
 
 python3 app.py
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 V prohlížeči **Chromium** přejdi na stránku `localhost:5000/` a zobrazí se ti nová HTML šablona.
 
 ![Webový prohlížeč ukazoval na localhost:5000 s textem „Moje webová stránka“ velkým písmem v záhlaví](images/flask-template.png)
 
---- /task ---
+\--- /task ---
 
diff --git a/cs-CZ/step_5.md b/cs-CZ/step_5.md
index 0e39c80..8d8956d 100644
--- a/cs-CZ/step_5.md
+++ b/cs-CZ/step_5.md
@@ -2,78 +2,81 @@
 
 **Kaskádové styly (CSS)** jsou pravidla, která prohlížeči sdělují, jak má zobrazovat obsah HTML.
 
---- task ---
+\--- task ---
 
 Otevři nové okno terminálu, abys mohl nechat webový server Flask spuštěný v tom druhém.
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Ujisti se, že jsi v adresáři `webapp`, a to pomocí tohoto příkazu:
 
---- code ---
----
+## --- code ---
+
 language: bash
 line_numbers: false
----
+--------------------------------------------------------
 
 cd ~/Documents/webapp
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Vytvoř nový adresář s názvem `static`.
 
---- code ---
----
+## --- code ---
+
 language: bash
 line_numbers: false
----
+--------------------------------------------------------
+
 mkdir static
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Vrať se do **Thony** a vytvoř nový soubor. Ulož tento soubor jako `style.css` do složky `static`.
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Přidej následující CSS pravidla do souboru `style.css` a poté soubor **ulož**. Toto je tvůj stylový list.
 
---- code ---
----
+## --- code ---
+
 language: css
 line_numbers: true
----
+-------------------------------------------------------
+
 body {
-    background: beige;
-    color: blue;
+background: beige;
+color: blue;
 }
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Nyní uprav HTML šablonu `index.html` tak, aby obsahovala CSS styly:
 
---- code ---
----
+## --- code ---
+
 language: css
 line_numbers: true
 line_number_start: 1
 line_highlights: 2-4
----
+---------------------------------------------------------
+
 <html>
 <head>
 <link rel="stylesheet" href="/static/style.css" />
@@ -83,22 +86,21 @@ line_highlights: 2-4
 </body>
 </html>
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Ulož změny do souboru `index.html`, poté se vrať do **Chromia** a obnov stránku prohlížeče. Měli bys vidět barevnou verzi webové aplikace!
 
 ![Aplikace Flask s barvou](images/flask-app-with-colour.png)
 
---- /task ---
+\--- /task ---
+
+## --- collapse ---
 
---- collapse ---
----
-title: Nevidím barvy
----
+## title: Nevidím barvy
 
 Pokud tvá webová aplikace nevypadá správně, soubor CSS se pravděpodobně nenachází ve správném adresáři.
 
@@ -113,4 +115,4 @@ Ujisti se, že adresář projektu `webapp` obsahuje následující soubory a má
     └── cakes.html
 ```
 
---- /collapse ---
\ No newline at end of file
+\--- /collapse ---
\ No newline at end of file
diff --git a/cs-CZ/step_6.md b/cs-CZ/step_6.md
index 35d5fe0..858716b 100644
--- a/cs-CZ/step_6.md
+++ b/cs-CZ/step_6.md
@@ -4,49 +4,51 @@ Webové stránky jako Facebook, YouTube a BBC News mají dynamický obsah: tyto
 
 Nyní si na svém webu vytvoř novou trasu, aby se ti na stránce zobrazovalo personalizované uvítání.
 
---- task ---
+\--- task ---
 
 Otevři soubor `app.py` a přidej do aplikace novou trasu:
 
---- code ---
----
+## --- code ---
+
 language: python
 line_numbers: true
 line_number_start: 5
 line_highlights: 9-11
----
+----------------------------------------------------------
+
 @app.route('/')
 def index():
-    return render_template('index.html')
+return render_template('index.html')
 
 @app.route('/hello/<name>')
 def hello(name):
-    return render_template('page.html', name=name)
+return render_template('page.html', name=name)
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Vytvoř novou HTML šablonu ve složce templates s názvem `page.html` a přidej do ní následující HTML kód:
 
---- code ---
----
+## --- code ---
+
 language: html
 line_numbers: true
----
+-------------------------------------------------------
+
 <html>
 <body>
 <h1>Ahoj {{ name }}!</h1>
 </body>
 </html>
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Ulož oba soubory a poté v prohlížeči Chromium navštiv stránku `localhost:5000/hello/Paul`.
 
@@ -54,39 +56,39 @@ Stránka by měla vypadat přibližně takto:
 
 ![Webová stránka zobrazující text „Ahoj Paule!“](images/flask-hello-paul.png)
 
-Zkus nahradit `Paul` v adresním řádku jiným jménem!
+Zkus nahradit „Paul“ v adresním řádku jiným jménem!
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Otevři šablonu `index.html` a pod nadpis přidej odkaz na úvodní stránku.
 
---- code ---
----
+## --- code ---
+
 language: html
 line_numbers: true
 line_number_start: 6
 line_highlights: 7
----
+-------------------------------------------------------
+
 <h1>Moje webová stránka</h1><a href="/hello/paul">Ahoj Pavle</a>
 
---- /code ---
+\--- /code ---
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Ulož změny do souboru `index.html` a poté otevři soubor `localhost:5000`, abys viděl aktualizovanou verzi.
 
-![Webová stránka s modrým textem na béžovém pozadí. Text v záhlaví zní „Moje webová stránka“ a poté odkaz na „Ahoj Paule“](images/flask-app-link.png)
+Webová stránka s modrým textem na béžovém pozadí. Text v záhlaví zní „Moje webová stránka“ a poté odkaz na „Ahoj Paule“](images/flask-app-link.png)
+
+\--- /task ---
 
---- /task ---
+## --- collapse ---
 
---- collapse ---
----
-title: Jak tato trasa funguje?
----
+## title: Jak tato trasa funguje?
 
 - `@app.route('/hello/<name>')`: část `<name>` předává text zapsaný v URL do funkce `hello` jako proměnnou s názvem `name`.
 - `def hello(name)`: toto je funkce, která určuje, jaký obsah se zobrazí. Zde funkce bere zadaný název jako parametr.
@@ -102,4 +104,4 @@ Tento kód říká šabloně, aby použila proměnnou `name`, která byla před
 
 Návštěva `localhost:5000/hello/` bez názvu (jména) vytvoří chybu.
 
---- /collapse ---
\ No newline at end of file
+\--- /collapse ---
\ No newline at end of file
diff --git a/cs-CZ/step_7.md b/cs-CZ/step_7.md
index 70ece1d..cbca35f 100644
--- a/cs-CZ/step_7.md
+++ b/cs-CZ/step_7.md
@@ -1,25 +1,25 @@
 ## Výzva
 
---- task ---
+\--- task ---
 
 Přidej pro svůj web další trasu.
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Vyhledej si **hex kódy** pro další barvy, které bys mohl použít ve svém CSS.
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Vyhledej si další HTML tagy, které můžeš použít ve svých šablonách.
 
---- /task ---
+\--- /task ---
 
---- task ---
+\--- task ---
 
 Použij dynamický obsah na svém webu jiným způsobem.
 
---- /task ---
\ No newline at end of file
+\--- /task ---
\ No newline at end of file
diff --git a/cs-CZ/step_8.md b/cs-CZ/step_8.md
index 9b06d84..6c984d1 100644
--- a/cs-CZ/step_8.md
+++ b/cs-CZ/step_8.md
@@ -1,25 +1,17 @@
 ## Co můžeš dělat dál?
 
-Vyzkoušej si náš projekt [Úvod do webu](https://projects.raspberrypi.org/cs-CZ/pathways/web-intro), kde se naučíš, jak strukturovat a stylizovat webové stránky pomocí obrázků, seznamů, fontů, citací, odkazů a animací.
+Vyzkoušej si náš projekt [Úvod do webu](https://projects.raspberrypi.org/en/pathways/web-intro), kde se naučíš, jak strukturovat a stylizovat webové stránky pomocí obrázků, seznamů, fontů, citací, odkazů a animací.
 
---- print-only --- 
+\--- print-only ---
 
 ![Dokončený projekt](images/solution.png)
 
---- /print-only ---
+\--- /print-only ---
 
---- no-print ---
+\--- no-print ---
 
-<iframe src="https://editor.raspberrypi.org/cs-CZ/embed/viewer/anime-expressions-complete" width="600" height="800" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen> </iframe>
+<iframe src="https://editor.raspberrypi.org/en/embed/viewer/anime-expressions-complete" width="600" height="800" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen> </iframe>
 
---- /no-print ---
+\--- /no-print ---
 
-Nebo proč nezkusit jiný projekt [HTML a CSS](https://projects.raspberrypi.org/cs-CZ/projects?software%5B%5D=html-css-javascript).
-
-***
-
-Tento projekt byl přeložen dobrovolníky:
-
-Miroslav Kuba
-
-Díky dobrovolníkům můžeme dát lidem po celém světě šanci se učit ve svém vlastním jazyce. Můžete nám pomoci oslovit více lidí dobrovolným překládáním - více informací na [rpf.io/translate](https://rpf.io/translate).
+Nebo proč nezkusit jiný projekt [HTML a CSS](https://projects.raspberrypi.org/en/projects?software%5B%5D=html-css-javascript).
\ No newline at end of file
diff --git a/de-DE/images/banner.png b/de-DE/images/banner.png
new file mode 100644
index 0000000..082983c
Binary files /dev/null and b/de-DE/images/banner.png differ
diff --git a/de-DE/images/flask-app-link.png b/de-DE/images/flask-app-link.png
new file mode 100644
index 0000000..c75fee1
Binary files /dev/null and b/de-DE/images/flask-app-link.png differ
diff --git a/de-DE/images/flask-app-with-colour.png b/de-DE/images/flask-app-with-colour.png
new file mode 100644
index 0000000..11aee4b
Binary files /dev/null and b/de-DE/images/flask-app-with-colour.png differ
diff --git a/de-DE/images/flask-cakes.png b/de-DE/images/flask-cakes.png
new file mode 100644
index 0000000..2232934
Binary files /dev/null and b/de-DE/images/flask-cakes.png differ
diff --git a/de-DE/images/flask-hello-paul.png b/de-DE/images/flask-hello-paul.png
new file mode 100644
index 0000000..e6b519e
Binary files /dev/null and b/de-DE/images/flask-hello-paul.png differ
diff --git a/de-DE/images/flask-hello-world.png b/de-DE/images/flask-hello-world.png
new file mode 100644
index 0000000..fa6c410
Binary files /dev/null and b/de-DE/images/flask-hello-world.png differ
diff --git a/de-DE/images/flask-template.png b/de-DE/images/flask-template.png
new file mode 100644
index 0000000..a62457e
Binary files /dev/null and b/de-DE/images/flask-template.png differ
diff --git a/de-DE/images/html-file.png b/de-DE/images/html-file.png
new file mode 100644
index 0000000..dead737
Binary files /dev/null and b/de-DE/images/html-file.png differ
diff --git a/de-DE/images/idle-css.png b/de-DE/images/idle-css.png
new file mode 100644
index 0000000..090a1ac
Binary files /dev/null and b/de-DE/images/idle-css.png differ
diff --git a/de-DE/images/idle-html.png b/de-DE/images/idle-html.png
new file mode 100644
index 0000000..f3d229a
Binary files /dev/null and b/de-DE/images/idle-html.png differ
diff --git a/de-DE/images/open-terminal.png b/de-DE/images/open-terminal.png
new file mode 100644
index 0000000..c4bf48e
Binary files /dev/null and b/de-DE/images/open-terminal.png differ
diff --git a/de-DE/images/open-text-editor.png b/de-DE/images/open-text-editor.png
new file mode 100644
index 0000000..552b289
Binary files /dev/null and b/de-DE/images/open-text-editor.png differ
diff --git a/de-DE/images/pi-run-web-app.png b/de-DE/images/pi-run-web-app.png
new file mode 100644
index 0000000..6973df6
Binary files /dev/null and b/de-DE/images/pi-run-web-app.png differ
diff --git a/de-DE/images/solution.png b/de-DE/images/solution.png
new file mode 100644
index 0000000..9f2de5a
Binary files /dev/null and b/de-DE/images/solution.png differ
diff --git a/de-DE/meta.yml b/de-DE/meta.yml
new file mode 100644
index 0000000..a524516
--- /dev/null
+++ b/de-DE/meta.yml
@@ -0,0 +1,33 @@
+---
+title: Build a Python Web Server with Flask
+hero_image: images/banner.png
+description: Install the Python web framework Flask and set up a basic web server with different pages
+original_url: https://raspberrypi.org/learning/python-web-server-with-flask
+theme: yellow
+duration: 2
+listed: true
+ingredient: false
+copyedit: true
+curriculum: 3, design-0, programming-3, phys-comp-0, manufacture-0, community-0
+interests: ''
+technologies: python, html-css-javascript
+site_areas: projects
+hardware: ''
+software: python, html-css-javascript
+version: 4.1
+last_tested: 2018-08-02
+steps:
+- title: What you will make
+- title: Create the app
+  completion:
+  - engaged
+- title: Add a new page
+- title: Create a HTML template
+- title: Use CSS styles
+  completion:
+  - internal
+- title: Dynamic content
+  completion:
+  - external
+- title: 'Challenge'
+  challenge: true
diff --git a/de-DE/step_1.md b/de-DE/step_1.md
new file mode 100644
index 0000000..639b373
--- /dev/null
+++ b/de-DE/step_1.md
@@ -0,0 +1,30 @@
+## What you will make
+
+Set up a web server and create a simple website using Flask, Python, and HTML/CSS.
+The web server will be able to react to the dynamic content that the user inputs.
+
+![A web browser open on a page with blue text on a beige background. The text says 'My website' and has a link to 'Hi Paul'.](images/flask-app-link.png)
+
+### You will need:
+
+- A Raspberry Pi with the latest Raspberry Pi OS
+
+## --- collapse ---
+
+## title: Installing Flask
+
+`Flask` should be pre-installed as part of Raspberry Pi OS, so you shouldn't need to do anything.
+
+You can install it manually with the command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+sudo apt install python3-flask
+
+\--- /code ---
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/de-DE/step_2.md b/de-DE/step_2.md
new file mode 100644
index 0000000..04d580f
--- /dev/null
+++ b/de-DE/step_2.md
@@ -0,0 +1,106 @@
+## Create the app
+
+\--- task ---
+
+Open a terminal and use the `mkdir` command to create a new directory inside your documents folder called `webapp`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Use the 'change directory' command `cd` to open the new directory.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+From the **Programming** menu, open **Thonny**.
+
+\--- /task ---
+
+\--- task ---
+
+Add this Python code into the blank file.
+
+## --- code ---
+
+language: python
+line_numbers: false
+--------------------------------------------------------
+
+from flask import Flask
+
+app = Flask(**name**)
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+if **name** == '**main**':
+app.run(debug=True, host='0.0.0.0')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the new file with the name `app.py` inside the `webapp` folder you just created.
+
+\--- /task ---
+
+\--- task ---
+
+Go back to your terminal window and run the script you just wrote:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+If everything is working correctly, the window should show you output similar to this:
+
+![pi run web app](images/pi-run-web-app.png)
+
+\--- task ---
+
+From your Raspberry Pi's menu, open **Internet** > **Chromium web browser**
+
+\--- /task ---
+
+\--- task ---
+
+In the address bar, type `localhost:5000` and press <kbd>Enter</kbd>. You should see the welcome page.
+
+\--- /task ---
+
+![Flask Hello world](images/flask-hello-world.png)
+
+
diff --git a/de-DE/step_3.md b/de-DE/step_3.md
new file mode 100644
index 0000000..8c7c7a1
--- /dev/null
+++ b/de-DE/step_3.md
@@ -0,0 +1,57 @@
+## Add a new page
+
+To add a new page to your web app, you create a new **route**.
+
+## --- collapse ---
+
+## title: What is a route?
+
+In the code you already have, there is a single route:
+
+```python
+@app.route('/')
+def index():
+    return 'Hello world'
+```
+
+This route is made up of three parts:
+
+- `@app.route('/')`: what you add to the web address to access this route - `/`
+- `def index()`: the name of the route - `index`
+- `return 'Hello world'`: the contents the user will see - `Hello world`
+
+\--- /collapse ---
+
+\--- task ---
+
+Add the code for a new route to `app.py` and **save** the file.
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+@app.route('/cakes')
+def cakes():
+return 'Yummy cakes!'
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+In the **Chromium web browser**, type `localhost:5000/cakes` in the address bar.
+
+You should see a web page with the text "Yummy cakes!" on it.
+
+![Yummy Cakes](images/flask-cakes.png)
+
+\--- /task ---
diff --git a/de-DE/step_4.md b/de-DE/step_4.md
new file mode 100644
index 0000000..5c9fe10
--- /dev/null
+++ b/de-DE/step_4.md
@@ -0,0 +1,118 @@
+## Create a HTML template
+
+You can use a **template** to give your page a style. The template will use **HyperText Markup Language (HTML)**.
+
+\--- task ---
+
+Go to your terminal and press <kbd>Ctrl</kbd> + <kbd>C</kbd> to stop your flask server.
+
+\--- /task ---
+
+\--- task ---
+
+Create a `templates` directory in your `webapp` directory:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir templates
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `index.html` inside your `templates` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add this code to `index.html` and **save** your changes.
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+![A new file called index.html containing the code above](images/html-file.png)
+
+\--- /task ---
+
+\--- task ---
+
+\--- /task ---
+
+\--- task ---
+
+Return to your `app.py` file and change the first line of code:
+
+## --- code ---
+
+language: python
+line_numbers: true
+-------------------------------------------------------
+
+from flask import Flask, render_template
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Change the `index()` route to use your `index.html` HTML template:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 7
+-------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save `app.py` then go back to the terminal and run it to restart your server:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go to `localhost:5000/` page in **Chromium** to see your new HTML template displayed.
+
+![A web browser pointed at localhost:5000 with the text 'My website' in a large header font](images/flask-template.png)
+
+\--- /task ---
+
diff --git a/de-DE/step_5.md b/de-DE/step_5.md
new file mode 100644
index 0000000..7b9915d
--- /dev/null
+++ b/de-DE/step_5.md
@@ -0,0 +1,118 @@
+## Use CSS styles
+
+**Cascading Style Sheets (CSS)** are rules to tell a browser how to display HTML content.
+
+\--- task ---
+
+Open a new terminal window, so that you can leave the Flask web server running in the other one.
+
+\--- /task ---
+
+\--- task ---
+
+Make sure you are in the `webapp` directory using this command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new directory called `static`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir static
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `style.css` inside your `static` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add the following CSS rules to `style.css` then **save** the file. This is your stylesheet.
+
+## --- code ---
+
+language: css
+line_numbers: true
+-------------------------------------------------------
+
+body {
+background: beige;
+color: blue;
+}
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Now modify your `index.html` HTML template to include the CSS stylesheet:
+
+## --- code ---
+
+language: css
+line_numbers: true
+line_number_start: 1
+line_highlights: 2-4
+---------------------------------------------------------
+
+<html>
+<head>
+<link rel="stylesheet" href="/static/style.css" />
+</head>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html` then go back to **Chromium** and refresh the browser. You should see a colourful version of your web app!
+
+![Flask app with colour](images/flask-app-with-colour.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: I can't see the colours
+
+If your web app doesn't look right, your CSS file might not be in the right directory.
+
+Make sure your `webapp` project directory contains the following files and has the following structure:
+
+```
+├── app.py
+├── static
+│   └── style.css
+└── templates
+    └── index.html
+    └── cakes.html
+```
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/de-DE/step_6.md b/de-DE/step_6.md
new file mode 100644
index 0000000..35cb28a
--- /dev/null
+++ b/de-DE/step_6.md
@@ -0,0 +1,107 @@
+## Dynamic content
+
+Websites like Facebook, YouTube and BBC News have dynamic content: these websites show different content within the same template.
+
+Now you will create a new route on your website so that the page will show you a personalised greeting.
+
+\--- task ---
+
+Open `app.py` and add a new route to your application:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+@app.route('/hello/<name>')
+def hello(name):
+return render_template('page.html', name=name)
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new HTML template in the templates folder called `page.html`, and add the following HTML code to it:
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>Hello {{ name }}!</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save both files, then visit `localhost:5000/hello/Paul` in the **Chromium browser**.
+
+The page you see should look like this:
+
+![A website displaying the text 'Hello Paul!'](images/flask-hello-paul.png)
+
+Try replacing `Paul` in the address bar with a different name!
+
+\--- /task ---
+
+\--- task ---
+
+Open your `index.html` template and add a link to the hello page under the heading.
+
+## --- code ---
+
+language: html
+line_numbers: true
+line_number_start: 6
+line_highlights: 7
+-------------------------------------------------------
+
+<h1>My website</h1><a href="/hello/paul">Hi Paul</a>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html`, and then open `localhost:5000` to see the updated version.
+
+![A website with blue text on a beige background. The text reads 'My website' in a header font and then a link to 'Hi Paul'](images/flask-app-link.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: How does this route work?
+
+- `@app.route('/hello/<name>')`: the `<name>` part passes the text written in the URL into the `hello` function as a variable called `name`.
+- `def hello(name)`: this is the function that determines what content is shown. Here, the function takes the given name as a parameter.
+- `return render_template('page.html', name=name)`: this code looks up the template `page.html` and passes in the variable `name` from the URL so that the template can use it.
+
+Flask uses `jinja`, a Python library for rendering templates. Look at this code with the braces (curly brackets):
+
+```html
+<h1>Hello {{ name }}!</h1>
+```
+
+This code tells the template to use the variable `name` that was passed in the route function `hello`.
+
+Visiting `localhost:5000/hello/` without a name creates an error.
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/de-DE/step_7.md b/de-DE/step_7.md
new file mode 100644
index 0000000..a55110e
--- /dev/null
+++ b/de-DE/step_7.md
@@ -0,0 +1,25 @@
+## Challenge
+
+\--- task ---
+
+Add another route for your website.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some **hex codes** for other colours you could use in your CSS.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some more HTML tags to use in your templates.
+
+\--- /task ---
+
+\--- task ---
+
+Use dynamic content in another way in your website.
+
+\--- /task ---
\ No newline at end of file
diff --git a/de-DE/step_8.md b/de-DE/step_8.md
new file mode 100644
index 0000000..632e66a
--- /dev/null
+++ b/de-DE/step_8.md
@@ -0,0 +1,17 @@
+## What can you do now?
+
+Try our [Introduction to web](https://projects.raspberrypi.org/en/pathways/web-intro) project pathway where you will learn how to structure and style webpages with images, lists, fonts, quotes, links, and animation.
+
+\--- print-only ---
+
+![Completed project](images/solution.png)
+
+\--- /print-only ---
+
+\--- no-print ---
+
+<iframe src="https://editor.raspberrypi.org/en/embed/viewer/anime-expressions-complete" width="600" height="800" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen> </iframe>
+
+\--- /no-print ---
+
+Or, why not try out another [HTML and CSS](https://projects.raspberrypi.org/en/projects?software%5B%5D=html-css-javascript) project.
\ No newline at end of file
diff --git a/es-419/images/banner.png b/es-419/images/banner.png
new file mode 100644
index 0000000..082983c
Binary files /dev/null and b/es-419/images/banner.png differ
diff --git a/es-419/images/flask-app-link.png b/es-419/images/flask-app-link.png
new file mode 100644
index 0000000..c75fee1
Binary files /dev/null and b/es-419/images/flask-app-link.png differ
diff --git a/es-419/images/flask-app-with-colour.png b/es-419/images/flask-app-with-colour.png
new file mode 100644
index 0000000..11aee4b
Binary files /dev/null and b/es-419/images/flask-app-with-colour.png differ
diff --git a/es-419/images/flask-cakes.png b/es-419/images/flask-cakes.png
new file mode 100644
index 0000000..2232934
Binary files /dev/null and b/es-419/images/flask-cakes.png differ
diff --git a/es-419/images/flask-hello-paul.png b/es-419/images/flask-hello-paul.png
new file mode 100644
index 0000000..e6b519e
Binary files /dev/null and b/es-419/images/flask-hello-paul.png differ
diff --git a/es-419/images/flask-hello-world.png b/es-419/images/flask-hello-world.png
new file mode 100644
index 0000000..fa6c410
Binary files /dev/null and b/es-419/images/flask-hello-world.png differ
diff --git a/es-419/images/flask-template.png b/es-419/images/flask-template.png
new file mode 100644
index 0000000..a62457e
Binary files /dev/null and b/es-419/images/flask-template.png differ
diff --git a/es-419/images/html-file.png b/es-419/images/html-file.png
new file mode 100644
index 0000000..dead737
Binary files /dev/null and b/es-419/images/html-file.png differ
diff --git a/es-419/images/idle-css.png b/es-419/images/idle-css.png
new file mode 100644
index 0000000..090a1ac
Binary files /dev/null and b/es-419/images/idle-css.png differ
diff --git a/es-419/images/idle-html.png b/es-419/images/idle-html.png
new file mode 100644
index 0000000..f3d229a
Binary files /dev/null and b/es-419/images/idle-html.png differ
diff --git a/es-419/images/open-terminal.png b/es-419/images/open-terminal.png
new file mode 100644
index 0000000..c4bf48e
Binary files /dev/null and b/es-419/images/open-terminal.png differ
diff --git a/es-419/images/open-text-editor.png b/es-419/images/open-text-editor.png
new file mode 100644
index 0000000..552b289
Binary files /dev/null and b/es-419/images/open-text-editor.png differ
diff --git a/es-419/images/pi-run-web-app.png b/es-419/images/pi-run-web-app.png
new file mode 100644
index 0000000..6973df6
Binary files /dev/null and b/es-419/images/pi-run-web-app.png differ
diff --git a/es-419/images/solution.png b/es-419/images/solution.png
new file mode 100644
index 0000000..9f2de5a
Binary files /dev/null and b/es-419/images/solution.png differ
diff --git a/es-419/meta.yml b/es-419/meta.yml
new file mode 100644
index 0000000..a524516
--- /dev/null
+++ b/es-419/meta.yml
@@ -0,0 +1,33 @@
+---
+title: Build a Python Web Server with Flask
+hero_image: images/banner.png
+description: Install the Python web framework Flask and set up a basic web server with different pages
+original_url: https://raspberrypi.org/learning/python-web-server-with-flask
+theme: yellow
+duration: 2
+listed: true
+ingredient: false
+copyedit: true
+curriculum: 3, design-0, programming-3, phys-comp-0, manufacture-0, community-0
+interests: ''
+technologies: python, html-css-javascript
+site_areas: projects
+hardware: ''
+software: python, html-css-javascript
+version: 4.1
+last_tested: 2018-08-02
+steps:
+- title: What you will make
+- title: Create the app
+  completion:
+  - engaged
+- title: Add a new page
+- title: Create a HTML template
+- title: Use CSS styles
+  completion:
+  - internal
+- title: Dynamic content
+  completion:
+  - external
+- title: 'Challenge'
+  challenge: true
diff --git a/es-419/step_1.md b/es-419/step_1.md
new file mode 100644
index 0000000..639b373
--- /dev/null
+++ b/es-419/step_1.md
@@ -0,0 +1,30 @@
+## What you will make
+
+Set up a web server and create a simple website using Flask, Python, and HTML/CSS.
+The web server will be able to react to the dynamic content that the user inputs.
+
+![A web browser open on a page with blue text on a beige background. The text says 'My website' and has a link to 'Hi Paul'.](images/flask-app-link.png)
+
+### You will need:
+
+- A Raspberry Pi with the latest Raspberry Pi OS
+
+## --- collapse ---
+
+## title: Installing Flask
+
+`Flask` should be pre-installed as part of Raspberry Pi OS, so you shouldn't need to do anything.
+
+You can install it manually with the command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+sudo apt install python3-flask
+
+\--- /code ---
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/es-419/step_2.md b/es-419/step_2.md
new file mode 100644
index 0000000..04d580f
--- /dev/null
+++ b/es-419/step_2.md
@@ -0,0 +1,106 @@
+## Create the app
+
+\--- task ---
+
+Open a terminal and use the `mkdir` command to create a new directory inside your documents folder called `webapp`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Use the 'change directory' command `cd` to open the new directory.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+From the **Programming** menu, open **Thonny**.
+
+\--- /task ---
+
+\--- task ---
+
+Add this Python code into the blank file.
+
+## --- code ---
+
+language: python
+line_numbers: false
+--------------------------------------------------------
+
+from flask import Flask
+
+app = Flask(**name**)
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+if **name** == '**main**':
+app.run(debug=True, host='0.0.0.0')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the new file with the name `app.py` inside the `webapp` folder you just created.
+
+\--- /task ---
+
+\--- task ---
+
+Go back to your terminal window and run the script you just wrote:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+If everything is working correctly, the window should show you output similar to this:
+
+![pi run web app](images/pi-run-web-app.png)
+
+\--- task ---
+
+From your Raspberry Pi's menu, open **Internet** > **Chromium web browser**
+
+\--- /task ---
+
+\--- task ---
+
+In the address bar, type `localhost:5000` and press <kbd>Enter</kbd>. You should see the welcome page.
+
+\--- /task ---
+
+![Flask Hello world](images/flask-hello-world.png)
+
+
diff --git a/es-419/step_3.md b/es-419/step_3.md
new file mode 100644
index 0000000..8c7c7a1
--- /dev/null
+++ b/es-419/step_3.md
@@ -0,0 +1,57 @@
+## Add a new page
+
+To add a new page to your web app, you create a new **route**.
+
+## --- collapse ---
+
+## title: What is a route?
+
+In the code you already have, there is a single route:
+
+```python
+@app.route('/')
+def index():
+    return 'Hello world'
+```
+
+This route is made up of three parts:
+
+- `@app.route('/')`: what you add to the web address to access this route - `/`
+- `def index()`: the name of the route - `index`
+- `return 'Hello world'`: the contents the user will see - `Hello world`
+
+\--- /collapse ---
+
+\--- task ---
+
+Add the code for a new route to `app.py` and **save** the file.
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+@app.route('/cakes')
+def cakes():
+return 'Yummy cakes!'
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+In the **Chromium web browser**, type `localhost:5000/cakes` in the address bar.
+
+You should see a web page with the text "Yummy cakes!" on it.
+
+![Yummy Cakes](images/flask-cakes.png)
+
+\--- /task ---
diff --git a/es-419/step_4.md b/es-419/step_4.md
new file mode 100644
index 0000000..5c9fe10
--- /dev/null
+++ b/es-419/step_4.md
@@ -0,0 +1,118 @@
+## Create a HTML template
+
+You can use a **template** to give your page a style. The template will use **HyperText Markup Language (HTML)**.
+
+\--- task ---
+
+Go to your terminal and press <kbd>Ctrl</kbd> + <kbd>C</kbd> to stop your flask server.
+
+\--- /task ---
+
+\--- task ---
+
+Create a `templates` directory in your `webapp` directory:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir templates
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `index.html` inside your `templates` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add this code to `index.html` and **save** your changes.
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+![A new file called index.html containing the code above](images/html-file.png)
+
+\--- /task ---
+
+\--- task ---
+
+\--- /task ---
+
+\--- task ---
+
+Return to your `app.py` file and change the first line of code:
+
+## --- code ---
+
+language: python
+line_numbers: true
+-------------------------------------------------------
+
+from flask import Flask, render_template
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Change the `index()` route to use your `index.html` HTML template:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 7
+-------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save `app.py` then go back to the terminal and run it to restart your server:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go to `localhost:5000/` page in **Chromium** to see your new HTML template displayed.
+
+![A web browser pointed at localhost:5000 with the text 'My website' in a large header font](images/flask-template.png)
+
+\--- /task ---
+
diff --git a/es-419/step_5.md b/es-419/step_5.md
new file mode 100644
index 0000000..7b9915d
--- /dev/null
+++ b/es-419/step_5.md
@@ -0,0 +1,118 @@
+## Use CSS styles
+
+**Cascading Style Sheets (CSS)** are rules to tell a browser how to display HTML content.
+
+\--- task ---
+
+Open a new terminal window, so that you can leave the Flask web server running in the other one.
+
+\--- /task ---
+
+\--- task ---
+
+Make sure you are in the `webapp` directory using this command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new directory called `static`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir static
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `style.css` inside your `static` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add the following CSS rules to `style.css` then **save** the file. This is your stylesheet.
+
+## --- code ---
+
+language: css
+line_numbers: true
+-------------------------------------------------------
+
+body {
+background: beige;
+color: blue;
+}
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Now modify your `index.html` HTML template to include the CSS stylesheet:
+
+## --- code ---
+
+language: css
+line_numbers: true
+line_number_start: 1
+line_highlights: 2-4
+---------------------------------------------------------
+
+<html>
+<head>
+<link rel="stylesheet" href="/static/style.css" />
+</head>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html` then go back to **Chromium** and refresh the browser. You should see a colourful version of your web app!
+
+![Flask app with colour](images/flask-app-with-colour.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: I can't see the colours
+
+If your web app doesn't look right, your CSS file might not be in the right directory.
+
+Make sure your `webapp` project directory contains the following files and has the following structure:
+
+```
+├── app.py
+├── static
+│   └── style.css
+└── templates
+    └── index.html
+    └── cakes.html
+```
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/es-419/step_6.md b/es-419/step_6.md
new file mode 100644
index 0000000..35cb28a
--- /dev/null
+++ b/es-419/step_6.md
@@ -0,0 +1,107 @@
+## Dynamic content
+
+Websites like Facebook, YouTube and BBC News have dynamic content: these websites show different content within the same template.
+
+Now you will create a new route on your website so that the page will show you a personalised greeting.
+
+\--- task ---
+
+Open `app.py` and add a new route to your application:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+@app.route('/hello/<name>')
+def hello(name):
+return render_template('page.html', name=name)
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new HTML template in the templates folder called `page.html`, and add the following HTML code to it:
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>Hello {{ name }}!</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save both files, then visit `localhost:5000/hello/Paul` in the **Chromium browser**.
+
+The page you see should look like this:
+
+![A website displaying the text 'Hello Paul!'](images/flask-hello-paul.png)
+
+Try replacing `Paul` in the address bar with a different name!
+
+\--- /task ---
+
+\--- task ---
+
+Open your `index.html` template and add a link to the hello page under the heading.
+
+## --- code ---
+
+language: html
+line_numbers: true
+line_number_start: 6
+line_highlights: 7
+-------------------------------------------------------
+
+<h1>My website</h1><a href="/hello/paul">Hi Paul</a>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html`, and then open `localhost:5000` to see the updated version.
+
+![A website with blue text on a beige background. The text reads 'My website' in a header font and then a link to 'Hi Paul'](images/flask-app-link.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: How does this route work?
+
+- `@app.route('/hello/<name>')`: the `<name>` part passes the text written in the URL into the `hello` function as a variable called `name`.
+- `def hello(name)`: this is the function that determines what content is shown. Here, the function takes the given name as a parameter.
+- `return render_template('page.html', name=name)`: this code looks up the template `page.html` and passes in the variable `name` from the URL so that the template can use it.
+
+Flask uses `jinja`, a Python library for rendering templates. Look at this code with the braces (curly brackets):
+
+```html
+<h1>Hello {{ name }}!</h1>
+```
+
+This code tells the template to use the variable `name` that was passed in the route function `hello`.
+
+Visiting `localhost:5000/hello/` without a name creates an error.
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/es-419/step_7.md b/es-419/step_7.md
new file mode 100644
index 0000000..a55110e
--- /dev/null
+++ b/es-419/step_7.md
@@ -0,0 +1,25 @@
+## Challenge
+
+\--- task ---
+
+Add another route for your website.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some **hex codes** for other colours you could use in your CSS.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some more HTML tags to use in your templates.
+
+\--- /task ---
+
+\--- task ---
+
+Use dynamic content in another way in your website.
+
+\--- /task ---
\ No newline at end of file
diff --git a/es-419/step_8.md b/es-419/step_8.md
new file mode 100644
index 0000000..632e66a
--- /dev/null
+++ b/es-419/step_8.md
@@ -0,0 +1,17 @@
+## What can you do now?
+
+Try our [Introduction to web](https://projects.raspberrypi.org/en/pathways/web-intro) project pathway where you will learn how to structure and style webpages with images, lists, fonts, quotes, links, and animation.
+
+\--- print-only ---
+
+![Completed project](images/solution.png)
+
+\--- /print-only ---
+
+\--- no-print ---
+
+<iframe src="https://editor.raspberrypi.org/en/embed/viewer/anime-expressions-complete" width="600" height="800" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen> </iframe>
+
+\--- /no-print ---
+
+Or, why not try out another [HTML and CSS](https://projects.raspberrypi.org/en/projects?software%5B%5D=html-css-javascript) project.
\ No newline at end of file
diff --git a/fr-FR/images/banner.png b/fr-FR/images/banner.png
new file mode 100644
index 0000000..082983c
Binary files /dev/null and b/fr-FR/images/banner.png differ
diff --git a/fr-FR/images/flask-app-link.png b/fr-FR/images/flask-app-link.png
new file mode 100644
index 0000000..c75fee1
Binary files /dev/null and b/fr-FR/images/flask-app-link.png differ
diff --git a/fr-FR/images/flask-app-with-colour.png b/fr-FR/images/flask-app-with-colour.png
new file mode 100644
index 0000000..11aee4b
Binary files /dev/null and b/fr-FR/images/flask-app-with-colour.png differ
diff --git a/fr-FR/images/flask-cakes.png b/fr-FR/images/flask-cakes.png
new file mode 100644
index 0000000..2232934
Binary files /dev/null and b/fr-FR/images/flask-cakes.png differ
diff --git a/fr-FR/images/flask-hello-paul.png b/fr-FR/images/flask-hello-paul.png
new file mode 100644
index 0000000..e6b519e
Binary files /dev/null and b/fr-FR/images/flask-hello-paul.png differ
diff --git a/fr-FR/images/flask-hello-world.png b/fr-FR/images/flask-hello-world.png
new file mode 100644
index 0000000..fa6c410
Binary files /dev/null and b/fr-FR/images/flask-hello-world.png differ
diff --git a/fr-FR/images/flask-template.png b/fr-FR/images/flask-template.png
new file mode 100644
index 0000000..a62457e
Binary files /dev/null and b/fr-FR/images/flask-template.png differ
diff --git a/fr-FR/images/html-file.png b/fr-FR/images/html-file.png
new file mode 100644
index 0000000..dead737
Binary files /dev/null and b/fr-FR/images/html-file.png differ
diff --git a/fr-FR/images/idle-css.png b/fr-FR/images/idle-css.png
new file mode 100644
index 0000000..090a1ac
Binary files /dev/null and b/fr-FR/images/idle-css.png differ
diff --git a/fr-FR/images/idle-html.png b/fr-FR/images/idle-html.png
new file mode 100644
index 0000000..f3d229a
Binary files /dev/null and b/fr-FR/images/idle-html.png differ
diff --git a/fr-FR/images/open-terminal.png b/fr-FR/images/open-terminal.png
new file mode 100644
index 0000000..c4bf48e
Binary files /dev/null and b/fr-FR/images/open-terminal.png differ
diff --git a/fr-FR/images/open-text-editor.png b/fr-FR/images/open-text-editor.png
new file mode 100644
index 0000000..552b289
Binary files /dev/null and b/fr-FR/images/open-text-editor.png differ
diff --git a/fr-FR/images/pi-run-web-app.png b/fr-FR/images/pi-run-web-app.png
new file mode 100644
index 0000000..6973df6
Binary files /dev/null and b/fr-FR/images/pi-run-web-app.png differ
diff --git a/fr-FR/images/solution.png b/fr-FR/images/solution.png
new file mode 100644
index 0000000..9f2de5a
Binary files /dev/null and b/fr-FR/images/solution.png differ
diff --git a/fr-FR/meta.yml b/fr-FR/meta.yml
new file mode 100644
index 0000000..a524516
--- /dev/null
+++ b/fr-FR/meta.yml
@@ -0,0 +1,33 @@
+---
+title: Build a Python Web Server with Flask
+hero_image: images/banner.png
+description: Install the Python web framework Flask and set up a basic web server with different pages
+original_url: https://raspberrypi.org/learning/python-web-server-with-flask
+theme: yellow
+duration: 2
+listed: true
+ingredient: false
+copyedit: true
+curriculum: 3, design-0, programming-3, phys-comp-0, manufacture-0, community-0
+interests: ''
+technologies: python, html-css-javascript
+site_areas: projects
+hardware: ''
+software: python, html-css-javascript
+version: 4.1
+last_tested: 2018-08-02
+steps:
+- title: What you will make
+- title: Create the app
+  completion:
+  - engaged
+- title: Add a new page
+- title: Create a HTML template
+- title: Use CSS styles
+  completion:
+  - internal
+- title: Dynamic content
+  completion:
+  - external
+- title: 'Challenge'
+  challenge: true
diff --git a/fr-FR/step_1.md b/fr-FR/step_1.md
new file mode 100644
index 0000000..639b373
--- /dev/null
+++ b/fr-FR/step_1.md
@@ -0,0 +1,30 @@
+## What you will make
+
+Set up a web server and create a simple website using Flask, Python, and HTML/CSS.
+The web server will be able to react to the dynamic content that the user inputs.
+
+![A web browser open on a page with blue text on a beige background. The text says 'My website' and has a link to 'Hi Paul'.](images/flask-app-link.png)
+
+### You will need:
+
+- A Raspberry Pi with the latest Raspberry Pi OS
+
+## --- collapse ---
+
+## title: Installing Flask
+
+`Flask` should be pre-installed as part of Raspberry Pi OS, so you shouldn't need to do anything.
+
+You can install it manually with the command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+sudo apt install python3-flask
+
+\--- /code ---
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/fr-FR/step_2.md b/fr-FR/step_2.md
new file mode 100644
index 0000000..04d580f
--- /dev/null
+++ b/fr-FR/step_2.md
@@ -0,0 +1,106 @@
+## Create the app
+
+\--- task ---
+
+Open a terminal and use the `mkdir` command to create a new directory inside your documents folder called `webapp`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Use the 'change directory' command `cd` to open the new directory.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+From the **Programming** menu, open **Thonny**.
+
+\--- /task ---
+
+\--- task ---
+
+Add this Python code into the blank file.
+
+## --- code ---
+
+language: python
+line_numbers: false
+--------------------------------------------------------
+
+from flask import Flask
+
+app = Flask(**name**)
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+if **name** == '**main**':
+app.run(debug=True, host='0.0.0.0')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the new file with the name `app.py` inside the `webapp` folder you just created.
+
+\--- /task ---
+
+\--- task ---
+
+Go back to your terminal window and run the script you just wrote:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+If everything is working correctly, the window should show you output similar to this:
+
+![pi run web app](images/pi-run-web-app.png)
+
+\--- task ---
+
+From your Raspberry Pi's menu, open **Internet** > **Chromium web browser**
+
+\--- /task ---
+
+\--- task ---
+
+In the address bar, type `localhost:5000` and press <kbd>Enter</kbd>. You should see the welcome page.
+
+\--- /task ---
+
+![Flask Hello world](images/flask-hello-world.png)
+
+
diff --git a/fr-FR/step_3.md b/fr-FR/step_3.md
new file mode 100644
index 0000000..8c7c7a1
--- /dev/null
+++ b/fr-FR/step_3.md
@@ -0,0 +1,57 @@
+## Add a new page
+
+To add a new page to your web app, you create a new **route**.
+
+## --- collapse ---
+
+## title: What is a route?
+
+In the code you already have, there is a single route:
+
+```python
+@app.route('/')
+def index():
+    return 'Hello world'
+```
+
+This route is made up of three parts:
+
+- `@app.route('/')`: what you add to the web address to access this route - `/`
+- `def index()`: the name of the route - `index`
+- `return 'Hello world'`: the contents the user will see - `Hello world`
+
+\--- /collapse ---
+
+\--- task ---
+
+Add the code for a new route to `app.py` and **save** the file.
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+@app.route('/cakes')
+def cakes():
+return 'Yummy cakes!'
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+In the **Chromium web browser**, type `localhost:5000/cakes` in the address bar.
+
+You should see a web page with the text "Yummy cakes!" on it.
+
+![Yummy Cakes](images/flask-cakes.png)
+
+\--- /task ---
diff --git a/fr-FR/step_4.md b/fr-FR/step_4.md
new file mode 100644
index 0000000..5c9fe10
--- /dev/null
+++ b/fr-FR/step_4.md
@@ -0,0 +1,118 @@
+## Create a HTML template
+
+You can use a **template** to give your page a style. The template will use **HyperText Markup Language (HTML)**.
+
+\--- task ---
+
+Go to your terminal and press <kbd>Ctrl</kbd> + <kbd>C</kbd> to stop your flask server.
+
+\--- /task ---
+
+\--- task ---
+
+Create a `templates` directory in your `webapp` directory:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir templates
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `index.html` inside your `templates` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add this code to `index.html` and **save** your changes.
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+![A new file called index.html containing the code above](images/html-file.png)
+
+\--- /task ---
+
+\--- task ---
+
+\--- /task ---
+
+\--- task ---
+
+Return to your `app.py` file and change the first line of code:
+
+## --- code ---
+
+language: python
+line_numbers: true
+-------------------------------------------------------
+
+from flask import Flask, render_template
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Change the `index()` route to use your `index.html` HTML template:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 7
+-------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save `app.py` then go back to the terminal and run it to restart your server:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go to `localhost:5000/` page in **Chromium** to see your new HTML template displayed.
+
+![A web browser pointed at localhost:5000 with the text 'My website' in a large header font](images/flask-template.png)
+
+\--- /task ---
+
diff --git a/fr-FR/step_5.md b/fr-FR/step_5.md
new file mode 100644
index 0000000..7b9915d
--- /dev/null
+++ b/fr-FR/step_5.md
@@ -0,0 +1,118 @@
+## Use CSS styles
+
+**Cascading Style Sheets (CSS)** are rules to tell a browser how to display HTML content.
+
+\--- task ---
+
+Open a new terminal window, so that you can leave the Flask web server running in the other one.
+
+\--- /task ---
+
+\--- task ---
+
+Make sure you are in the `webapp` directory using this command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new directory called `static`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir static
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `style.css` inside your `static` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add the following CSS rules to `style.css` then **save** the file. This is your stylesheet.
+
+## --- code ---
+
+language: css
+line_numbers: true
+-------------------------------------------------------
+
+body {
+background: beige;
+color: blue;
+}
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Now modify your `index.html` HTML template to include the CSS stylesheet:
+
+## --- code ---
+
+language: css
+line_numbers: true
+line_number_start: 1
+line_highlights: 2-4
+---------------------------------------------------------
+
+<html>
+<head>
+<link rel="stylesheet" href="/static/style.css" />
+</head>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html` then go back to **Chromium** and refresh the browser. You should see a colourful version of your web app!
+
+![Flask app with colour](images/flask-app-with-colour.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: I can't see the colours
+
+If your web app doesn't look right, your CSS file might not be in the right directory.
+
+Make sure your `webapp` project directory contains the following files and has the following structure:
+
+```
+├── app.py
+├── static
+│   └── style.css
+└── templates
+    └── index.html
+    └── cakes.html
+```
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/fr-FR/step_6.md b/fr-FR/step_6.md
new file mode 100644
index 0000000..35cb28a
--- /dev/null
+++ b/fr-FR/step_6.md
@@ -0,0 +1,107 @@
+## Dynamic content
+
+Websites like Facebook, YouTube and BBC News have dynamic content: these websites show different content within the same template.
+
+Now you will create a new route on your website so that the page will show you a personalised greeting.
+
+\--- task ---
+
+Open `app.py` and add a new route to your application:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+@app.route('/hello/<name>')
+def hello(name):
+return render_template('page.html', name=name)
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new HTML template in the templates folder called `page.html`, and add the following HTML code to it:
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>Hello {{ name }}!</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save both files, then visit `localhost:5000/hello/Paul` in the **Chromium browser**.
+
+The page you see should look like this:
+
+![A website displaying the text 'Hello Paul!'](images/flask-hello-paul.png)
+
+Try replacing `Paul` in the address bar with a different name!
+
+\--- /task ---
+
+\--- task ---
+
+Open your `index.html` template and add a link to the hello page under the heading.
+
+## --- code ---
+
+language: html
+line_numbers: true
+line_number_start: 6
+line_highlights: 7
+-------------------------------------------------------
+
+<h1>My website</h1><a href="/hello/paul">Hi Paul</a>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html`, and then open `localhost:5000` to see the updated version.
+
+![A website with blue text on a beige background. The text reads 'My website' in a header font and then a link to 'Hi Paul'](images/flask-app-link.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: How does this route work?
+
+- `@app.route('/hello/<name>')`: the `<name>` part passes the text written in the URL into the `hello` function as a variable called `name`.
+- `def hello(name)`: this is the function that determines what content is shown. Here, the function takes the given name as a parameter.
+- `return render_template('page.html', name=name)`: this code looks up the template `page.html` and passes in the variable `name` from the URL so that the template can use it.
+
+Flask uses `jinja`, a Python library for rendering templates. Look at this code with the braces (curly brackets):
+
+```html
+<h1>Hello {{ name }}!</h1>
+```
+
+This code tells the template to use the variable `name` that was passed in the route function `hello`.
+
+Visiting `localhost:5000/hello/` without a name creates an error.
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/fr-FR/step_7.md b/fr-FR/step_7.md
new file mode 100644
index 0000000..a55110e
--- /dev/null
+++ b/fr-FR/step_7.md
@@ -0,0 +1,25 @@
+## Challenge
+
+\--- task ---
+
+Add another route for your website.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some **hex codes** for other colours you could use in your CSS.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some more HTML tags to use in your templates.
+
+\--- /task ---
+
+\--- task ---
+
+Use dynamic content in another way in your website.
+
+\--- /task ---
\ No newline at end of file
diff --git a/fr-FR/step_8.md b/fr-FR/step_8.md
new file mode 100644
index 0000000..632e66a
--- /dev/null
+++ b/fr-FR/step_8.md
@@ -0,0 +1,17 @@
+## What can you do now?
+
+Try our [Introduction to web](https://projects.raspberrypi.org/en/pathways/web-intro) project pathway where you will learn how to structure and style webpages with images, lists, fonts, quotes, links, and animation.
+
+\--- print-only ---
+
+![Completed project](images/solution.png)
+
+\--- /print-only ---
+
+\--- no-print ---
+
+<iframe src="https://editor.raspberrypi.org/en/embed/viewer/anime-expressions-complete" width="600" height="800" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen> </iframe>
+
+\--- /no-print ---
+
+Or, why not try out another [HTML and CSS](https://projects.raspberrypi.org/en/projects?software%5B%5D=html-css-javascript) project.
\ No newline at end of file
diff --git a/hi-IN/images/banner.png b/hi-IN/images/banner.png
new file mode 100644
index 0000000..082983c
Binary files /dev/null and b/hi-IN/images/banner.png differ
diff --git a/hi-IN/images/flask-app-link.png b/hi-IN/images/flask-app-link.png
new file mode 100644
index 0000000..c75fee1
Binary files /dev/null and b/hi-IN/images/flask-app-link.png differ
diff --git a/hi-IN/images/flask-app-with-colour.png b/hi-IN/images/flask-app-with-colour.png
new file mode 100644
index 0000000..11aee4b
Binary files /dev/null and b/hi-IN/images/flask-app-with-colour.png differ
diff --git a/hi-IN/images/flask-cakes.png b/hi-IN/images/flask-cakes.png
new file mode 100644
index 0000000..2232934
Binary files /dev/null and b/hi-IN/images/flask-cakes.png differ
diff --git a/hi-IN/images/flask-hello-paul.png b/hi-IN/images/flask-hello-paul.png
new file mode 100644
index 0000000..e6b519e
Binary files /dev/null and b/hi-IN/images/flask-hello-paul.png differ
diff --git a/hi-IN/images/flask-hello-world.png b/hi-IN/images/flask-hello-world.png
new file mode 100644
index 0000000..fa6c410
Binary files /dev/null and b/hi-IN/images/flask-hello-world.png differ
diff --git a/hi-IN/images/flask-template.png b/hi-IN/images/flask-template.png
new file mode 100644
index 0000000..a62457e
Binary files /dev/null and b/hi-IN/images/flask-template.png differ
diff --git a/hi-IN/images/html-file.png b/hi-IN/images/html-file.png
new file mode 100644
index 0000000..dead737
Binary files /dev/null and b/hi-IN/images/html-file.png differ
diff --git a/hi-IN/images/idle-css.png b/hi-IN/images/idle-css.png
new file mode 100644
index 0000000..090a1ac
Binary files /dev/null and b/hi-IN/images/idle-css.png differ
diff --git a/hi-IN/images/idle-html.png b/hi-IN/images/idle-html.png
new file mode 100644
index 0000000..f3d229a
Binary files /dev/null and b/hi-IN/images/idle-html.png differ
diff --git a/hi-IN/images/open-terminal.png b/hi-IN/images/open-terminal.png
new file mode 100644
index 0000000..c4bf48e
Binary files /dev/null and b/hi-IN/images/open-terminal.png differ
diff --git a/hi-IN/images/open-text-editor.png b/hi-IN/images/open-text-editor.png
new file mode 100644
index 0000000..552b289
Binary files /dev/null and b/hi-IN/images/open-text-editor.png differ
diff --git a/hi-IN/images/pi-run-web-app.png b/hi-IN/images/pi-run-web-app.png
new file mode 100644
index 0000000..6973df6
Binary files /dev/null and b/hi-IN/images/pi-run-web-app.png differ
diff --git a/hi-IN/images/solution.png b/hi-IN/images/solution.png
new file mode 100644
index 0000000..9f2de5a
Binary files /dev/null and b/hi-IN/images/solution.png differ
diff --git a/hi-IN/meta.yml b/hi-IN/meta.yml
new file mode 100644
index 0000000..a524516
--- /dev/null
+++ b/hi-IN/meta.yml
@@ -0,0 +1,33 @@
+---
+title: Build a Python Web Server with Flask
+hero_image: images/banner.png
+description: Install the Python web framework Flask and set up a basic web server with different pages
+original_url: https://raspberrypi.org/learning/python-web-server-with-flask
+theme: yellow
+duration: 2
+listed: true
+ingredient: false
+copyedit: true
+curriculum: 3, design-0, programming-3, phys-comp-0, manufacture-0, community-0
+interests: ''
+technologies: python, html-css-javascript
+site_areas: projects
+hardware: ''
+software: python, html-css-javascript
+version: 4.1
+last_tested: 2018-08-02
+steps:
+- title: What you will make
+- title: Create the app
+  completion:
+  - engaged
+- title: Add a new page
+- title: Create a HTML template
+- title: Use CSS styles
+  completion:
+  - internal
+- title: Dynamic content
+  completion:
+  - external
+- title: 'Challenge'
+  challenge: true
diff --git a/hi-IN/step_1.md b/hi-IN/step_1.md
new file mode 100644
index 0000000..639b373
--- /dev/null
+++ b/hi-IN/step_1.md
@@ -0,0 +1,30 @@
+## What you will make
+
+Set up a web server and create a simple website using Flask, Python, and HTML/CSS.
+The web server will be able to react to the dynamic content that the user inputs.
+
+![A web browser open on a page with blue text on a beige background. The text says 'My website' and has a link to 'Hi Paul'.](images/flask-app-link.png)
+
+### You will need:
+
+- A Raspberry Pi with the latest Raspberry Pi OS
+
+## --- collapse ---
+
+## title: Installing Flask
+
+`Flask` should be pre-installed as part of Raspberry Pi OS, so you shouldn't need to do anything.
+
+You can install it manually with the command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+sudo apt install python3-flask
+
+\--- /code ---
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/hi-IN/step_2.md b/hi-IN/step_2.md
new file mode 100644
index 0000000..04d580f
--- /dev/null
+++ b/hi-IN/step_2.md
@@ -0,0 +1,106 @@
+## Create the app
+
+\--- task ---
+
+Open a terminal and use the `mkdir` command to create a new directory inside your documents folder called `webapp`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Use the 'change directory' command `cd` to open the new directory.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+From the **Programming** menu, open **Thonny**.
+
+\--- /task ---
+
+\--- task ---
+
+Add this Python code into the blank file.
+
+## --- code ---
+
+language: python
+line_numbers: false
+--------------------------------------------------------
+
+from flask import Flask
+
+app = Flask(**name**)
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+if **name** == '**main**':
+app.run(debug=True, host='0.0.0.0')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the new file with the name `app.py` inside the `webapp` folder you just created.
+
+\--- /task ---
+
+\--- task ---
+
+Go back to your terminal window and run the script you just wrote:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+If everything is working correctly, the window should show you output similar to this:
+
+![pi run web app](images/pi-run-web-app.png)
+
+\--- task ---
+
+From your Raspberry Pi's menu, open **Internet** > **Chromium web browser**
+
+\--- /task ---
+
+\--- task ---
+
+In the address bar, type `localhost:5000` and press <kbd>Enter</kbd>. You should see the welcome page.
+
+\--- /task ---
+
+![Flask Hello world](images/flask-hello-world.png)
+
+
diff --git a/hi-IN/step_3.md b/hi-IN/step_3.md
new file mode 100644
index 0000000..8c7c7a1
--- /dev/null
+++ b/hi-IN/step_3.md
@@ -0,0 +1,57 @@
+## Add a new page
+
+To add a new page to your web app, you create a new **route**.
+
+## --- collapse ---
+
+## title: What is a route?
+
+In the code you already have, there is a single route:
+
+```python
+@app.route('/')
+def index():
+    return 'Hello world'
+```
+
+This route is made up of three parts:
+
+- `@app.route('/')`: what you add to the web address to access this route - `/`
+- `def index()`: the name of the route - `index`
+- `return 'Hello world'`: the contents the user will see - `Hello world`
+
+\--- /collapse ---
+
+\--- task ---
+
+Add the code for a new route to `app.py` and **save** the file.
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+@app.route('/cakes')
+def cakes():
+return 'Yummy cakes!'
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+In the **Chromium web browser**, type `localhost:5000/cakes` in the address bar.
+
+You should see a web page with the text "Yummy cakes!" on it.
+
+![Yummy Cakes](images/flask-cakes.png)
+
+\--- /task ---
diff --git a/hi-IN/step_4.md b/hi-IN/step_4.md
new file mode 100644
index 0000000..5c9fe10
--- /dev/null
+++ b/hi-IN/step_4.md
@@ -0,0 +1,118 @@
+## Create a HTML template
+
+You can use a **template** to give your page a style. The template will use **HyperText Markup Language (HTML)**.
+
+\--- task ---
+
+Go to your terminal and press <kbd>Ctrl</kbd> + <kbd>C</kbd> to stop your flask server.
+
+\--- /task ---
+
+\--- task ---
+
+Create a `templates` directory in your `webapp` directory:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir templates
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `index.html` inside your `templates` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add this code to `index.html` and **save** your changes.
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+![A new file called index.html containing the code above](images/html-file.png)
+
+\--- /task ---
+
+\--- task ---
+
+\--- /task ---
+
+\--- task ---
+
+Return to your `app.py` file and change the first line of code:
+
+## --- code ---
+
+language: python
+line_numbers: true
+-------------------------------------------------------
+
+from flask import Flask, render_template
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Change the `index()` route to use your `index.html` HTML template:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 7
+-------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save `app.py` then go back to the terminal and run it to restart your server:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go to `localhost:5000/` page in **Chromium** to see your new HTML template displayed.
+
+![A web browser pointed at localhost:5000 with the text 'My website' in a large header font](images/flask-template.png)
+
+\--- /task ---
+
diff --git a/hi-IN/step_5.md b/hi-IN/step_5.md
new file mode 100644
index 0000000..7b9915d
--- /dev/null
+++ b/hi-IN/step_5.md
@@ -0,0 +1,118 @@
+## Use CSS styles
+
+**Cascading Style Sheets (CSS)** are rules to tell a browser how to display HTML content.
+
+\--- task ---
+
+Open a new terminal window, so that you can leave the Flask web server running in the other one.
+
+\--- /task ---
+
+\--- task ---
+
+Make sure you are in the `webapp` directory using this command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new directory called `static`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir static
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `style.css` inside your `static` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add the following CSS rules to `style.css` then **save** the file. This is your stylesheet.
+
+## --- code ---
+
+language: css
+line_numbers: true
+-------------------------------------------------------
+
+body {
+background: beige;
+color: blue;
+}
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Now modify your `index.html` HTML template to include the CSS stylesheet:
+
+## --- code ---
+
+language: css
+line_numbers: true
+line_number_start: 1
+line_highlights: 2-4
+---------------------------------------------------------
+
+<html>
+<head>
+<link rel="stylesheet" href="/static/style.css" />
+</head>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html` then go back to **Chromium** and refresh the browser. You should see a colourful version of your web app!
+
+![Flask app with colour](images/flask-app-with-colour.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: I can't see the colours
+
+If your web app doesn't look right, your CSS file might not be in the right directory.
+
+Make sure your `webapp` project directory contains the following files and has the following structure:
+
+```
+├── app.py
+├── static
+│   └── style.css
+└── templates
+    └── index.html
+    └── cakes.html
+```
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/hi-IN/step_6.md b/hi-IN/step_6.md
new file mode 100644
index 0000000..35cb28a
--- /dev/null
+++ b/hi-IN/step_6.md
@@ -0,0 +1,107 @@
+## Dynamic content
+
+Websites like Facebook, YouTube and BBC News have dynamic content: these websites show different content within the same template.
+
+Now you will create a new route on your website so that the page will show you a personalised greeting.
+
+\--- task ---
+
+Open `app.py` and add a new route to your application:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+@app.route('/hello/<name>')
+def hello(name):
+return render_template('page.html', name=name)
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new HTML template in the templates folder called `page.html`, and add the following HTML code to it:
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>Hello {{ name }}!</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save both files, then visit `localhost:5000/hello/Paul` in the **Chromium browser**.
+
+The page you see should look like this:
+
+![A website displaying the text 'Hello Paul!'](images/flask-hello-paul.png)
+
+Try replacing `Paul` in the address bar with a different name!
+
+\--- /task ---
+
+\--- task ---
+
+Open your `index.html` template and add a link to the hello page under the heading.
+
+## --- code ---
+
+language: html
+line_numbers: true
+line_number_start: 6
+line_highlights: 7
+-------------------------------------------------------
+
+<h1>My website</h1><a href="/hello/paul">Hi Paul</a>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html`, and then open `localhost:5000` to see the updated version.
+
+![A website with blue text on a beige background. The text reads 'My website' in a header font and then a link to 'Hi Paul'](images/flask-app-link.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: How does this route work?
+
+- `@app.route('/hello/<name>')`: the `<name>` part passes the text written in the URL into the `hello` function as a variable called `name`.
+- `def hello(name)`: this is the function that determines what content is shown. Here, the function takes the given name as a parameter.
+- `return render_template('page.html', name=name)`: this code looks up the template `page.html` and passes in the variable `name` from the URL so that the template can use it.
+
+Flask uses `jinja`, a Python library for rendering templates. Look at this code with the braces (curly brackets):
+
+```html
+<h1>Hello {{ name }}!</h1>
+```
+
+This code tells the template to use the variable `name` that was passed in the route function `hello`.
+
+Visiting `localhost:5000/hello/` without a name creates an error.
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/hi-IN/step_7.md b/hi-IN/step_7.md
new file mode 100644
index 0000000..a55110e
--- /dev/null
+++ b/hi-IN/step_7.md
@@ -0,0 +1,25 @@
+## Challenge
+
+\--- task ---
+
+Add another route for your website.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some **hex codes** for other colours you could use in your CSS.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some more HTML tags to use in your templates.
+
+\--- /task ---
+
+\--- task ---
+
+Use dynamic content in another way in your website.
+
+\--- /task ---
\ No newline at end of file
diff --git a/hi-IN/step_8.md b/hi-IN/step_8.md
new file mode 100644
index 0000000..632e66a
--- /dev/null
+++ b/hi-IN/step_8.md
@@ -0,0 +1,17 @@
+## What can you do now?
+
+Try our [Introduction to web](https://projects.raspberrypi.org/en/pathways/web-intro) project pathway where you will learn how to structure and style webpages with images, lists, fonts, quotes, links, and animation.
+
+\--- print-only ---
+
+![Completed project](images/solution.png)
+
+\--- /print-only ---
+
+\--- no-print ---
+
+<iframe src="https://editor.raspberrypi.org/en/embed/viewer/anime-expressions-complete" width="600" height="800" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen> </iframe>
+
+\--- /no-print ---
+
+Or, why not try out another [HTML and CSS](https://projects.raspberrypi.org/en/projects?software%5B%5D=html-css-javascript) project.
\ No newline at end of file
diff --git a/it-IT/images/banner.png b/it-IT/images/banner.png
new file mode 100644
index 0000000..082983c
Binary files /dev/null and b/it-IT/images/banner.png differ
diff --git a/it-IT/images/flask-app-link.png b/it-IT/images/flask-app-link.png
new file mode 100644
index 0000000..c75fee1
Binary files /dev/null and b/it-IT/images/flask-app-link.png differ
diff --git a/it-IT/images/flask-app-with-colour.png b/it-IT/images/flask-app-with-colour.png
new file mode 100644
index 0000000..11aee4b
Binary files /dev/null and b/it-IT/images/flask-app-with-colour.png differ
diff --git a/it-IT/images/flask-cakes.png b/it-IT/images/flask-cakes.png
new file mode 100644
index 0000000..2232934
Binary files /dev/null and b/it-IT/images/flask-cakes.png differ
diff --git a/it-IT/images/flask-hello-paul.png b/it-IT/images/flask-hello-paul.png
new file mode 100644
index 0000000..e6b519e
Binary files /dev/null and b/it-IT/images/flask-hello-paul.png differ
diff --git a/it-IT/images/flask-hello-world.png b/it-IT/images/flask-hello-world.png
new file mode 100644
index 0000000..fa6c410
Binary files /dev/null and b/it-IT/images/flask-hello-world.png differ
diff --git a/it-IT/images/flask-template.png b/it-IT/images/flask-template.png
new file mode 100644
index 0000000..a62457e
Binary files /dev/null and b/it-IT/images/flask-template.png differ
diff --git a/it-IT/images/html-file.png b/it-IT/images/html-file.png
new file mode 100644
index 0000000..dead737
Binary files /dev/null and b/it-IT/images/html-file.png differ
diff --git a/it-IT/images/idle-css.png b/it-IT/images/idle-css.png
new file mode 100644
index 0000000..090a1ac
Binary files /dev/null and b/it-IT/images/idle-css.png differ
diff --git a/it-IT/images/idle-html.png b/it-IT/images/idle-html.png
new file mode 100644
index 0000000..f3d229a
Binary files /dev/null and b/it-IT/images/idle-html.png differ
diff --git a/it-IT/images/open-terminal.png b/it-IT/images/open-terminal.png
new file mode 100644
index 0000000..c4bf48e
Binary files /dev/null and b/it-IT/images/open-terminal.png differ
diff --git a/it-IT/images/open-text-editor.png b/it-IT/images/open-text-editor.png
new file mode 100644
index 0000000..552b289
Binary files /dev/null and b/it-IT/images/open-text-editor.png differ
diff --git a/it-IT/images/pi-run-web-app.png b/it-IT/images/pi-run-web-app.png
new file mode 100644
index 0000000..6973df6
Binary files /dev/null and b/it-IT/images/pi-run-web-app.png differ
diff --git a/it-IT/images/solution.png b/it-IT/images/solution.png
new file mode 100644
index 0000000..9f2de5a
Binary files /dev/null and b/it-IT/images/solution.png differ
diff --git a/it-IT/meta.yml b/it-IT/meta.yml
new file mode 100644
index 0000000..a524516
--- /dev/null
+++ b/it-IT/meta.yml
@@ -0,0 +1,33 @@
+---
+title: Build a Python Web Server with Flask
+hero_image: images/banner.png
+description: Install the Python web framework Flask and set up a basic web server with different pages
+original_url: https://raspberrypi.org/learning/python-web-server-with-flask
+theme: yellow
+duration: 2
+listed: true
+ingredient: false
+copyedit: true
+curriculum: 3, design-0, programming-3, phys-comp-0, manufacture-0, community-0
+interests: ''
+technologies: python, html-css-javascript
+site_areas: projects
+hardware: ''
+software: python, html-css-javascript
+version: 4.1
+last_tested: 2018-08-02
+steps:
+- title: What you will make
+- title: Create the app
+  completion:
+  - engaged
+- title: Add a new page
+- title: Create a HTML template
+- title: Use CSS styles
+  completion:
+  - internal
+- title: Dynamic content
+  completion:
+  - external
+- title: 'Challenge'
+  challenge: true
diff --git a/it-IT/step_1.md b/it-IT/step_1.md
new file mode 100644
index 0000000..639b373
--- /dev/null
+++ b/it-IT/step_1.md
@@ -0,0 +1,30 @@
+## What you will make
+
+Set up a web server and create a simple website using Flask, Python, and HTML/CSS.
+The web server will be able to react to the dynamic content that the user inputs.
+
+![A web browser open on a page with blue text on a beige background. The text says 'My website' and has a link to 'Hi Paul'.](images/flask-app-link.png)
+
+### You will need:
+
+- A Raspberry Pi with the latest Raspberry Pi OS
+
+## --- collapse ---
+
+## title: Installing Flask
+
+`Flask` should be pre-installed as part of Raspberry Pi OS, so you shouldn't need to do anything.
+
+You can install it manually with the command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+sudo apt install python3-flask
+
+\--- /code ---
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/it-IT/step_2.md b/it-IT/step_2.md
new file mode 100644
index 0000000..04d580f
--- /dev/null
+++ b/it-IT/step_2.md
@@ -0,0 +1,106 @@
+## Create the app
+
+\--- task ---
+
+Open a terminal and use the `mkdir` command to create a new directory inside your documents folder called `webapp`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Use the 'change directory' command `cd` to open the new directory.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+From the **Programming** menu, open **Thonny**.
+
+\--- /task ---
+
+\--- task ---
+
+Add this Python code into the blank file.
+
+## --- code ---
+
+language: python
+line_numbers: false
+--------------------------------------------------------
+
+from flask import Flask
+
+app = Flask(**name**)
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+if **name** == '**main**':
+app.run(debug=True, host='0.0.0.0')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the new file with the name `app.py` inside the `webapp` folder you just created.
+
+\--- /task ---
+
+\--- task ---
+
+Go back to your terminal window and run the script you just wrote:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+If everything is working correctly, the window should show you output similar to this:
+
+![pi run web app](images/pi-run-web-app.png)
+
+\--- task ---
+
+From your Raspberry Pi's menu, open **Internet** > **Chromium web browser**
+
+\--- /task ---
+
+\--- task ---
+
+In the address bar, type `localhost:5000` and press <kbd>Enter</kbd>. You should see the welcome page.
+
+\--- /task ---
+
+![Flask Hello world](images/flask-hello-world.png)
+
+
diff --git a/it-IT/step_3.md b/it-IT/step_3.md
new file mode 100644
index 0000000..8c7c7a1
--- /dev/null
+++ b/it-IT/step_3.md
@@ -0,0 +1,57 @@
+## Add a new page
+
+To add a new page to your web app, you create a new **route**.
+
+## --- collapse ---
+
+## title: What is a route?
+
+In the code you already have, there is a single route:
+
+```python
+@app.route('/')
+def index():
+    return 'Hello world'
+```
+
+This route is made up of three parts:
+
+- `@app.route('/')`: what you add to the web address to access this route - `/`
+- `def index()`: the name of the route - `index`
+- `return 'Hello world'`: the contents the user will see - `Hello world`
+
+\--- /collapse ---
+
+\--- task ---
+
+Add the code for a new route to `app.py` and **save** the file.
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+@app.route('/cakes')
+def cakes():
+return 'Yummy cakes!'
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+In the **Chromium web browser**, type `localhost:5000/cakes` in the address bar.
+
+You should see a web page with the text "Yummy cakes!" on it.
+
+![Yummy Cakes](images/flask-cakes.png)
+
+\--- /task ---
diff --git a/it-IT/step_4.md b/it-IT/step_4.md
new file mode 100644
index 0000000..5c9fe10
--- /dev/null
+++ b/it-IT/step_4.md
@@ -0,0 +1,118 @@
+## Create a HTML template
+
+You can use a **template** to give your page a style. The template will use **HyperText Markup Language (HTML)**.
+
+\--- task ---
+
+Go to your terminal and press <kbd>Ctrl</kbd> + <kbd>C</kbd> to stop your flask server.
+
+\--- /task ---
+
+\--- task ---
+
+Create a `templates` directory in your `webapp` directory:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir templates
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `index.html` inside your `templates` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add this code to `index.html` and **save** your changes.
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+![A new file called index.html containing the code above](images/html-file.png)
+
+\--- /task ---
+
+\--- task ---
+
+\--- /task ---
+
+\--- task ---
+
+Return to your `app.py` file and change the first line of code:
+
+## --- code ---
+
+language: python
+line_numbers: true
+-------------------------------------------------------
+
+from flask import Flask, render_template
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Change the `index()` route to use your `index.html` HTML template:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 7
+-------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save `app.py` then go back to the terminal and run it to restart your server:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go to `localhost:5000/` page in **Chromium** to see your new HTML template displayed.
+
+![A web browser pointed at localhost:5000 with the text 'My website' in a large header font](images/flask-template.png)
+
+\--- /task ---
+
diff --git a/it-IT/step_5.md b/it-IT/step_5.md
new file mode 100644
index 0000000..7b9915d
--- /dev/null
+++ b/it-IT/step_5.md
@@ -0,0 +1,118 @@
+## Use CSS styles
+
+**Cascading Style Sheets (CSS)** are rules to tell a browser how to display HTML content.
+
+\--- task ---
+
+Open a new terminal window, so that you can leave the Flask web server running in the other one.
+
+\--- /task ---
+
+\--- task ---
+
+Make sure you are in the `webapp` directory using this command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new directory called `static`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir static
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `style.css` inside your `static` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add the following CSS rules to `style.css` then **save** the file. This is your stylesheet.
+
+## --- code ---
+
+language: css
+line_numbers: true
+-------------------------------------------------------
+
+body {
+background: beige;
+color: blue;
+}
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Now modify your `index.html` HTML template to include the CSS stylesheet:
+
+## --- code ---
+
+language: css
+line_numbers: true
+line_number_start: 1
+line_highlights: 2-4
+---------------------------------------------------------
+
+<html>
+<head>
+<link rel="stylesheet" href="/static/style.css" />
+</head>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html` then go back to **Chromium** and refresh the browser. You should see a colourful version of your web app!
+
+![Flask app with colour](images/flask-app-with-colour.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: I can't see the colours
+
+If your web app doesn't look right, your CSS file might not be in the right directory.
+
+Make sure your `webapp` project directory contains the following files and has the following structure:
+
+```
+├── app.py
+├── static
+│   └── style.css
+└── templates
+    └── index.html
+    └── cakes.html
+```
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/it-IT/step_6.md b/it-IT/step_6.md
new file mode 100644
index 0000000..35cb28a
--- /dev/null
+++ b/it-IT/step_6.md
@@ -0,0 +1,107 @@
+## Dynamic content
+
+Websites like Facebook, YouTube and BBC News have dynamic content: these websites show different content within the same template.
+
+Now you will create a new route on your website so that the page will show you a personalised greeting.
+
+\--- task ---
+
+Open `app.py` and add a new route to your application:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+@app.route('/hello/<name>')
+def hello(name):
+return render_template('page.html', name=name)
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new HTML template in the templates folder called `page.html`, and add the following HTML code to it:
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>Hello {{ name }}!</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save both files, then visit `localhost:5000/hello/Paul` in the **Chromium browser**.
+
+The page you see should look like this:
+
+![A website displaying the text 'Hello Paul!'](images/flask-hello-paul.png)
+
+Try replacing `Paul` in the address bar with a different name!
+
+\--- /task ---
+
+\--- task ---
+
+Open your `index.html` template and add a link to the hello page under the heading.
+
+## --- code ---
+
+language: html
+line_numbers: true
+line_number_start: 6
+line_highlights: 7
+-------------------------------------------------------
+
+<h1>My website</h1><a href="/hello/paul">Hi Paul</a>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html`, and then open `localhost:5000` to see the updated version.
+
+![A website with blue text on a beige background. The text reads 'My website' in a header font and then a link to 'Hi Paul'](images/flask-app-link.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: How does this route work?
+
+- `@app.route('/hello/<name>')`: the `<name>` part passes the text written in the URL into the `hello` function as a variable called `name`.
+- `def hello(name)`: this is the function that determines what content is shown. Here, the function takes the given name as a parameter.
+- `return render_template('page.html', name=name)`: this code looks up the template `page.html` and passes in the variable `name` from the URL so that the template can use it.
+
+Flask uses `jinja`, a Python library for rendering templates. Look at this code with the braces (curly brackets):
+
+```html
+<h1>Hello {{ name }}!</h1>
+```
+
+This code tells the template to use the variable `name` that was passed in the route function `hello`.
+
+Visiting `localhost:5000/hello/` without a name creates an error.
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/it-IT/step_7.md b/it-IT/step_7.md
new file mode 100644
index 0000000..a55110e
--- /dev/null
+++ b/it-IT/step_7.md
@@ -0,0 +1,25 @@
+## Challenge
+
+\--- task ---
+
+Add another route for your website.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some **hex codes** for other colours you could use in your CSS.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some more HTML tags to use in your templates.
+
+\--- /task ---
+
+\--- task ---
+
+Use dynamic content in another way in your website.
+
+\--- /task ---
\ No newline at end of file
diff --git a/it-IT/step_8.md b/it-IT/step_8.md
new file mode 100644
index 0000000..632e66a
--- /dev/null
+++ b/it-IT/step_8.md
@@ -0,0 +1,17 @@
+## What can you do now?
+
+Try our [Introduction to web](https://projects.raspberrypi.org/en/pathways/web-intro) project pathway where you will learn how to structure and style webpages with images, lists, fonts, quotes, links, and animation.
+
+\--- print-only ---
+
+![Completed project](images/solution.png)
+
+\--- /print-only ---
+
+\--- no-print ---
+
+<iframe src="https://editor.raspberrypi.org/en/embed/viewer/anime-expressions-complete" width="600" height="800" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen> </iframe>
+
+\--- /no-print ---
+
+Or, why not try out another [HTML and CSS](https://projects.raspberrypi.org/en/projects?software%5B%5D=html-css-javascript) project.
\ No newline at end of file
diff --git a/ja-JP/images/banner.png b/ja-JP/images/banner.png
new file mode 100644
index 0000000..082983c
Binary files /dev/null and b/ja-JP/images/banner.png differ
diff --git a/ja-JP/images/flask-app-link.png b/ja-JP/images/flask-app-link.png
new file mode 100644
index 0000000..c75fee1
Binary files /dev/null and b/ja-JP/images/flask-app-link.png differ
diff --git a/ja-JP/images/flask-app-with-colour.png b/ja-JP/images/flask-app-with-colour.png
new file mode 100644
index 0000000..11aee4b
Binary files /dev/null and b/ja-JP/images/flask-app-with-colour.png differ
diff --git a/ja-JP/images/flask-cakes.png b/ja-JP/images/flask-cakes.png
new file mode 100644
index 0000000..2232934
Binary files /dev/null and b/ja-JP/images/flask-cakes.png differ
diff --git a/ja-JP/images/flask-hello-paul.png b/ja-JP/images/flask-hello-paul.png
new file mode 100644
index 0000000..e6b519e
Binary files /dev/null and b/ja-JP/images/flask-hello-paul.png differ
diff --git a/ja-JP/images/flask-hello-world.png b/ja-JP/images/flask-hello-world.png
new file mode 100644
index 0000000..fa6c410
Binary files /dev/null and b/ja-JP/images/flask-hello-world.png differ
diff --git a/ja-JP/images/flask-template.png b/ja-JP/images/flask-template.png
new file mode 100644
index 0000000..a62457e
Binary files /dev/null and b/ja-JP/images/flask-template.png differ
diff --git a/ja-JP/images/html-file.png b/ja-JP/images/html-file.png
new file mode 100644
index 0000000..dead737
Binary files /dev/null and b/ja-JP/images/html-file.png differ
diff --git a/ja-JP/images/idle-css.png b/ja-JP/images/idle-css.png
new file mode 100644
index 0000000..090a1ac
Binary files /dev/null and b/ja-JP/images/idle-css.png differ
diff --git a/ja-JP/images/idle-html.png b/ja-JP/images/idle-html.png
new file mode 100644
index 0000000..f3d229a
Binary files /dev/null and b/ja-JP/images/idle-html.png differ
diff --git a/ja-JP/images/open-terminal.png b/ja-JP/images/open-terminal.png
new file mode 100644
index 0000000..c4bf48e
Binary files /dev/null and b/ja-JP/images/open-terminal.png differ
diff --git a/ja-JP/images/open-text-editor.png b/ja-JP/images/open-text-editor.png
new file mode 100644
index 0000000..552b289
Binary files /dev/null and b/ja-JP/images/open-text-editor.png differ
diff --git a/ja-JP/images/pi-run-web-app.png b/ja-JP/images/pi-run-web-app.png
new file mode 100644
index 0000000..6973df6
Binary files /dev/null and b/ja-JP/images/pi-run-web-app.png differ
diff --git a/ja-JP/images/solution.png b/ja-JP/images/solution.png
new file mode 100644
index 0000000..9f2de5a
Binary files /dev/null and b/ja-JP/images/solution.png differ
diff --git a/ja-JP/meta.yml b/ja-JP/meta.yml
new file mode 100644
index 0000000..a524516
--- /dev/null
+++ b/ja-JP/meta.yml
@@ -0,0 +1,33 @@
+---
+title: Build a Python Web Server with Flask
+hero_image: images/banner.png
+description: Install the Python web framework Flask and set up a basic web server with different pages
+original_url: https://raspberrypi.org/learning/python-web-server-with-flask
+theme: yellow
+duration: 2
+listed: true
+ingredient: false
+copyedit: true
+curriculum: 3, design-0, programming-3, phys-comp-0, manufacture-0, community-0
+interests: ''
+technologies: python, html-css-javascript
+site_areas: projects
+hardware: ''
+software: python, html-css-javascript
+version: 4.1
+last_tested: 2018-08-02
+steps:
+- title: What you will make
+- title: Create the app
+  completion:
+  - engaged
+- title: Add a new page
+- title: Create a HTML template
+- title: Use CSS styles
+  completion:
+  - internal
+- title: Dynamic content
+  completion:
+  - external
+- title: 'Challenge'
+  challenge: true
diff --git a/ja-JP/step_1.md b/ja-JP/step_1.md
new file mode 100644
index 0000000..639b373
--- /dev/null
+++ b/ja-JP/step_1.md
@@ -0,0 +1,30 @@
+## What you will make
+
+Set up a web server and create a simple website using Flask, Python, and HTML/CSS.
+The web server will be able to react to the dynamic content that the user inputs.
+
+![A web browser open on a page with blue text on a beige background. The text says 'My website' and has a link to 'Hi Paul'.](images/flask-app-link.png)
+
+### You will need:
+
+- A Raspberry Pi with the latest Raspberry Pi OS
+
+## --- collapse ---
+
+## title: Installing Flask
+
+`Flask` should be pre-installed as part of Raspberry Pi OS, so you shouldn't need to do anything.
+
+You can install it manually with the command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+sudo apt install python3-flask
+
+\--- /code ---
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/ja-JP/step_2.md b/ja-JP/step_2.md
new file mode 100644
index 0000000..04d580f
--- /dev/null
+++ b/ja-JP/step_2.md
@@ -0,0 +1,106 @@
+## Create the app
+
+\--- task ---
+
+Open a terminal and use the `mkdir` command to create a new directory inside your documents folder called `webapp`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Use the 'change directory' command `cd` to open the new directory.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+From the **Programming** menu, open **Thonny**.
+
+\--- /task ---
+
+\--- task ---
+
+Add this Python code into the blank file.
+
+## --- code ---
+
+language: python
+line_numbers: false
+--------------------------------------------------------
+
+from flask import Flask
+
+app = Flask(**name**)
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+if **name** == '**main**':
+app.run(debug=True, host='0.0.0.0')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the new file with the name `app.py` inside the `webapp` folder you just created.
+
+\--- /task ---
+
+\--- task ---
+
+Go back to your terminal window and run the script you just wrote:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+If everything is working correctly, the window should show you output similar to this:
+
+![pi run web app](images/pi-run-web-app.png)
+
+\--- task ---
+
+From your Raspberry Pi's menu, open **Internet** > **Chromium web browser**
+
+\--- /task ---
+
+\--- task ---
+
+In the address bar, type `localhost:5000` and press <kbd>Enter</kbd>. You should see the welcome page.
+
+\--- /task ---
+
+![Flask Hello world](images/flask-hello-world.png)
+
+
diff --git a/ja-JP/step_3.md b/ja-JP/step_3.md
new file mode 100644
index 0000000..8c7c7a1
--- /dev/null
+++ b/ja-JP/step_3.md
@@ -0,0 +1,57 @@
+## Add a new page
+
+To add a new page to your web app, you create a new **route**.
+
+## --- collapse ---
+
+## title: What is a route?
+
+In the code you already have, there is a single route:
+
+```python
+@app.route('/')
+def index():
+    return 'Hello world'
+```
+
+This route is made up of three parts:
+
+- `@app.route('/')`: what you add to the web address to access this route - `/`
+- `def index()`: the name of the route - `index`
+- `return 'Hello world'`: the contents the user will see - `Hello world`
+
+\--- /collapse ---
+
+\--- task ---
+
+Add the code for a new route to `app.py` and **save** the file.
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+@app.route('/cakes')
+def cakes():
+return 'Yummy cakes!'
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+In the **Chromium web browser**, type `localhost:5000/cakes` in the address bar.
+
+You should see a web page with the text "Yummy cakes!" on it.
+
+![Yummy Cakes](images/flask-cakes.png)
+
+\--- /task ---
diff --git a/ja-JP/step_4.md b/ja-JP/step_4.md
new file mode 100644
index 0000000..5c9fe10
--- /dev/null
+++ b/ja-JP/step_4.md
@@ -0,0 +1,118 @@
+## Create a HTML template
+
+You can use a **template** to give your page a style. The template will use **HyperText Markup Language (HTML)**.
+
+\--- task ---
+
+Go to your terminal and press <kbd>Ctrl</kbd> + <kbd>C</kbd> to stop your flask server.
+
+\--- /task ---
+
+\--- task ---
+
+Create a `templates` directory in your `webapp` directory:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir templates
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `index.html` inside your `templates` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add this code to `index.html` and **save** your changes.
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+![A new file called index.html containing the code above](images/html-file.png)
+
+\--- /task ---
+
+\--- task ---
+
+\--- /task ---
+
+\--- task ---
+
+Return to your `app.py` file and change the first line of code:
+
+## --- code ---
+
+language: python
+line_numbers: true
+-------------------------------------------------------
+
+from flask import Flask, render_template
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Change the `index()` route to use your `index.html` HTML template:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 7
+-------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save `app.py` then go back to the terminal and run it to restart your server:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go to `localhost:5000/` page in **Chromium** to see your new HTML template displayed.
+
+![A web browser pointed at localhost:5000 with the text 'My website' in a large header font](images/flask-template.png)
+
+\--- /task ---
+
diff --git a/ja-JP/step_5.md b/ja-JP/step_5.md
new file mode 100644
index 0000000..7b9915d
--- /dev/null
+++ b/ja-JP/step_5.md
@@ -0,0 +1,118 @@
+## Use CSS styles
+
+**Cascading Style Sheets (CSS)** are rules to tell a browser how to display HTML content.
+
+\--- task ---
+
+Open a new terminal window, so that you can leave the Flask web server running in the other one.
+
+\--- /task ---
+
+\--- task ---
+
+Make sure you are in the `webapp` directory using this command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new directory called `static`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir static
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `style.css` inside your `static` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add the following CSS rules to `style.css` then **save** the file. This is your stylesheet.
+
+## --- code ---
+
+language: css
+line_numbers: true
+-------------------------------------------------------
+
+body {
+background: beige;
+color: blue;
+}
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Now modify your `index.html` HTML template to include the CSS stylesheet:
+
+## --- code ---
+
+language: css
+line_numbers: true
+line_number_start: 1
+line_highlights: 2-4
+---------------------------------------------------------
+
+<html>
+<head>
+<link rel="stylesheet" href="/static/style.css" />
+</head>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html` then go back to **Chromium** and refresh the browser. You should see a colourful version of your web app!
+
+![Flask app with colour](images/flask-app-with-colour.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: I can't see the colours
+
+If your web app doesn't look right, your CSS file might not be in the right directory.
+
+Make sure your `webapp` project directory contains the following files and has the following structure:
+
+```
+├── app.py
+├── static
+│   └── style.css
+└── templates
+    └── index.html
+    └── cakes.html
+```
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/ja-JP/step_6.md b/ja-JP/step_6.md
new file mode 100644
index 0000000..35cb28a
--- /dev/null
+++ b/ja-JP/step_6.md
@@ -0,0 +1,107 @@
+## Dynamic content
+
+Websites like Facebook, YouTube and BBC News have dynamic content: these websites show different content within the same template.
+
+Now you will create a new route on your website so that the page will show you a personalised greeting.
+
+\--- task ---
+
+Open `app.py` and add a new route to your application:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+@app.route('/hello/<name>')
+def hello(name):
+return render_template('page.html', name=name)
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new HTML template in the templates folder called `page.html`, and add the following HTML code to it:
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>Hello {{ name }}!</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save both files, then visit `localhost:5000/hello/Paul` in the **Chromium browser**.
+
+The page you see should look like this:
+
+![A website displaying the text 'Hello Paul!'](images/flask-hello-paul.png)
+
+Try replacing `Paul` in the address bar with a different name!
+
+\--- /task ---
+
+\--- task ---
+
+Open your `index.html` template and add a link to the hello page under the heading.
+
+## --- code ---
+
+language: html
+line_numbers: true
+line_number_start: 6
+line_highlights: 7
+-------------------------------------------------------
+
+<h1>My website</h1><a href="/hello/paul">Hi Paul</a>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html`, and then open `localhost:5000` to see the updated version.
+
+![A website with blue text on a beige background. The text reads 'My website' in a header font and then a link to 'Hi Paul'](images/flask-app-link.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: How does this route work?
+
+- `@app.route('/hello/<name>')`: the `<name>` part passes the text written in the URL into the `hello` function as a variable called `name`.
+- `def hello(name)`: this is the function that determines what content is shown. Here, the function takes the given name as a parameter.
+- `return render_template('page.html', name=name)`: this code looks up the template `page.html` and passes in the variable `name` from the URL so that the template can use it.
+
+Flask uses `jinja`, a Python library for rendering templates. Look at this code with the braces (curly brackets):
+
+```html
+<h1>Hello {{ name }}!</h1>
+```
+
+This code tells the template to use the variable `name` that was passed in the route function `hello`.
+
+Visiting `localhost:5000/hello/` without a name creates an error.
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/ja-JP/step_7.md b/ja-JP/step_7.md
new file mode 100644
index 0000000..a55110e
--- /dev/null
+++ b/ja-JP/step_7.md
@@ -0,0 +1,25 @@
+## Challenge
+
+\--- task ---
+
+Add another route for your website.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some **hex codes** for other colours you could use in your CSS.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some more HTML tags to use in your templates.
+
+\--- /task ---
+
+\--- task ---
+
+Use dynamic content in another way in your website.
+
+\--- /task ---
\ No newline at end of file
diff --git a/ja-JP/step_8.md b/ja-JP/step_8.md
new file mode 100644
index 0000000..632e66a
--- /dev/null
+++ b/ja-JP/step_8.md
@@ -0,0 +1,17 @@
+## What can you do now?
+
+Try our [Introduction to web](https://projects.raspberrypi.org/en/pathways/web-intro) project pathway where you will learn how to structure and style webpages with images, lists, fonts, quotes, links, and animation.
+
+\--- print-only ---
+
+![Completed project](images/solution.png)
+
+\--- /print-only ---
+
+\--- no-print ---
+
+<iframe src="https://editor.raspberrypi.org/en/embed/viewer/anime-expressions-complete" width="600" height="800" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen> </iframe>
+
+\--- /no-print ---
+
+Or, why not try out another [HTML and CSS](https://projects.raspberrypi.org/en/projects?software%5B%5D=html-css-javascript) project.
\ No newline at end of file
diff --git a/nl-NL/images/banner.png b/nl-NL/images/banner.png
new file mode 100644
index 0000000..082983c
Binary files /dev/null and b/nl-NL/images/banner.png differ
diff --git a/nl-NL/images/flask-app-link.png b/nl-NL/images/flask-app-link.png
new file mode 100644
index 0000000..c75fee1
Binary files /dev/null and b/nl-NL/images/flask-app-link.png differ
diff --git a/nl-NL/images/flask-app-with-colour.png b/nl-NL/images/flask-app-with-colour.png
new file mode 100644
index 0000000..11aee4b
Binary files /dev/null and b/nl-NL/images/flask-app-with-colour.png differ
diff --git a/nl-NL/images/flask-cakes.png b/nl-NL/images/flask-cakes.png
new file mode 100644
index 0000000..2232934
Binary files /dev/null and b/nl-NL/images/flask-cakes.png differ
diff --git a/nl-NL/images/flask-hello-paul.png b/nl-NL/images/flask-hello-paul.png
new file mode 100644
index 0000000..e6b519e
Binary files /dev/null and b/nl-NL/images/flask-hello-paul.png differ
diff --git a/nl-NL/images/flask-hello-world.png b/nl-NL/images/flask-hello-world.png
new file mode 100644
index 0000000..fa6c410
Binary files /dev/null and b/nl-NL/images/flask-hello-world.png differ
diff --git a/nl-NL/images/flask-template.png b/nl-NL/images/flask-template.png
new file mode 100644
index 0000000..a62457e
Binary files /dev/null and b/nl-NL/images/flask-template.png differ
diff --git a/nl-NL/images/html-file.png b/nl-NL/images/html-file.png
new file mode 100644
index 0000000..dead737
Binary files /dev/null and b/nl-NL/images/html-file.png differ
diff --git a/nl-NL/images/idle-css.png b/nl-NL/images/idle-css.png
new file mode 100644
index 0000000..090a1ac
Binary files /dev/null and b/nl-NL/images/idle-css.png differ
diff --git a/nl-NL/images/idle-html.png b/nl-NL/images/idle-html.png
new file mode 100644
index 0000000..f3d229a
Binary files /dev/null and b/nl-NL/images/idle-html.png differ
diff --git a/nl-NL/images/open-terminal.png b/nl-NL/images/open-terminal.png
new file mode 100644
index 0000000..c4bf48e
Binary files /dev/null and b/nl-NL/images/open-terminal.png differ
diff --git a/nl-NL/images/open-text-editor.png b/nl-NL/images/open-text-editor.png
new file mode 100644
index 0000000..552b289
Binary files /dev/null and b/nl-NL/images/open-text-editor.png differ
diff --git a/nl-NL/images/pi-run-web-app.png b/nl-NL/images/pi-run-web-app.png
new file mode 100644
index 0000000..6973df6
Binary files /dev/null and b/nl-NL/images/pi-run-web-app.png differ
diff --git a/nl-NL/images/solution.png b/nl-NL/images/solution.png
new file mode 100644
index 0000000..9f2de5a
Binary files /dev/null and b/nl-NL/images/solution.png differ
diff --git a/nl-NL/meta.yml b/nl-NL/meta.yml
new file mode 100644
index 0000000..614c87f
--- /dev/null
+++ b/nl-NL/meta.yml
@@ -0,0 +1,33 @@
+---
+title: Bouw een Python-webserver met Flask
+hero_image: images/banner.png
+description: Installeer het Python webframework Flask en stel een eenvoudige webserver in met verschillende pagina's
+original_url: https://raspberrypi.org/learning/python-web-server-with-flask
+theme: yellow
+duration: 2
+listed: true
+ingredient: false
+copyedit: true
+curriculum: 3, design-0, programming-3, phys-comp-0, manufacture-0, community-0
+interests: ''
+technologies: python, html-css-javascript
+site_areas: projects
+hardware: ''
+software: python, html-css-javascript
+version: 4.1
+last_tested: 2018-08-02
+steps:
+- title: Wat je gaat maken
+- title: Maak de app
+  completion:
+  - engaged
+- title: Een nieuwe pagina toevoegen
+- title: Een HTML-sjabloon maken
+- title: EDITED STRING
+  completion:
+  - internal
+- title: Dynamische inhoud
+  completion:
+  - external
+- title: 'Uitdaging'
+  challenge: true
diff --git a/nl-NL/step_1.md b/nl-NL/step_1.md
new file mode 100644
index 0000000..c25141c
--- /dev/null
+++ b/nl-NL/step_1.md
@@ -0,0 +1,30 @@
+## Wat je gaat maken
+
+Zet een webserver op en maak een eenvoudige website met behulp van Flask, Python en HTML/CSS.
+De webserver kan reageren op de dynamische inhoud die de gebruiker invoert.
+
+![Een webbrowser geopend op een pagina met blauwe tekst op een beige achtergrond. De tekst luidt 'Mijn website' en bevat een link naar 'Hoi Paul'.](images/flask-app-link.png)
+
+### Wat heb je nodig:
+
+- Een Raspberry Pi met het nieuwste Raspberry Pi OS
+
+## --- collapse ---
+
+## title: Flask installeren
+
+`Flask` zou vooraf geïnstalleerd moeten zijn als onderdeel van Raspberry Pi OS, dus u hoeft niets te doen.
+
+U kunt het handmatig installeren met de opdracht:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+sudo apt install python3-flask
+
+\--- /code ---
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/nl-NL/step_2.md b/nl-NL/step_2.md
new file mode 100644
index 0000000..147b3fa
--- /dev/null
+++ b/nl-NL/step_2.md
@@ -0,0 +1,106 @@
+## Maak de app
+
+\--- task ---
+
+Open een terminal en gebruik de opdracht `mkdir` om een nieuwe map met de naam `webapp` te maken in uw documentenmap.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Gebruik de opdracht `cd` om de nieuwe map te openen.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Open **Thonny** in het menu **Programmeren**.
+
+\--- /task ---
+
+\--- task ---
+
+Voeg deze Python-code toe aan het lege bestand.
+
+## --- code ---
+
+language: python
+line_numbers: false
+--------------------------------------------------------
+
+from flask import Flask
+
+app = Flask(**name**)
+
+@app.route('/')
+def index():
+return 'Hallo wereld'
+
+if **name** == '**main**':
+app.run(debug=True, host='0.0.0.0')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Sla het nieuwe bestand op onder de naam `app.py` in de map `webapp` die u zojuist hebt gemaakt.
+
+\--- /task ---
+
+\--- task ---
+
+Ga terug naar uw terminalvenster en voer het script uit dat u zojuist hebt geschreven:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+Als alles goed werkt, ziet u in het venster uitvoer die er ongeveer zo uitziet:
+
+![pi voert web-app uit](images/pi-run-web-app.png)
+
+\--- task ---
+
+Open in het menu van je Raspberry Pi **Internet** > **Chromium webbrowser**
+
+\--- /task ---
+
+\--- task ---
+
+Typ `localhost:5000` in de adresbalk en druk op <kbd>en voer</kbd>in. U zou de welkomstpagina moeten zien.
+
+\--- /task ---
+
+![Flask Hallo wereld](images/flask-hello-world.png)
+
+
diff --git a/nl-NL/step_3.md b/nl-NL/step_3.md
new file mode 100644
index 0000000..4080141
--- /dev/null
+++ b/nl-NL/step_3.md
@@ -0,0 +1,57 @@
+## Een nieuwe pagina toevoegen
+
+Om een nieuwe pagina aan uw web-app toe te voegen, maakt u een nieuwe **route**.
+
+## --- collapse ---
+
+## title: Wat is een route?
+
+In de code die u al hebt, is er één route:
+
+```python
+@app.route('/')
+def index():
+    return 'Hallo wereld'
+```
+
+Deze route bestaat uit drie delen:
+
+- `@app.route('/')`: wat u toevoegt aan het webadres om toegang te krijgen tot deze route - `/`
+- `def index()`: de naam van de route - `index`
+- `return 'Hallo wereld'`: de inhoud die de gebruiker zal zien - `Hallo wereld`
+
+\--- /collapse ---
+
+\--- task ---
+
+Voeg de code voor een nieuwe route toe aan `app.py` en **sla** het bestand op.
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return 'Hallo wereld'
+
+@app.route('/cakes')
+def cakes():
+return 'Lekkere taarten!'
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Typ in de **Chromium webbrowser** `localhost:5000/cakes` in de adresbalk.
+
+U zou een webpagina moeten zien met de tekst "Lekkere taarten!" erop.
+
+![Lekkere taarten](images/flask-cakes.png)
+
+\--- /task ---
diff --git a/nl-NL/step_4.md b/nl-NL/step_4.md
new file mode 100644
index 0000000..4f9845a
--- /dev/null
+++ b/nl-NL/step_4.md
@@ -0,0 +1,118 @@
+## Een HTML-sjabloon maken
+
+U kunt een **sjabloon** gebruiken om uw pagina een stijl te geven. De sjabloon maakt gebruik van **HyperText Markup Language (HTML)**.
+
+\--- task ---
+
+Ga naar je terminal en druk op <kbd>Ctrl</kbd> + <kbd>C</kbd> om je Flask-server te stoppen.
+
+\--- /task ---
+
+\--- task ---
+
+Maak een `templates`-map in uw `webapp`-map:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir templates
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Ga terug naar **Thomny** en maak een nieuw bestand. Sla dit bestand op als `index.html` in uw `templates`-map.
+
+\--- /task ---
+
+\--- task ---
+
+Voeg deze code toe aan `index.html` en **sla** uw wijzigingen op.
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>Mijn website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+![Een nieuw bestand genaamd index.html met de bovenstaande code](images/html-file.png)
+
+\--- /task ---
+
+\--- task ---
+
+\--- /task ---
+
+\--- task ---
+
+Ga terug naar uw `app.py`-bestand en wijzig de eerste regel code:
+
+## --- code ---
+
+language: python
+line_numbers: true
+-------------------------------------------------------
+
+from flask import Flask, render_template
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Wijzig de `index()`-route om uw `index.html` HTML-sjabloon te gebruiken:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 7
+-------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Sla `app.py` op en ga terug naar de terminal om het bestand uit te voeren en uw server opnieuw op te starten:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Ga naar de pagina `localhost:5000/` in **Chromium** om uw nieuwe HTML-sjabloon te zien.
+
+![Een webbrowser verwees naar localhost:5000 met de tekst 'Mijn website' in een groot koptekstlettertype](images/flask-template.png)
+
+\--- /task ---
+
diff --git a/nl-NL/step_5.md b/nl-NL/step_5.md
new file mode 100644
index 0000000..44ed760
--- /dev/null
+++ b/nl-NL/step_5.md
@@ -0,0 +1,118 @@
+## Gebruik CSS-stijlen
+
+**Cascading Style Sheets (CSS)** zijn regels die een browser vertellen hoe HTML-inhoud moet worden weergegeven.
+
+\--- task ---
+
+Open een nieuw terminalvenster, zodat u de Flask-webserver in het andere venster draaiende kunt laten.
+
+\--- /task ---
+
+\--- task ---
+
+Zorg ervoor dat u zich in de map `webapp` bevindt met behulp van deze opdracht:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Maak een nieuwe map met de naam `static`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir static
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Ga terug naar **Thomny** en maak een nieuw bestand. Sla dit bestand op als `style.css` in uw `static` map.
+
+\--- /task ---
+
+\--- task ---
+
+Voeg de volgende CSS-regels toe aan `style.css` en **sla** het bestand op. Dit is uw stijlblad.
+
+## --- code ---
+
+language: css
+line_numbers: true
+-------------------------------------------------------
+
+body {
+background: beige;
+color: blue;
+}
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Wijzig nu uw HTML-sjabloon `index.html` zodat deze het CSS-stijlblad bevat:
+
+## --- code ---
+
+language: css
+line_numbers: true
+line_number_start: 1
+line_highlights: 2-4
+---------------------------------------------------------
+
+<html>
+<head>
+<link rel="stylesheet" href="/static/style.css" />
+</head>
+<body>
+<h1>Mijn website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Sla de wijzigingen op in `index.html` en ga terug naar **Chromium** om de browser te vernieuwen. U zou een kleurrijke versie van uw web-app moeten zien!
+
+![Flask-app met kleur](images/flask-app-with-colour.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## titel: Ik kan de kleuren niet zien
+
+Als uw webapp er niet goed uitziet, staat uw CSS-bestand mogelijk niet in de juiste map.
+
+Zorg ervoor dat de projectmap `webapp` de volgende bestanden bevat en de volgende structuur heeft:
+
+```
+├── app.py
+├── static
+│   └── style.css
+└── templates
+    └── index.html
+    └── cakes.html
+```
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/nl-NL/step_6.md b/nl-NL/step_6.md
new file mode 100644
index 0000000..6b4358b
--- /dev/null
+++ b/nl-NL/step_6.md
@@ -0,0 +1,107 @@
+## Dynamische inhoud
+
+Websites als Facebook, YouTube en BBC News hebben dynamische inhoud: deze websites tonen verschillende inhoud binnen dezelfde template.
+
+Nu gaat u een nieuwe route op uw website aanmaken, zodat de pagina een persoonlijke begroeting toont.
+
+\--- task ---
+
+Open `app.py` en voeg een nieuwe route toe aan uw applicatie:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+@app.route('/hello/<name>')
+def hello(name):
+return render_template('page.html', name=name)
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Maak een nieuwe HTML-sjabloon in de sjablonenmap met de naam `page.html` en voeg de volgende HTML-code eraan toe:
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>Hallo {{ name }}!</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Sla beide bestanden op en ga vervolgens naar `localhost:5000/hello/Paul` in de **Chromium-browser**.
+
+De pagina die u ziet, zou er als volgt uit moeten zien:
+
+![Een website die de tekst 'Hallo Paul!' weergeeft](images/flask-hello-paul.png)
+
+Probeer `Paul` in de adresbalk te vervangen door een andere naam!
+
+\--- /task ---
+
+\--- task ---
+
+Open uw `index.html`-sjabloon en voeg een link naar de hallo-pagina toe onder de kop.
+
+## --- code ---
+
+language: html
+line_numbers: true
+line_number_start: 6
+line_highlights: 7
+-------------------------------------------------------
+
+<h1>Mijn website</h1><a href="/hello/paul">Hallo Paul</a>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Sla de wijzigingen op in `index.html` en open vervolgens `localhost:5000` om de bijgewerkte versie te bekijken.
+
+![Een website met blauwe tekst op een beige achtergrond. De tekst luidt 'Mijn website' in een koptekstlettertype en vervolgens een link naar 'Hoi Paul'](images/flask-app-link.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## titel: Hoe werkt deze route?
+
+- `@app.route('/hello/<name>')`: het `<name>` gedeelte geeft de tekst die in de URL staat door aan de `hello` functie als een variabele met de naam `name`.
+- `def hello(name)`: dit is de functie die bepaalt welke inhoud wordt getoond. Hierbij neemt de functie de opgegeven naam als parameter.
+- `return render_template('page.html', name=name)`: deze code zoekt de sjabloon `page.html` op en geeft de variabele `name` uit de URL door, zodat de sjabloon deze kan gebruiken.
+
+Flask maakt gebruik van `jinja`, een Python-bibliotheek voor het renderen van sjablonen. Kijk eens naar deze code met de accolades:
+
+```html
+<h1>Hallo {{ name }}!</h1>
+```
+
+Deze code vertelt de sjabloon om de variabele `name` te gebruiken die is doorgegeven in de routefunctie `hello`.
+
+Als u `localhost:5000/hello/` bezoekt zonder een naam, ontstaat er een fout.
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/nl-NL/step_7.md b/nl-NL/step_7.md
new file mode 100644
index 0000000..46cbd6c
--- /dev/null
+++ b/nl-NL/step_7.md
@@ -0,0 +1,25 @@
+## Uitdaging
+
+\--- task ---
+
+Voeg een andere route toe voor uw website.
+
+\--- /task ---
+
+\--- task ---
+
+Zoek een aantal **hex-codes** op voor andere kleuren die je in je CSS kunt gebruiken.
+
+\--- /task ---
+
+\--- task ---
+
+Zoek nog meer HTML-tags op die u in uw sjablonen kunt gebruiken.
+
+\--- /task ---
+
+\--- task ---
+
+Gebruik dynamische inhoud op een andere manier op uw website.
+
+\--- /task ---
\ No newline at end of file
diff --git a/nl-NL/step_8.md b/nl-NL/step_8.md
new file mode 100644
index 0000000..1dec231
--- /dev/null
+++ b/nl-NL/step_8.md
@@ -0,0 +1,17 @@
+## Wat kun je nu doen?
+
+Probeer ons projectpad [Introductie tot web](https://projects.raspberrypi.org/en/pathways/web-intro), waarin u leert hoe u webpagina's kunt structureren en stylen met afbeeldingen, lijsten, lettertypen, citaten, links en animaties.
+
+\--- print-only ---
+
+![Voltooid project](images/solution.png)
+
+\--- /print-only ---
+
+\--- no-print ---
+
+<iframe src="https://editor.raspberrypi.org/en/embed/viewer/anime-expressions-complete" width="600" height="800" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen> </iframe>
+
+\--- /no-print ---
+
+Of probeer een ander [HTML en CSS](https://projects.raspberrypi.org/en/projects?software%5B%5D=html-css-javascript) project.
\ No newline at end of file
diff --git a/pt-BR/images/banner.png b/pt-BR/images/banner.png
new file mode 100644
index 0000000..082983c
Binary files /dev/null and b/pt-BR/images/banner.png differ
diff --git a/pt-BR/images/flask-app-link.png b/pt-BR/images/flask-app-link.png
new file mode 100644
index 0000000..c75fee1
Binary files /dev/null and b/pt-BR/images/flask-app-link.png differ
diff --git a/pt-BR/images/flask-app-with-colour.png b/pt-BR/images/flask-app-with-colour.png
new file mode 100644
index 0000000..11aee4b
Binary files /dev/null and b/pt-BR/images/flask-app-with-colour.png differ
diff --git a/pt-BR/images/flask-cakes.png b/pt-BR/images/flask-cakes.png
new file mode 100644
index 0000000..2232934
Binary files /dev/null and b/pt-BR/images/flask-cakes.png differ
diff --git a/pt-BR/images/flask-hello-paul.png b/pt-BR/images/flask-hello-paul.png
new file mode 100644
index 0000000..e6b519e
Binary files /dev/null and b/pt-BR/images/flask-hello-paul.png differ
diff --git a/pt-BR/images/flask-hello-world.png b/pt-BR/images/flask-hello-world.png
new file mode 100644
index 0000000..fa6c410
Binary files /dev/null and b/pt-BR/images/flask-hello-world.png differ
diff --git a/pt-BR/images/flask-template.png b/pt-BR/images/flask-template.png
new file mode 100644
index 0000000..a62457e
Binary files /dev/null and b/pt-BR/images/flask-template.png differ
diff --git a/pt-BR/images/html-file.png b/pt-BR/images/html-file.png
new file mode 100644
index 0000000..dead737
Binary files /dev/null and b/pt-BR/images/html-file.png differ
diff --git a/pt-BR/images/idle-css.png b/pt-BR/images/idle-css.png
new file mode 100644
index 0000000..090a1ac
Binary files /dev/null and b/pt-BR/images/idle-css.png differ
diff --git a/pt-BR/images/idle-html.png b/pt-BR/images/idle-html.png
new file mode 100644
index 0000000..f3d229a
Binary files /dev/null and b/pt-BR/images/idle-html.png differ
diff --git a/pt-BR/images/open-terminal.png b/pt-BR/images/open-terminal.png
new file mode 100644
index 0000000..c4bf48e
Binary files /dev/null and b/pt-BR/images/open-terminal.png differ
diff --git a/pt-BR/images/open-text-editor.png b/pt-BR/images/open-text-editor.png
new file mode 100644
index 0000000..552b289
Binary files /dev/null and b/pt-BR/images/open-text-editor.png differ
diff --git a/pt-BR/images/pi-run-web-app.png b/pt-BR/images/pi-run-web-app.png
new file mode 100644
index 0000000..6973df6
Binary files /dev/null and b/pt-BR/images/pi-run-web-app.png differ
diff --git a/pt-BR/images/solution.png b/pt-BR/images/solution.png
new file mode 100644
index 0000000..9f2de5a
Binary files /dev/null and b/pt-BR/images/solution.png differ
diff --git a/pt-BR/meta.yml b/pt-BR/meta.yml
new file mode 100644
index 0000000..a524516
--- /dev/null
+++ b/pt-BR/meta.yml
@@ -0,0 +1,33 @@
+---
+title: Build a Python Web Server with Flask
+hero_image: images/banner.png
+description: Install the Python web framework Flask and set up a basic web server with different pages
+original_url: https://raspberrypi.org/learning/python-web-server-with-flask
+theme: yellow
+duration: 2
+listed: true
+ingredient: false
+copyedit: true
+curriculum: 3, design-0, programming-3, phys-comp-0, manufacture-0, community-0
+interests: ''
+technologies: python, html-css-javascript
+site_areas: projects
+hardware: ''
+software: python, html-css-javascript
+version: 4.1
+last_tested: 2018-08-02
+steps:
+- title: What you will make
+- title: Create the app
+  completion:
+  - engaged
+- title: Add a new page
+- title: Create a HTML template
+- title: Use CSS styles
+  completion:
+  - internal
+- title: Dynamic content
+  completion:
+  - external
+- title: 'Challenge'
+  challenge: true
diff --git a/pt-BR/step_1.md b/pt-BR/step_1.md
new file mode 100644
index 0000000..639b373
--- /dev/null
+++ b/pt-BR/step_1.md
@@ -0,0 +1,30 @@
+## What you will make
+
+Set up a web server and create a simple website using Flask, Python, and HTML/CSS.
+The web server will be able to react to the dynamic content that the user inputs.
+
+![A web browser open on a page with blue text on a beige background. The text says 'My website' and has a link to 'Hi Paul'.](images/flask-app-link.png)
+
+### You will need:
+
+- A Raspberry Pi with the latest Raspberry Pi OS
+
+## --- collapse ---
+
+## title: Installing Flask
+
+`Flask` should be pre-installed as part of Raspberry Pi OS, so you shouldn't need to do anything.
+
+You can install it manually with the command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+sudo apt install python3-flask
+
+\--- /code ---
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/pt-BR/step_2.md b/pt-BR/step_2.md
new file mode 100644
index 0000000..04d580f
--- /dev/null
+++ b/pt-BR/step_2.md
@@ -0,0 +1,106 @@
+## Create the app
+
+\--- task ---
+
+Open a terminal and use the `mkdir` command to create a new directory inside your documents folder called `webapp`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Use the 'change directory' command `cd` to open the new directory.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+From the **Programming** menu, open **Thonny**.
+
+\--- /task ---
+
+\--- task ---
+
+Add this Python code into the blank file.
+
+## --- code ---
+
+language: python
+line_numbers: false
+--------------------------------------------------------
+
+from flask import Flask
+
+app = Flask(**name**)
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+if **name** == '**main**':
+app.run(debug=True, host='0.0.0.0')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the new file with the name `app.py` inside the `webapp` folder you just created.
+
+\--- /task ---
+
+\--- task ---
+
+Go back to your terminal window and run the script you just wrote:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+If everything is working correctly, the window should show you output similar to this:
+
+![pi run web app](images/pi-run-web-app.png)
+
+\--- task ---
+
+From your Raspberry Pi's menu, open **Internet** > **Chromium web browser**
+
+\--- /task ---
+
+\--- task ---
+
+In the address bar, type `localhost:5000` and press <kbd>Enter</kbd>. You should see the welcome page.
+
+\--- /task ---
+
+![Flask Hello world](images/flask-hello-world.png)
+
+
diff --git a/pt-BR/step_3.md b/pt-BR/step_3.md
new file mode 100644
index 0000000..8c7c7a1
--- /dev/null
+++ b/pt-BR/step_3.md
@@ -0,0 +1,57 @@
+## Add a new page
+
+To add a new page to your web app, you create a new **route**.
+
+## --- collapse ---
+
+## title: What is a route?
+
+In the code you already have, there is a single route:
+
+```python
+@app.route('/')
+def index():
+    return 'Hello world'
+```
+
+This route is made up of three parts:
+
+- `@app.route('/')`: what you add to the web address to access this route - `/`
+- `def index()`: the name of the route - `index`
+- `return 'Hello world'`: the contents the user will see - `Hello world`
+
+\--- /collapse ---
+
+\--- task ---
+
+Add the code for a new route to `app.py` and **save** the file.
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+@app.route('/cakes')
+def cakes():
+return 'Yummy cakes!'
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+In the **Chromium web browser**, type `localhost:5000/cakes` in the address bar.
+
+You should see a web page with the text "Yummy cakes!" on it.
+
+![Yummy Cakes](images/flask-cakes.png)
+
+\--- /task ---
diff --git a/pt-BR/step_4.md b/pt-BR/step_4.md
new file mode 100644
index 0000000..5c9fe10
--- /dev/null
+++ b/pt-BR/step_4.md
@@ -0,0 +1,118 @@
+## Create a HTML template
+
+You can use a **template** to give your page a style. The template will use **HyperText Markup Language (HTML)**.
+
+\--- task ---
+
+Go to your terminal and press <kbd>Ctrl</kbd> + <kbd>C</kbd> to stop your flask server.
+
+\--- /task ---
+
+\--- task ---
+
+Create a `templates` directory in your `webapp` directory:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir templates
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `index.html` inside your `templates` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add this code to `index.html` and **save** your changes.
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+![A new file called index.html containing the code above](images/html-file.png)
+
+\--- /task ---
+
+\--- task ---
+
+\--- /task ---
+
+\--- task ---
+
+Return to your `app.py` file and change the first line of code:
+
+## --- code ---
+
+language: python
+line_numbers: true
+-------------------------------------------------------
+
+from flask import Flask, render_template
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Change the `index()` route to use your `index.html` HTML template:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 7
+-------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save `app.py` then go back to the terminal and run it to restart your server:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go to `localhost:5000/` page in **Chromium** to see your new HTML template displayed.
+
+![A web browser pointed at localhost:5000 with the text 'My website' in a large header font](images/flask-template.png)
+
+\--- /task ---
+
diff --git a/pt-BR/step_5.md b/pt-BR/step_5.md
new file mode 100644
index 0000000..7b9915d
--- /dev/null
+++ b/pt-BR/step_5.md
@@ -0,0 +1,118 @@
+## Use CSS styles
+
+**Cascading Style Sheets (CSS)** are rules to tell a browser how to display HTML content.
+
+\--- task ---
+
+Open a new terminal window, so that you can leave the Flask web server running in the other one.
+
+\--- /task ---
+
+\--- task ---
+
+Make sure you are in the `webapp` directory using this command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new directory called `static`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir static
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `style.css` inside your `static` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add the following CSS rules to `style.css` then **save** the file. This is your stylesheet.
+
+## --- code ---
+
+language: css
+line_numbers: true
+-------------------------------------------------------
+
+body {
+background: beige;
+color: blue;
+}
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Now modify your `index.html` HTML template to include the CSS stylesheet:
+
+## --- code ---
+
+language: css
+line_numbers: true
+line_number_start: 1
+line_highlights: 2-4
+---------------------------------------------------------
+
+<html>
+<head>
+<link rel="stylesheet" href="/static/style.css" />
+</head>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html` then go back to **Chromium** and refresh the browser. You should see a colourful version of your web app!
+
+![Flask app with colour](images/flask-app-with-colour.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: I can't see the colours
+
+If your web app doesn't look right, your CSS file might not be in the right directory.
+
+Make sure your `webapp` project directory contains the following files and has the following structure:
+
+```
+├── app.py
+├── static
+│   └── style.css
+└── templates
+    └── index.html
+    └── cakes.html
+```
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/pt-BR/step_6.md b/pt-BR/step_6.md
new file mode 100644
index 0000000..35cb28a
--- /dev/null
+++ b/pt-BR/step_6.md
@@ -0,0 +1,107 @@
+## Dynamic content
+
+Websites like Facebook, YouTube and BBC News have dynamic content: these websites show different content within the same template.
+
+Now you will create a new route on your website so that the page will show you a personalised greeting.
+
+\--- task ---
+
+Open `app.py` and add a new route to your application:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+@app.route('/hello/<name>')
+def hello(name):
+return render_template('page.html', name=name)
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new HTML template in the templates folder called `page.html`, and add the following HTML code to it:
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>Hello {{ name }}!</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save both files, then visit `localhost:5000/hello/Paul` in the **Chromium browser**.
+
+The page you see should look like this:
+
+![A website displaying the text 'Hello Paul!'](images/flask-hello-paul.png)
+
+Try replacing `Paul` in the address bar with a different name!
+
+\--- /task ---
+
+\--- task ---
+
+Open your `index.html` template and add a link to the hello page under the heading.
+
+## --- code ---
+
+language: html
+line_numbers: true
+line_number_start: 6
+line_highlights: 7
+-------------------------------------------------------
+
+<h1>My website</h1><a href="/hello/paul">Hi Paul</a>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html`, and then open `localhost:5000` to see the updated version.
+
+![A website with blue text on a beige background. The text reads 'My website' in a header font and then a link to 'Hi Paul'](images/flask-app-link.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: How does this route work?
+
+- `@app.route('/hello/<name>')`: the `<name>` part passes the text written in the URL into the `hello` function as a variable called `name`.
+- `def hello(name)`: this is the function that determines what content is shown. Here, the function takes the given name as a parameter.
+- `return render_template('page.html', name=name)`: this code looks up the template `page.html` and passes in the variable `name` from the URL so that the template can use it.
+
+Flask uses `jinja`, a Python library for rendering templates. Look at this code with the braces (curly brackets):
+
+```html
+<h1>Hello {{ name }}!</h1>
+```
+
+This code tells the template to use the variable `name` that was passed in the route function `hello`.
+
+Visiting `localhost:5000/hello/` without a name creates an error.
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/pt-BR/step_7.md b/pt-BR/step_7.md
new file mode 100644
index 0000000..a55110e
--- /dev/null
+++ b/pt-BR/step_7.md
@@ -0,0 +1,25 @@
+## Challenge
+
+\--- task ---
+
+Add another route for your website.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some **hex codes** for other colours you could use in your CSS.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some more HTML tags to use in your templates.
+
+\--- /task ---
+
+\--- task ---
+
+Use dynamic content in another way in your website.
+
+\--- /task ---
\ No newline at end of file
diff --git a/pt-BR/step_8.md b/pt-BR/step_8.md
new file mode 100644
index 0000000..632e66a
--- /dev/null
+++ b/pt-BR/step_8.md
@@ -0,0 +1,17 @@
+## What can you do now?
+
+Try our [Introduction to web](https://projects.raspberrypi.org/en/pathways/web-intro) project pathway where you will learn how to structure and style webpages with images, lists, fonts, quotes, links, and animation.
+
+\--- print-only ---
+
+![Completed project](images/solution.png)
+
+\--- /print-only ---
+
+\--- no-print ---
+
+<iframe src="https://editor.raspberrypi.org/en/embed/viewer/anime-expressions-complete" width="600" height="800" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen> </iframe>
+
+\--- /no-print ---
+
+Or, why not try out another [HTML and CSS](https://projects.raspberrypi.org/en/projects?software%5B%5D=html-css-javascript) project.
\ No newline at end of file
diff --git a/uk-UA/images/banner.png b/uk-UA/images/banner.png
new file mode 100644
index 0000000..082983c
Binary files /dev/null and b/uk-UA/images/banner.png differ
diff --git a/uk-UA/images/flask-app-link.png b/uk-UA/images/flask-app-link.png
new file mode 100644
index 0000000..c75fee1
Binary files /dev/null and b/uk-UA/images/flask-app-link.png differ
diff --git a/uk-UA/images/flask-app-with-colour.png b/uk-UA/images/flask-app-with-colour.png
new file mode 100644
index 0000000..11aee4b
Binary files /dev/null and b/uk-UA/images/flask-app-with-colour.png differ
diff --git a/uk-UA/images/flask-cakes.png b/uk-UA/images/flask-cakes.png
new file mode 100644
index 0000000..2232934
Binary files /dev/null and b/uk-UA/images/flask-cakes.png differ
diff --git a/uk-UA/images/flask-hello-paul.png b/uk-UA/images/flask-hello-paul.png
new file mode 100644
index 0000000..e6b519e
Binary files /dev/null and b/uk-UA/images/flask-hello-paul.png differ
diff --git a/uk-UA/images/flask-hello-world.png b/uk-UA/images/flask-hello-world.png
new file mode 100644
index 0000000..fa6c410
Binary files /dev/null and b/uk-UA/images/flask-hello-world.png differ
diff --git a/uk-UA/images/flask-template.png b/uk-UA/images/flask-template.png
new file mode 100644
index 0000000..a62457e
Binary files /dev/null and b/uk-UA/images/flask-template.png differ
diff --git a/uk-UA/images/html-file.png b/uk-UA/images/html-file.png
new file mode 100644
index 0000000..dead737
Binary files /dev/null and b/uk-UA/images/html-file.png differ
diff --git a/uk-UA/images/idle-css.png b/uk-UA/images/idle-css.png
new file mode 100644
index 0000000..090a1ac
Binary files /dev/null and b/uk-UA/images/idle-css.png differ
diff --git a/uk-UA/images/idle-html.png b/uk-UA/images/idle-html.png
new file mode 100644
index 0000000..f3d229a
Binary files /dev/null and b/uk-UA/images/idle-html.png differ
diff --git a/uk-UA/images/open-terminal.png b/uk-UA/images/open-terminal.png
new file mode 100644
index 0000000..c4bf48e
Binary files /dev/null and b/uk-UA/images/open-terminal.png differ
diff --git a/uk-UA/images/open-text-editor.png b/uk-UA/images/open-text-editor.png
new file mode 100644
index 0000000..552b289
Binary files /dev/null and b/uk-UA/images/open-text-editor.png differ
diff --git a/uk-UA/images/pi-run-web-app.png b/uk-UA/images/pi-run-web-app.png
new file mode 100644
index 0000000..6973df6
Binary files /dev/null and b/uk-UA/images/pi-run-web-app.png differ
diff --git a/uk-UA/images/solution.png b/uk-UA/images/solution.png
new file mode 100644
index 0000000..9f2de5a
Binary files /dev/null and b/uk-UA/images/solution.png differ
diff --git a/uk-UA/meta.yml b/uk-UA/meta.yml
new file mode 100644
index 0000000..a524516
--- /dev/null
+++ b/uk-UA/meta.yml
@@ -0,0 +1,33 @@
+---
+title: Build a Python Web Server with Flask
+hero_image: images/banner.png
+description: Install the Python web framework Flask and set up a basic web server with different pages
+original_url: https://raspberrypi.org/learning/python-web-server-with-flask
+theme: yellow
+duration: 2
+listed: true
+ingredient: false
+copyedit: true
+curriculum: 3, design-0, programming-3, phys-comp-0, manufacture-0, community-0
+interests: ''
+technologies: python, html-css-javascript
+site_areas: projects
+hardware: ''
+software: python, html-css-javascript
+version: 4.1
+last_tested: 2018-08-02
+steps:
+- title: What you will make
+- title: Create the app
+  completion:
+  - engaged
+- title: Add a new page
+- title: Create a HTML template
+- title: Use CSS styles
+  completion:
+  - internal
+- title: Dynamic content
+  completion:
+  - external
+- title: 'Challenge'
+  challenge: true
diff --git a/uk-UA/step_1.md b/uk-UA/step_1.md
new file mode 100644
index 0000000..639b373
--- /dev/null
+++ b/uk-UA/step_1.md
@@ -0,0 +1,30 @@
+## What you will make
+
+Set up a web server and create a simple website using Flask, Python, and HTML/CSS.
+The web server will be able to react to the dynamic content that the user inputs.
+
+![A web browser open on a page with blue text on a beige background. The text says 'My website' and has a link to 'Hi Paul'.](images/flask-app-link.png)
+
+### You will need:
+
+- A Raspberry Pi with the latest Raspberry Pi OS
+
+## --- collapse ---
+
+## title: Installing Flask
+
+`Flask` should be pre-installed as part of Raspberry Pi OS, so you shouldn't need to do anything.
+
+You can install it manually with the command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+sudo apt install python3-flask
+
+\--- /code ---
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/uk-UA/step_2.md b/uk-UA/step_2.md
new file mode 100644
index 0000000..04d580f
--- /dev/null
+++ b/uk-UA/step_2.md
@@ -0,0 +1,106 @@
+## Create the app
+
+\--- task ---
+
+Open a terminal and use the `mkdir` command to create a new directory inside your documents folder called `webapp`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Use the 'change directory' command `cd` to open the new directory.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+From the **Programming** menu, open **Thonny**.
+
+\--- /task ---
+
+\--- task ---
+
+Add this Python code into the blank file.
+
+## --- code ---
+
+language: python
+line_numbers: false
+--------------------------------------------------------
+
+from flask import Flask
+
+app = Flask(**name**)
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+if **name** == '**main**':
+app.run(debug=True, host='0.0.0.0')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the new file with the name `app.py` inside the `webapp` folder you just created.
+
+\--- /task ---
+
+\--- task ---
+
+Go back to your terminal window and run the script you just wrote:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+If everything is working correctly, the window should show you output similar to this:
+
+![pi run web app](images/pi-run-web-app.png)
+
+\--- task ---
+
+From your Raspberry Pi's menu, open **Internet** > **Chromium web browser**
+
+\--- /task ---
+
+\--- task ---
+
+In the address bar, type `localhost:5000` and press <kbd>Enter</kbd>. You should see the welcome page.
+
+\--- /task ---
+
+![Flask Hello world](images/flask-hello-world.png)
+
+
diff --git a/uk-UA/step_3.md b/uk-UA/step_3.md
new file mode 100644
index 0000000..8c7c7a1
--- /dev/null
+++ b/uk-UA/step_3.md
@@ -0,0 +1,57 @@
+## Add a new page
+
+To add a new page to your web app, you create a new **route**.
+
+## --- collapse ---
+
+## title: What is a route?
+
+In the code you already have, there is a single route:
+
+```python
+@app.route('/')
+def index():
+    return 'Hello world'
+```
+
+This route is made up of three parts:
+
+- `@app.route('/')`: what you add to the web address to access this route - `/`
+- `def index()`: the name of the route - `index`
+- `return 'Hello world'`: the contents the user will see - `Hello world`
+
+\--- /collapse ---
+
+\--- task ---
+
+Add the code for a new route to `app.py` and **save** the file.
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return 'Hello world'
+
+@app.route('/cakes')
+def cakes():
+return 'Yummy cakes!'
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+In the **Chromium web browser**, type `localhost:5000/cakes` in the address bar.
+
+You should see a web page with the text "Yummy cakes!" on it.
+
+![Yummy Cakes](images/flask-cakes.png)
+
+\--- /task ---
diff --git a/uk-UA/step_4.md b/uk-UA/step_4.md
new file mode 100644
index 0000000..5c9fe10
--- /dev/null
+++ b/uk-UA/step_4.md
@@ -0,0 +1,118 @@
+## Create a HTML template
+
+You can use a **template** to give your page a style. The template will use **HyperText Markup Language (HTML)**.
+
+\--- task ---
+
+Go to your terminal and press <kbd>Ctrl</kbd> + <kbd>C</kbd> to stop your flask server.
+
+\--- /task ---
+
+\--- task ---
+
+Create a `templates` directory in your `webapp` directory:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir templates
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `index.html` inside your `templates` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add this code to `index.html` and **save** your changes.
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+![A new file called index.html containing the code above](images/html-file.png)
+
+\--- /task ---
+
+\--- task ---
+
+\--- /task ---
+
+\--- task ---
+
+Return to your `app.py` file and change the first line of code:
+
+## --- code ---
+
+language: python
+line_numbers: true
+-------------------------------------------------------
+
+from flask import Flask, render_template
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Change the `index()` route to use your `index.html` HTML template:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 7
+-------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save `app.py` then go back to the terminal and run it to restart your server:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+python3 app.py
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go to `localhost:5000/` page in **Chromium** to see your new HTML template displayed.
+
+![A web browser pointed at localhost:5000 with the text 'My website' in a large header font](images/flask-template.png)
+
+\--- /task ---
+
diff --git a/uk-UA/step_5.md b/uk-UA/step_5.md
new file mode 100644
index 0000000..7b9915d
--- /dev/null
+++ b/uk-UA/step_5.md
@@ -0,0 +1,118 @@
+## Use CSS styles
+
+**Cascading Style Sheets (CSS)** are rules to tell a browser how to display HTML content.
+
+\--- task ---
+
+Open a new terminal window, so that you can leave the Flask web server running in the other one.
+
+\--- /task ---
+
+\--- task ---
+
+Make sure you are in the `webapp` directory using this command:
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+cd ~/Documents/webapp
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new directory called `static`.
+
+## --- code ---
+
+language: bash
+line_numbers: false
+--------------------------------------------------------
+
+mkdir static
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Go back to **Thonny** and create a new file. Save this file as `style.css` inside your `static` folder.
+
+\--- /task ---
+
+\--- task ---
+
+Add the following CSS rules to `style.css` then **save** the file. This is your stylesheet.
+
+## --- code ---
+
+language: css
+line_numbers: true
+-------------------------------------------------------
+
+body {
+background: beige;
+color: blue;
+}
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Now modify your `index.html` HTML template to include the CSS stylesheet:
+
+## --- code ---
+
+language: css
+line_numbers: true
+line_number_start: 1
+line_highlights: 2-4
+---------------------------------------------------------
+
+<html>
+<head>
+<link rel="stylesheet" href="/static/style.css" />
+</head>
+<body>
+<h1>My website</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html` then go back to **Chromium** and refresh the browser. You should see a colourful version of your web app!
+
+![Flask app with colour](images/flask-app-with-colour.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: I can't see the colours
+
+If your web app doesn't look right, your CSS file might not be in the right directory.
+
+Make sure your `webapp` project directory contains the following files and has the following structure:
+
+```
+├── app.py
+├── static
+│   └── style.css
+└── templates
+    └── index.html
+    └── cakes.html
+```
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/uk-UA/step_6.md b/uk-UA/step_6.md
new file mode 100644
index 0000000..35cb28a
--- /dev/null
+++ b/uk-UA/step_6.md
@@ -0,0 +1,107 @@
+## Dynamic content
+
+Websites like Facebook, YouTube and BBC News have dynamic content: these websites show different content within the same template.
+
+Now you will create a new route on your website so that the page will show you a personalised greeting.
+
+\--- task ---
+
+Open `app.py` and add a new route to your application:
+
+## --- code ---
+
+language: python
+line_numbers: true
+line_number_start: 5
+line_highlights: 9-11
+----------------------------------------------------------
+
+@app.route('/')
+def index():
+return render_template('index.html')
+
+@app.route('/hello/<name>')
+def hello(name):
+return render_template('page.html', name=name)
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Create a new HTML template in the templates folder called `page.html`, and add the following HTML code to it:
+
+## --- code ---
+
+language: html
+line_numbers: true
+-------------------------------------------------------
+
+<html>
+<body>
+<h1>Hello {{ name }}!</h1>
+</body>
+</html>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save both files, then visit `localhost:5000/hello/Paul` in the **Chromium browser**.
+
+The page you see should look like this:
+
+![A website displaying the text 'Hello Paul!'](images/flask-hello-paul.png)
+
+Try replacing `Paul` in the address bar with a different name!
+
+\--- /task ---
+
+\--- task ---
+
+Open your `index.html` template and add a link to the hello page under the heading.
+
+## --- code ---
+
+language: html
+line_numbers: true
+line_number_start: 6
+line_highlights: 7
+-------------------------------------------------------
+
+<h1>My website</h1><a href="/hello/paul">Hi Paul</a>
+
+\--- /code ---
+
+\--- /task ---
+
+\--- task ---
+
+Save the changes to `index.html`, and then open `localhost:5000` to see the updated version.
+
+![A website with blue text on a beige background. The text reads 'My website' in a header font and then a link to 'Hi Paul'](images/flask-app-link.png)
+
+\--- /task ---
+
+## --- collapse ---
+
+## title: How does this route work?
+
+- `@app.route('/hello/<name>')`: the `<name>` part passes the text written in the URL into the `hello` function as a variable called `name`.
+- `def hello(name)`: this is the function that determines what content is shown. Here, the function takes the given name as a parameter.
+- `return render_template('page.html', name=name)`: this code looks up the template `page.html` and passes in the variable `name` from the URL so that the template can use it.
+
+Flask uses `jinja`, a Python library for rendering templates. Look at this code with the braces (curly brackets):
+
+```html
+<h1>Hello {{ name }}!</h1>
+```
+
+This code tells the template to use the variable `name` that was passed in the route function `hello`.
+
+Visiting `localhost:5000/hello/` without a name creates an error.
+
+\--- /collapse ---
\ No newline at end of file
diff --git a/uk-UA/step_7.md b/uk-UA/step_7.md
new file mode 100644
index 0000000..a55110e
--- /dev/null
+++ b/uk-UA/step_7.md
@@ -0,0 +1,25 @@
+## Challenge
+
+\--- task ---
+
+Add another route for your website.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some **hex codes** for other colours you could use in your CSS.
+
+\--- /task ---
+
+\--- task ---
+
+Look up some more HTML tags to use in your templates.
+
+\--- /task ---
+
+\--- task ---
+
+Use dynamic content in another way in your website.
+
+\--- /task ---
\ No newline at end of file
diff --git a/uk-UA/step_8.md b/uk-UA/step_8.md
new file mode 100644
index 0000000..632e66a
--- /dev/null
+++ b/uk-UA/step_8.md
@@ -0,0 +1,17 @@
+## What can you do now?
+
+Try our [Introduction to web](https://projects.raspberrypi.org/en/pathways/web-intro) project pathway where you will learn how to structure and style webpages with images, lists, fonts, quotes, links, and animation.
+
+\--- print-only ---
+
+![Completed project](images/solution.png)
+
+\--- /print-only ---
+
+\--- no-print ---
+
+<iframe src="https://editor.raspberrypi.org/en/embed/viewer/anime-expressions-complete" width="600" height="800" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen> </iframe>
+
+\--- /no-print ---
+
+Or, why not try out another [HTML and CSS](https://projects.raspberrypi.org/en/projects?software%5B%5D=html-css-javascript) project.
\ No newline at end of file