solved

app.js

@@ -0,0 +1,21 @@
+const express = require('express');
+const app = express();
+const port = 3000
+
+app.use(express.static('public'));
+
+app.get('/', (request, response) => {
+    response.sendFile (__dirname + '/views/home.html')
+})
+
+app.get('/About', (request, response) => {
+    response.sendFile (__dirname + '/views/about.html')
+})
+
+app.get('/Works', (request, response) => {
+    response.sendFile (__dirname + '/views/works.html')
+})
+
+app.listen (port, () => {
+    console.log(`Example app listening on port ${port}`)
+})

package.json

@@ -0,0 +1,15 @@
+{
+  "name": "lab-express-basic-site",
+  "version": "1.0.0",
+  "description": "![logo_ironhack_blue 7](https://user-images.githubusercontent.com/23629340/40541063-a07a0a8a-601a-11e8-91b5-2f13e4e6b441.png)",
+  "main": "app.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "express": "^4.19.2"
+  }
+}

public/css/reset.css

@@ -0,0 +1,46 @@
+/*
+  1. Use a more-intuitive box-sizing model.
+*/
+*, *::before, *::after {
+    box-sizing: border-box;
+  }
+  /*
+    2. Remove default margin
+  */
+  * {
+    margin: 10px;
+  }
+  /*
+    Typographic tweaks!
+    3. Add accessible line-height
+    4. Improve text rendering
+  */
+  body {
+    line-height: 1.5;
+    -webkit-font-smoothing: antialiased;
+  }
+  /*
+    5. Improve media defaults
+  */
+  img, picture, video, canvas, svg {
+    display: block;
+    max-width: 100%;
+  }
+  /*
+    6. Remove built-in form typography styles
+  */
+  input, button, textarea, select {
+    font: inherit;
+  }
+  /*
+    7. Avoid text overflows
+  */
+  p, h1, h2, h3, h4, h5, h6 {
+    overflow-wrap: break-word;
+  }
+  /*
+    8. Create a root stacking context
+  */
+  #root, #__next {
+    isolation: isolate;
+  }

public/css/styleAbout.css

@@ -0,0 +1,41 @@
+#nav-list {
+    display: flex;
+    color: black;
+    background-color: brown;
+    flex-direction: row;
+    justify-content: space-around;
+}
+
+ul {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-around;
+    list-style: none;
+    color: black;
+}
+
+body {
+    background-color: beige;
+}
+
+#biography {
+    display: flex;
+    width: 100%;
+    height: 100vh;
+}
+
+#brief {
+    display: flex;
+    flex-direction: column;
+    width: 50%;
+    justify-content: flex-start;
+}
+
+#images {
+    display: flex;
+    flex-direction: column;
+    width: 50%;
+    justify-content: center;
+    align-items: center;
+    padding: 20px;
+}

public/css/styleIndex.css

@@ -0,0 +1,55 @@
+#nav-list {
+    display: flex;
+    color: black;
+    background-color: brown;
+    flex-direction: row;
+    justify-content: space-around;
+}
+
+ul {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-around;
+    list-style: none;
+    color: black;
+}
+
+body {
+    background-color: black;
+    color: beige;
+}
+
+h1 {
+    font-size: 100px;
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
+}
+
+#celebrity {
+background-color: black;
+color: beige;
+display: flex;
+justify-content: space-evenly;
+align-items: center;
+}
+
+#celebrity {
+    display: flex;
+    flex-direction: row;
+    background-color: brown;
+}
+
+h2 {
+    font-size: 30px;
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
+}
+
+#info {
+    font-size: 10px;
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
+}

public/css/styleWorks.css

@@ -0,0 +1,46 @@
+#nav-list {
+    display: flex;
+    color: black;
+    background-color: brown;
+    flex-direction: row;
+    justify-content: space-around;
+}
+
+ul {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-around;
+    list-style: none;
+    color: black;
+}
+
+body {
+background-color: black;
+color: beige;
+}
+
+h1 {
+    display: flex;
+    justify-content: center;
+}
+
+#discs {
+    display: flex;
+    flex: row;
+    width: 100%;
+    height: 100vh;
+}
+
+#disc1{
+    display: flex;
+    flex-direction: column;
+    width: 50%;
+    justify-content: flex-start;
+}
+
+#disc2 {
+    display: flex;
+    flex-direction: column;
+    width: 50%;
+    justify-content: flex-end;
+}

views/about.html

@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="css/reset.css" />
+    <link rel="stylesheet" href="css/styleAbout.css">
+    <title>About</title>
+</head>
+
+<nav id="nav-list">
+    <ul>
+        <li><a href="/">Home</a></li>
+        <li><a href="/about">About</a></li>
+        <li><a href="/works">Works</a></li>
+    </ul>
+</nav>
+
+<body>
+    <h1>Who is Lewis Capaldi?</h1>
+    <div id="biography">
+        <div id="brief">
+            <h2>Briefing</h2>
+            <p1>
+                Lewis Marc Capaldi (born 7 October 1996) is a Scottish singer-songwriter and musician.
+                He was nominated for the Critics' Choice Award at the 2019 Brit Awards. Capaldi also won the 2020 Brit
+                Award
+                for Best New Artist. In March 2019, his single "Someone You Loved" (2018) topped the UK Singles Chart
+                where
+                it remained for seven
+                weeks, and in November 2019, it reached number one on the US Billboard Hot 100; it was nominated at the
+                62nd
+                Annual Grammy Awards for
+                Song of the Year and won the 2020 Brit Award for Song of the Year. "Someone You Loved" was the
+                bestselling
+                single of 2019 in the UK. In May 2020, it was announced that
+                Capaldi's song "Someone You Loved" had become the longest-running top 10 UK
+                single of all time by a British artist.
+
+                On 17 May 2019, he released his debut album, Divinely Uninspired to a Hellish Extent, which remained at
+                the
+                top of the UK Albums Chart for six weeks.
+                It later went on to become the best-selling album of 2019 and 2020 in the UK. His second album Broken by
+                Desire to Be Heavenly Sent (2023) was supported by the lead single "Forget Me",
+                released in 2022.
+                </p>
+                <h2>Early Life</h2>
+                <p2>
+                    Capaldi was born in Glasgow, Scotland, and lived there until he was 4 years old, when his family
+                    moved to East Whitburn in West Lothian. Capaldi is of Scottish, Irish and Italian ancestry. He is
+                    the youngest of four children. His mother becoming pregnant with Lewis came as a surprise to his
+                    family,
+                    being called a sort of "immaculate conception", because his father had had a vasectomy. Capaldi's
+                    passion for performing started after he sang on stage at the age of 4 on a family trip in France. He
+                    learned how to play guitar when he was nine. Soon, he began writing songs, and playing gigs by
+                    sneaking into pubs with the help of his eldest brother.
+                    </p>
+        </div>
+
+        <div id="images">
+            <img src="./images/Lewis-Capaldi-6.jpeg" alt="1" width="500px" height="auto">
+            <img src="./images/Lewis-Capaldi-7.jpeg" alt="1" width="500px" height="auto">
+        </div>
+    </div>
+
+
+</body>
+
+</html>

views/home.html

@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="css/reset.css" />
+    <link rel="stylesheet" href="css/styleIndex.css" />
+    <title>Home</title>
+</head>
+
+<nav id="nav-list">
+    <ul>
+        <li><a href="/">Home</a></li>
+        <li><a href="/about">About</a></li>
+        <li><a href="/works">Works</a></li>
+    </ul>
+  </nav>
+
+<body>
+    <h1>Lewis Capaldi</h1>
+    <div id="celebrity">
+        <img src="./images/Lewis-Capaldi-1.avif" alt="1" width="90px" height="auto">
+        <img src="./images/Lewis-Capaldi-2.jpeg" alt="2" width="90px" height="auto">
+        <img src="./images/Lewis-Capaldi-3.avif" alt="3" width="90px" height="auto">
+        <img src="./images/Lewis-Capaldi-4.jpeg" alt="4" width="90px" height="auto">
+        <img src="./images/Lewis-Capaldi-5.jpeg" alt="5" width="90px" height="auto">
+    </div>
+    <div id="name-info">
+    <h2>Singer-Songwriter</h2>
+<article id="info">27 years old - 33M Spotify Monthly Listeners - Scottish</article>
+    </div>
+</body>
+
+</html>