diff --git a/app.js b/app.js index e69de29bb..4f58c97e0 100644 --- a/app.js +++ b/app.js @@ -0,0 +1,26 @@ +const express = require('express'); +const path = require('path'); +const app = express(); +const port = 3000; + +// Serve static files from the public folder +app.use(express.static(path.join(__dirname, 'public'))); + +// Define routes for each page +app.get('/', (req, res) => { + res.sendFile(path.join(__dirname, 'views', 'home.html')); +}); + +app.get('/about', (req, res) => { + res.sendFile(path.join(__dirname, 'views', 'about.html')); +}); + +app.get('/work', (req, res) => { + res.sendFile(path.join(__dirname, 'views', 'work.html')); +}); + +// Start the server +app.listen(port, () => { + console.log(`Server is running on http://localhost:${port}`); +}); + diff --git a/package.json b/package.json new file mode 100644 index 000000000..0233cf441 --- /dev/null +++ b/package.json @@ -0,0 +1,17 @@ +{ + "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", + "dev": "nodemon app.js --ext js,hbs" + }, + "keywords": [], + "author": "", + "license": "ISC", + "dependencies": { + "express": "^4.21.1", + "nodemon": "^3.1.7" + } +} diff --git a/public/styles.css b/public/styles.css new file mode 100644 index 000000000..42ee05a91 --- /dev/null +++ b/public/styles.css @@ -0,0 +1,76 @@ +/* Reset some default styles */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +html, body { + height: 100%; /* Ensure the body takes the full height of the viewport */ +} + +body { + display: flex; /* Make the body a flex container */ + flex-direction: column; /* Arrange children in a column */ + font-family: Arial, sans-serif; + line-height: 1.6; + background-color: #f4f4f4; + color: #333; +} + +/* Header styles */ +header { + background: #333; + color: #fff; + padding: 10px 0; + text-align: center; +} + +header h1 { + margin-bottom: 10px; +} + +nav { + margin: 20px 0; +} + +nav a { + color: #fff; + text-decoration: none; + padding: 10px 15px; +} + +nav a:hover { + background: #444; + transition: background 0.3s; +} + +/* Main content styles */ +main { + flex: 1; /* Allow main to grow and fill available space */ + padding: 20px; + max-width: 800px; + margin: auto; +} + +section { + background: #fff; + margin: 20px 0; + padding: 20px; + border-radius: 5px; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); +} + +h2 { + margin-bottom: 10px; +} + +/* Footer styles */ +footer { + text-align: center; + padding: 10px 0; + background: #333; + color: #fff; + width: 100%; /* Make sure it stretches the full width */ +} + diff --git a/views/about.html b/views/about.html new file mode 100644 index 000000000..baf9266e9 --- /dev/null +++ b/views/about.html @@ -0,0 +1,48 @@ + + + + + + About - Tony Hawk + + + + +
+

About Tony Hawk

+ +
+ +
+
+

Who is Tony Hawk?

+

Tony Hawk is a legendary professional skateboarder known for his incredible tricks and pioneering skateboarding culture. Born on May 12, 1968, in Carlsbad, California, he became the first skateboarder to land a 900-degree turn in 1999.

+
+ +
+

Career Highlights

+ +
+ +
+

Legacy

+

Tony Hawk's influence on skateboarding and youth culture is immense. He continues to inspire the next generation of skaters through his work with the Tony Hawk Foundation, which provides funding for public skateparks in low-income communities.

+
+
+ + + + + + diff --git a/views/home.html b/views/home.html new file mode 100644 index 000000000..d24ff3438 --- /dev/null +++ b/views/home.html @@ -0,0 +1,42 @@ + + + + + + Home - Tony Hawk + + + + +
+

Welcome to Tony Hawk's page made by Mike

+ +
+ +
+
+

About Tony Hawk

+

Tony Hawk, also known as "The Birdman," is a professional skateboarder, entrepreneur, and philanthropist. Explore his legacy in skateboarding!

+ Learn More +
+ +
+

Latest News

+

Check out the latest updates on Tony's events, competitions, and philanthropic efforts!

+
+
+ + + + + + + + + diff --git a/views/work.html b/views/work.html new file mode 100644 index 000000000..126254d6a --- /dev/null +++ b/views/work.html @@ -0,0 +1,47 @@ + + + + + + Works - Tony Hawk + + + + +
+

Tony Hawk's Works

+ +
+ +
+
+

Skateboarding Achievements

+

Tony has achieved numerous milestones throughout his career, including:

+ +
+ +
+

Video Game Series

+

The "Tony Hawk's Pro Skater" series has been pivotal in popularizing skateboarding among youth, showcasing various tricks and skateboarding culture. The series has sold millions of copies worldwide.

+
+ +
+

Philanthropic Efforts

+

Through the Tony Hawk Foundation, Tony Hawk has helped create over 600 public skateparks in low-income areas, giving youth a safe space to skate and be active.

+
+
+ + + + +