web-dev-open · b41r4m · Aug 29, 2024
diff --git a/app.js b/app.js
@@ -0,0 +1,21 @@
+const express = require("express");
+
+const app = express();
+
+app.use(express.static("views"));
+app.use(express.static("public"));
+
+app.get("/", (request, response, next) => {
+  response.sendFile(__dirname + "/views/index.html");
+});
+app.get("/about", (request, response, next) => {
+  response.sendFile(__dirname + "/views/about.html");
+});
+app.get("/works", (request, response, next) => {
+  response.sendFile(__dirname + "/views/works.html");
+});
+app.get("/photo-gallery", (request, response, next) => {
+  response.sendFile(__dirname + "/views/gallery.html");
+});
+
+app.listen(3000, () => console.log("My first app listening on port 3000! 🚀"));
diff --git a/package.json b/package.json
@@ -0,0 +1,16 @@
+{
+  "name": "lab-express-basic",
+  "version": "1.0.0",
+  "description": "<img src=\"https://imgur.com/XOS1Vdh.png\"  width=\"150px\" height=\"150px\">",
+  "main": "app.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "express": "^4.19.2",
+    "nodemon": "^3.1.4"
+  }
+}
diff --git a/public/images/about.jpg b/public/images/about.jpg
diff --git a/public/images/gallery1.jpg b/public/images/gallery1.jpg
diff --git a/public/images/gallery2.jpg b/public/images/gallery2.jpg
diff --git a/public/images/gallery3.jpg b/public/images/gallery3.jpg
diff --git a/public/images/gallery4.jpg b/public/images/gallery4.jpg
diff --git a/public/images/gallery5.jpg b/public/images/gallery5.jpg
diff --git a/public/images/gallery6.jpg b/public/images/gallery6.jpg
diff --git a/public/images/gallery7.jpg b/public/images/gallery7.jpg
diff --git a/public/images/homepage.jpg b/public/images/homepage.jpg
diff --git a/public/images/works.jpg b/public/images/works.jpg
diff --git a/public/stylesheets/about.css b/public/stylesheets/about.css
@@ -0,0 +1,33 @@
+body {
+  padding: 0;
+  margin: 0;
+}
+#header {
+  text-align: center;
+  padding: 20px;
+  font-size: 30px;
+}
+
+#header a {
+  text-decoration: none;
+  font-family: monospace;
+  color: #d75b2e;
+  font-weight: 700;
+}
+
+#about-section {
+  display: flex;
+  flex-direction: row;
+  font-size: 24px;
+  font-family: monospace;
+}
+
+#about-section img {
+  height: 600px;
+  margin: 20px;
+  border: 10px solid #d75b2e;
+}
+
+.para {
+  padding: 0px 100px;
+}
diff --git a/public/stylesheets/gallery.css b/public/stylesheets/gallery.css
@@ -0,0 +1,28 @@
+body {
+  padding: 0;
+  margin: 0;
+}
+#header {
+  text-align: center;
+  padding: 20px;
+  font-size: 30px;
+}
+
+#header a {
+  text-decoration: none;
+  font-family: monospace;
+  color: #d75b2e;
+  font-weight: 700;
+}
+
+#photos {
+  height: 100%;
+  display: flex;
+  flex-flow: row wrap;
+  justify-content: center;
+  align-items: center;
+}
+#photos img {
+  height: 500px;
+  margin: 20px;
+}
diff --git a/public/stylesheets/index.css b/public/stylesheets/index.css
@@ -0,0 +1,20 @@
+body {
+  padding: 0;
+  margin: 0;
+}
+#header {
+  text-align: center;
+  padding: 20px;
+  font-size: 30px;
+}
+
+#header a {
+  text-decoration: none;
+  font-family: monospace;
+  color: #d75b2e;
+  font-weight: 700;
+}
+
+img {
+  width: 100%;
+}
diff --git a/public/stylesheets/works.css b/public/stylesheets/works.css
@@ -0,0 +1,33 @@
+body {
+  padding: 0;
+  margin: 0;
+}
+#header {
+  text-align: center;
+  padding: 20px;
+  font-size: 30px;
+}
+
+#header a {
+  text-decoration: none;
+  font-family: monospace;
+  color: #d75b2e;
+  font-weight: 700;
+}
+
+#works-section {
+  display: flex;
+  flex-direction: row;
+  font-size: 20px;
+  font-family: monospace;
+}
+
+#works-section img {
+  height: 700px;
+  margin: 20px;
+  border: 10px solid #d75b2e;
+}
+
+.para {
+  padding: 0px 100px;
+}
diff --git a/views/about.html b/views/about.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>About</title>
+    <link rel="stylesheet" href="/stylesheets/about.css" />
+  </head>
+  <body>
+    <div id="header">
+      <a href="/">HOME</a> | <a href="/about">ABOUT</a> |
+      <a href="/works">WORK</a> |
+      <a href="/photo-gallery">GALLERY</a>
+    </div>
+    <div id="about-section">
+      <div>
+        <img src="/images/about.jpg" />
+      </div>
+      <div class="para">
+        <p>
+          Sai Pallavi Senthamarai Kannan is an Indian actress who primarily
+          works in Telugu, Tamil and Malayalam films. She has received numerous
+          accolades, including six Filmfare Awards South and two South Indian
+          International Movie Awards. She was featured by Forbes magazine as one
+          of India's 30 Under 30 in 2020.
+        </p>
+
+        <p>
+          After appearing in uncredited roles as a junior artist, she made her
+          major acting debut in the 2015 Malayalam film Premam. The film ranked
+          as the second highest-grossing Malayalam film at the time and her
+          portrayal of a teacher earned her the Filmfare Award for Best Debut
+          Actress - Malayalam. In 2017, she ventured into Telugu cinema with
+          Fidaa. Pallavi won her first Filmfare Award for Best Actress - Telugu
+          for her performance in the film.
+        </p>
+
+        <p>
+          Pallavi has since established herself as a leading South Indian
+          actress. She has received praises for her portrayals in the films —
+          Kali (2016), Middle Class Abbayi (2017), Maari 2 (2018), Athiran
+          (2019), the Netflix anthology film Paava Kadhaigal (2020), Love Story
+          (2021), Shyam Singha Roy (2021), and Gargi (2022). Her performances in
+          Love Story and Gargi earned the Filmfare Award for Best Actress in
+          both Telugu and Tamil. And in Shyam Singha Roy and Virata Parvam
+          gained her the Filmfare Critics Award for Best Actress - Telugu.
+        </p>
+      </div>
+    </div>
+  </body>
+</html>
diff --git a/views/gallery.html b/views/gallery.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Photo Gallery</title>
+    <link rel="stylesheet" href="/stylesheets/gallery.css" />
+  </head>
+  <body>
+    <div id="header">
+      <a href="/">HOME</a> | <a href="/about">ABOUT</a> |
+      <a href="/works">WORK</a> |
+      <a href="/photo-gallery">GALLERY</a>
+    </div>
+    <div id="photos">
+      <img src="/images/gallery1.jpg" />
+      <img src="/images/gallery2.jpg" />
+      <img src="/images/gallery3.jpg" />
+      <img src="/images/gallery4.jpg" />
+      <img src="/images/gallery5.jpg" />
+      <img src="/images/gallery6.jpg" />
+      <img src="/images/gallery7.jpg" />
+    </div>
+  </body>
+</html>
diff --git a/views/index.html b/views/index.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Sai Pallavi</title>
+    <link rel="stylesheet" href="/stylesheets/index.css" />
+  </head>
+  <body>
+    <div id="header">
+      <a href="/">HOME</a> | <a href="/about">ABOUT</a> |
+      <a href="/works">WORK</a> |
+      <a href="/photo-gallery">GALLERY</a>
+    </div>
+    <img src="/images/homepage.jpg" />
+  </body>
+</html>
diff --git a/views/works.html b/views/works.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Works</title>
+    <link rel="stylesheet" href="/stylesheets/works.css" />
+  </head>
+  <body>
+    <div id="header">
+      <a href="/">HOME</a> | <a href="/about">ABOUT</a> |
+      <a href="/works">WORK</a> |
+      <a href="/photo-gallery">GALLERY</a>
+    </div>
+    <div id="works-section">
+      <div>
+        <img src="/images/works.jpg" />
+      </div>
+      <div class="para">
+        <p>
+          In 2014, Pallavi was offered the role of Malar in Alphonse Puthren's
+          film Premam, for which Pallavi received an energetic opening in the
+          film industry. Then she went back to her studies. In late 2015, she
+          took a month's leave to act in her second movie, Kali, which was
+          released in March 2016.
+        </p>
+
+        <p>
+          Because of her work in the Telugu film Fidaa, she received her first
+          Filmfare Award for Best Actress (Telugu). She co-starred with Fahadh
+          Faasil in the 2019 movie Athiran as an autistic girl.
+        </p>
+
+        <p>
+          She has appeared in numerous critically acclaimed Tamil films, such as
+          Maari 2, NGK, Diya, and Vetrimaaran's Netflix anthology
+          Paavakadhaigal. Notably, she costarred with Dhanush in Maari 2, and
+          the song Rowdy Baby has received 1.5 billion views on YouTube, making
+          it the most-viewed song overall in India.
+        </p>
+        <p>
+          In 2021, she starred in the romantic drama Love Story directed by
+          Sekhar Kammula alongside Naga Chaitanya in her second collaboration
+          with Sekhar Kammula after Fidaa (2017) and Shyam Singa Roy opposite
+          Nani in their second collaboration after MCA where she portrayed
+          Maithreyi, a captivating devadasi in 1970s Kolkata. Her performances
+          in both Love Story and Shyam Singha Roy earned her the Critics Award
+          and the Best Actress award at the Filmfare Awards South.
+        </p>
+
+        <p>
+          In 2022 she appeared in Telugu film Virata Parvam opposite Rana
+          Daggubati. Set against the backdrop of the Naxalite movement in 1990s
+          Telangana where she portrayed Vennela. Director Gautham Ramachandran
+          announced his new female-oriented film, who earlier directed Richie
+          (2017). Pallavi was chosen to play a lead after Jyothika denied. The
+          film was announced on 9 May 2022 with the makers releasing a special
+          glimpse of the film. For her Tamil film Gargi, she dubbed her own
+          lines in both Telugu and Kannada.
+        </p>
+      </div>
+    </div>
+  </body>
+</html>